feat(frontend): deactivate delete note button if user is not owner

This button and its functionality only works if the user is the owner, so it doesn't make sense to make it possible to press it otherwise…

Signed-off-by: Philip Molares <philip.molares@udo.edu>

frontend/src/components/common/modals/__snapshots__/deletion-moadal.test.tsx.snap

@@ -1,5 +1,47 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`DeletionModal disables deletion when user is not owner 1`] = `
+<div
+  class="modal-dialog text-dark "
+  data-testid="commonModal"
+>
+  <div
+    class="modal-content"
+  >
+    <div
+      class="modal-header"
+    >
+      <div
+        class="modal-title h4"
+      >
+        <span />
+      </div>
+      <button
+        aria-label="Close"
+        class="btn-close"
+        type="button"
+      />
+    </div>
+    <div
+      class="text-dark modal-body"
+    >
+      testText
+    </div>
+    <div
+      class="modal-footer"
+    >
+      <button
+        class="btn btn-danger"
+        disabled=""
+        type="button"
+      >
+        testDeletionButton
+      </button>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`DeletionModal renders correctly with deletionButtonI18nKey 1`] = `
 <div
   class="modal-dialog text-dark "

frontend/src/components/common/modals/deletion-moadal.test.tsx

@@ -1,15 +1,37 @@
 /*
- * 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
  */
+import { mockNoteOwnership } from '../../../test-utils/note-ownership'
 import { mockI18n } from '../../markdown-renderer/test-utils/mock-i18n'
 import { DeletionModal } from './deletion-modal'
 import { render, screen } from '@testing-library/react'
 
 describe('DeletionModal', () => {
-  it('renders correctly with deletionButtonI18nKey', async () => {
+  beforeEach(async () => {
     await mockI18n()
+  })
+
+  afterEach(() => {
+    jest.resetAllMocks()
+    jest.resetModules()
+  })
+
+  it('renders correctly with deletionButtonI18nKey', async () => {
+    mockNoteOwnership('test', 'test')
+    const onConfirm = jest.fn()
+    render(
+      <DeletionModal onConfirm={onConfirm} deletionButtonI18nKey={'testDeletionButton'} show={true}>
+        testText
+      </DeletionModal>
+    )
+    const modal = await screen.findByTestId('commonModal')
+    expect(modal).toMatchSnapshot()
+  })
+
+  it('disables deletion when user is not owner', async () => {
+    mockNoteOwnership('test2', 'test')
     const onConfirm = jest.fn()
     render(
       <DeletionModal onConfirm={onConfirm} deletionButtonI18nKey={'testDeletionButton'} show={true}>

frontend/src/components/common/modals/deletion-modal.tsx

@@ -3,6 +3,7 @@
  *
  * SPDX-License-Identifier: AGPL-3.0-only
  */
+import { useIsOwner } from '../../../hooks/common/use-is-owner'
 import { cypressId } from '../../../utils/cypress-attribute'
 import type { CommonModalProps } from './common-modal'
 import { CommonModal } from './common-modal'
@@ -40,6 +41,7 @@ export const DeletionModal: React.FC<PropsWithChildren<DeletionModalProps>> = ({
   ...props
 }) => {
   useTranslation()
+  const isOwner = useIsOwner()
 
   return (
     <CommonModal
@@ -51,7 +53,7 @@ export const DeletionModal: React.FC<PropsWithChildren<DeletionModalProps>> = ({
       {...props}>
       <Modal.Body className='text-dark'>{children}</Modal.Body>
       <Modal.Footer>
-        <Button {...cypressId('deletionModal.confirmButton')} variant='danger' onClick={onConfirm}>
+        <Button {...cypressId('deletionModal.confirmButton')} variant='danger' onClick={onConfirm} disabled={!isOwner}>
           <Trans i18nKey={deletionButtonI18nKey} />
         </Button>
       </Modal.Footer>