mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-23 03:27:05 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add boolean state hook

Browse source 
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2022-07-08 20:30:11 +02:00
parent 311d37b16f
commit 50d2dee9d2
15 changed files with 114 additions and 118 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/components/editor-page/sidebar/delete-note-sidebar-entry/delete-note-sidebar-entry.tsx
View file

@ -1,11 +1,11 @@
/*
* SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import type { PropsWithChildren } from 'react'
import React, { Fragment, useCallback, useState } from 'react'
import React, { Fragment, useCallback } from 'react'
import { Trans, useTranslation } from 'react-i18next'
import { SidebarButton } from '../sidebar-button/sidebar-button'
import type { SpecificSidebarEntryProps } from '../types'
@ -14,7 +14,7 @@ import { cypressId } from '../../../../utils/cypress-attribute'
import { showErrorNotification } from '../../../../redux/ui-notifications/methods'
import { deleteNote } from '../../../../api/notes'
import { DeleteNoteModal } from './delete-note-modal'
import { ShowIf } from '../../../common/show-if/show-if'
import { useBooleanState } from '../../../../hooks/common/use-boolean-state'
/**
* Sidebar entry that can be used to delete the current note.
@ -24,15 +24,11 @@ import { ShowIf } from '../../../common/show-if/show-if'
*/
export const DeleteNoteSidebarEntry: React.FC<PropsWithChildren<SpecificSidebarEntryProps>> = ({ hide, className }) => {
useTranslation()
const [showDialog, setShowDialog] = useState(false)
const noteId = useApplicationState((state) => state.noteDetails.id)
const openDialog = useCallback(() => setShowDialog(true), [])
const closeDialog = useCallback(() => setShowDialog(false), [])
const [modalVisibility, showModal, closeModal] = useBooleanState()
const deleteNoteAndCloseDialog = useCallback(() => {
deleteNote(noteId)
.catch(showErrorNotification('landing.history.error.deleteNote.text'))
.finally(() => setShowDialog(false))
}, [noteId])
deleteNote(noteId).catch(showErrorNotification('landing.history.error.deleteNote.text')).finally(closeModal)
}, [closeModal, noteId])
return (
<Fragment>
@ -41,12 +37,10 @@ export const DeleteNoteSidebarEntry: React.FC<PropsWithChildren<SpecificSidebarE
icon={'trash'}
className={className}
hide={hide}
onClick={openDialog}>
onClick={showModal}>
<Trans i18nKey={'landing.history.menu.deleteNote'} />
</SidebarButton>
<ShowIf condition={showDialog}>
<DeleteNoteModal onHide={closeDialog} onConfirm={deleteNoteAndCloseDialog} show={showDialog} />
</ShowIf>
<DeleteNoteModal onHide={closeModal} onConfirm={deleteNoteAndCloseDialog} show={modalVisibility} />
</Fragment>
)
}