chore: components file name unify

2026-08-24 13:17:10 +08:00 · 2023-01-09 13:50:27 +08:00
parent 79d247ca04
commit 92d5f8f7c9
55 changed files with 56 additions and 56 deletions
@@ -0,0 +1,123 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useEffect,
+  useState,
+} from 'react';
+import type { PropsWithChildren } from 'react';
+import ShortcutsModal from '@/components/shortcuts-modal';
+import ContactModal from '@/components/contact-modal';
+import QuickSearch from '@/components/quick-search';
+import { ImportModal } from '@/components/import';
+import { LoginModal } from '@/components/login-modal';
+
+type ModalContextValue = {
+  triggerShortcutsModal: () => void;
+  triggerContactModal: () => void;
+  triggerQuickSearchModal: (visible?: boolean) => void;
+  triggerImportModal: () => void;
+  triggerLoginModal: () => void;
+};
+type ModalContextProps = PropsWithChildren<Record<string, unknown>>;
+type ModalMap = {
+  contact: boolean;
+  shortcuts: boolean;
+  quickSearch: boolean;
+  import: boolean;
+  login: boolean;
+};
+
+export const ModalContext = createContext<ModalContextValue>({
+  triggerShortcutsModal: () => {},
+  triggerContactModal: () => {},
+  triggerQuickSearchModal: () => {},
+  triggerImportModal: () => {},
+  triggerLoginModal: () => {},
+});
+
+export const useModal = () => useContext(ModalContext);
+
+export const ModalProvider = ({
+  children,
+}: PropsWithChildren<ModalContextProps>) => {
+  const [modalMap, setModalMap] = useState<ModalMap>({
+    contact: false,
+    shortcuts: false,
+    quickSearch: false,
+    import: false,
+    login: false,
+  });
+
+  const triggerHandler = useCallback(
+    (key: keyof ModalMap, visible?: boolean) => {
+      setModalMap({
+        ...modalMap,
+        [key]: visible ?? !modalMap[key],
+      });
+    },
+    [modalMap]
+  );
+  useEffect(() => {
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    window.triggerHandler = () => triggerHandler('login');
+  }, [triggerHandler]);
+
+  return (
+    <ModalContext.Provider
+      value={{
+        triggerShortcutsModal: () => {
+          triggerHandler('shortcuts');
+        },
+        triggerContactModal: () => {
+          triggerHandler('contact');
+        },
+        triggerQuickSearchModal: (visible?) => {
+          triggerHandler('quickSearch', visible);
+        },
+        triggerImportModal: () => {
+          triggerHandler('import');
+        },
+        triggerLoginModal: () => {
+          triggerHandler('login');
+        },
+      }}
+    >
+      <ContactModal
+        open={modalMap.contact}
+        onClose={() => {
+          triggerHandler('contact', false);
+        }}
+      ></ContactModal>
+      <ShortcutsModal
+        open={modalMap.shortcuts}
+        onClose={() => {
+          triggerHandler('shortcuts', false);
+        }}
+      ></ShortcutsModal>
+      <QuickSearch
+        open={modalMap.quickSearch}
+        onClose={() => {
+          triggerHandler('quickSearch', false);
+        }}
+      ></QuickSearch>
+      <ImportModal
+        open={modalMap.import}
+        onClose={() => {
+          triggerHandler('import', false);
+        }}
+      ></ImportModal>
+      <LoginModal
+        open={modalMap.login}
+        onClose={() => {
+          triggerHandler('login', false);
+        }}
+      />
+      {children}
+    </ModalContext.Provider>
+  );
+};
+
+export default ModalProvider;