feat(frontend): if user can't write toolbar is being removed

Signed-off-by: Philip Molares <philip.molares@udo.edu>
This commit is contained in:
Philip Molares 2023-03-27 11:47:25 +02:00 committed by Tilman Vatteroth
parent c2f41118b6
commit 7636480d8a

View file

@ -1,8 +1,10 @@
/* /*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file) * SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
* *
* SPDX-License-Identifier: AGPL-3.0-only * SPDX-License-Identifier: AGPL-3.0-only
*/ */
import { useMayEdit } from '../../../../hooks/common/use-may-edit'
import { ShowIf } from '../../../common/show-if/show-if'
import { BoldButton } from './buttons/bold-button' import { BoldButton } from './buttons/bold-button'
import { CheckListButton } from './buttons/check-list-button' import { CheckListButton } from './buttons/check-list-button'
import { CodeFenceButton } from './buttons/code-fence-button' import { CodeFenceButton } from './buttons/code-fence-button'
@ -33,7 +35,10 @@ const EmojiPickerButton = React.lazy(() => import('./emoji-picker/emoji-picker-b
* Renders the toolbar of the editor with buttons for formatting or inserting text. * Renders the toolbar of the editor with buttons for formatting or inserting text.
*/ */
export const ToolBar: React.FC = () => { export const ToolBar: React.FC = () => {
const mayEdit = useMayEdit()
return ( return (
<ShowIf condition={mayEdit}>
<ButtonToolbar className={`bg-light ${styles.toolbar}`}> <ButtonToolbar className={`bg-light ${styles.toolbar}`}>
<ButtonGroup className={'mx-1 flex-wrap'}> <ButtonGroup className={'mx-1 flex-wrap'}>
<BoldButton /> <BoldButton />
@ -67,5 +72,6 @@ export const ToolBar: React.FC = () => {
</Suspense> </Suspense>
</ButtonGroup> </ButtonGroup>
</ButtonToolbar> </ButtonToolbar>
</ShowIf>
) )
} }