cleanup

2025-10-31 02:06:38 +01:00
parent 17db827e3a
commit f796932cd8
6 changed files with 493 additions and 306 deletions
@@ -0,0 +1,219 @@
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import TagsPanel from '../tags/TagsPanel';
+import CorrespondentsPanel from '../correspondents/CorrespondentsPanel';
+import DocumentTypesPanel from '../documentTypes/DocumentTypesPanel';
+
+const TAGS_MODAL = 'tags';
+const CORRESPONDENTS_MODAL = 'correspondents';
+const DOCUMENT_TYPES_MODAL = 'document-types';
+
+export const useManagementModals = ({
+  locationPathname,
+  tags,
+  refreshTags,
+  onTagCreate,
+  onTagUpdate,
+  onTagDelete,
+  correspondents,
+  refreshCorrespondents,
+  onCorrespondentCreate,
+  onCorrespondentUpdate,
+  onCorrespondentDelete,
+  documentTypes,
+  refreshDocumentTypes,
+  onDocumentTypeCreate,
+  onDocumentTypeUpdate,
+  onDocumentTypeDelete,
+  setStatusMessage,
+}) => {
+  const [activeModal, setActiveModal] = useState(null);
+
+  const openTagsModal = useCallback(() => setActiveModal(TAGS_MODAL), []);
+  const openCorrespondentsModal = useCallback(
+    () => setActiveModal(CORRESPONDENTS_MODAL),
+    [],
+  );
+  const openDocumentTypesModal = useCallback(
+    () => setActiveModal(DOCUMENT_TYPES_MODAL),
+    [],
+  );
+  const closeActiveModal = useCallback(() => setActiveModal(null), []);
+
+  useEffect(() => {
+    setActiveModal(null);
+  }, [locationPathname]);
+
+  useEffect(() => {
+    if (!activeModal) {
+      return undefined;
+    }
+    const handleKeyDown = (event) => {
+      if (event.key === 'Escape') {
+        event.preventDefault();
+        setActiveModal(null);
+      }
+    };
+    window.addEventListener('keydown', handleKeyDown);
+    return () => window.removeEventListener('keydown', handleKeyDown);
+  }, [activeModal]);
+
+  const tagModal = useMemo(() => {
+    if (activeModal !== TAGS_MODAL) {
+      return null;
+    }
+    return (
+      <div
+        className="modal-backdrop"
+        role="presentation"
+        onClick={closeActiveModal}
+      >
+        <div
+          className="modal modal--panel"
+          role="dialog"
+          aria-modal="true"
+          aria-labelledby="tags-modal-title"
+          onClick={(event) => event.stopPropagation()}
+        >
+          <div className="panel-modal__header">
+            <h3 id="tags-modal-title">Manage Tags</h3>
+            <button type="button" className="secondary" onClick={closeActiveModal}>
+              Close
+            </button>
+          </div>
+          <div className="panel-modal__body">
+            <TagsPanel
+              tags={tags}
+              onRefresh={refreshTags}
+              onCreateTag={onTagCreate}
+              onUpdateTag={onTagUpdate}
+              onDeleteTag={onTagDelete}
+              onNotify={setStatusMessage}
+            />
+          </div>
+        </div>
+      </div>
+    );
+  }, [
+    activeModal,
+    closeActiveModal,
+    onTagCreate,
+    onTagDelete,
+    onTagUpdate,
+    refreshTags,
+    setStatusMessage,
+    tags,
+  ]);
+
+  const correspondentsModal = useMemo(() => {
+    if (activeModal !== CORRESPONDENTS_MODAL) {
+      return null;
+    }
+    return (
+      <div
+        className="modal-backdrop"
+        role="presentation"
+        onClick={closeActiveModal}
+      >
+        <div
+          className="modal modal--panel"
+          role="dialog"
+          aria-modal="true"
+          aria-labelledby="correspondents-modal-title"
+          onClick={(event) => event.stopPropagation()}
+        >
+          <div className="panel-modal__header">
+            <h3 id="correspondents-modal-title">Manage Correspondents</h3>
+            <button type="button" className="secondary" onClick={closeActiveModal}>
+              Close
+            </button>
+          </div>
+          <div className="panel-modal__body">
+            <CorrespondentsPanel
+              correspondents={correspondents}
+              onRefresh={refreshCorrespondents}
+              onCreate={onCorrespondentCreate}
+              onUpdate={onCorrespondentUpdate}
+              onDelete={onCorrespondentDelete}
+              onNotify={setStatusMessage}
+            />
+          </div>
+        </div>
+      </div>
+    );
+  }, [
+    activeModal,
+    closeActiveModal,
+    correspondents,
+    onCorrespondentCreate,
+    onCorrespondentDelete,
+    onCorrespondentUpdate,
+    refreshCorrespondents,
+    setStatusMessage,
+  ]);
+
+  const documentTypesModal = useMemo(() => {
+    if (activeModal !== DOCUMENT_TYPES_MODAL) {
+      return null;
+    }
+    return (
+      <div
+        className="modal-backdrop"
+        role="presentation"
+        onClick={closeActiveModal}
+      >
+        <div
+          className="modal modal--panel"
+          role="dialog"
+          aria-modal="true"
+          aria-labelledby="document-types-modal-title"
+          onClick={(event) => event.stopPropagation()}
+        >
+          <div className="panel-modal__header">
+            <h3 id="document-types-modal-title">Manage Document Types</h3>
+            <button type="button" className="secondary" onClick={closeActiveModal}>
+              Close
+            </button>
+          </div>
+          <div className="panel-modal__body">
+            <DocumentTypesPanel
+              documentTypes={documentTypes}
+              onRefresh={refreshDocumentTypes}
+              onCreate={onDocumentTypeCreate}
+              onUpdate={onDocumentTypeUpdate}
+              onDelete={onDocumentTypeDelete}
+              onNotify={setStatusMessage}
+            />
+          </div>
+        </div>
+      </div>
+    );
+  }, [
+    activeModal,
+    closeActiveModal,
+    documentTypes,
+    onDocumentTypeCreate,
+    onDocumentTypeDelete,
+    onDocumentTypeUpdate,
+    refreshDocumentTypes,
+    setStatusMessage,
+  ]);
+
+  const managementModals = (
+    <>
+      {tagModal}
+      {correspondentsModal}
+      {documentTypesModal}
+    </>
+  );
+
+  return {
+    managementModals,
+    openTagsModal,
+    openCorrespondentsModal,
+    openDocumentTypesModal,
+    closeActiveModal,
+    activeModal,
+  };
+};
+
+export default useManagementModals;