diff options
author | crupest <crupest@outlook.com> | 2023-07-29 22:00:59 +0800 |
---|---|---|
committer | crupest <crupest@outlook.com> | 2023-07-29 22:00:59 +0800 |
commit | 22e8f24e7f7574915e4c75d3c6a5498f6e621ee8 (patch) | |
tree | a164dbcb6bf2e87e275cc736b65a22f34f788b14 /FrontEnd/src/views/common/dialog/index.ts | |
parent | 13f6f2a451feede8037d18cfbac64843e108ccbd (diff) | |
download | timeline-22e8f24e7f7574915e4c75d3c6a5498f6e621ee8.tar.gz timeline-22e8f24e7f7574915e4c75d3c6a5498f6e621ee8.tar.bz2 timeline-22e8f24e7f7574915e4c75d3c6a5498f6e621ee8.zip |
...
Diffstat (limited to 'FrontEnd/src/views/common/dialog/index.ts')
-rw-r--r-- | FrontEnd/src/views/common/dialog/index.ts | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/FrontEnd/src/views/common/dialog/index.ts b/FrontEnd/src/views/common/dialog/index.ts new file mode 100644 index 00000000..e37b9ed2 --- /dev/null +++ b/FrontEnd/src/views/common/dialog/index.ts @@ -0,0 +1,56 @@ +import { useState } from "react"; + +export { default as Dialog } from "./Dialog"; +export { default as FullPageDialog } from "./FullPageDialog"; +export { default as OperationDialog } from "./OperationDialog"; +export { default as ConfirmDialog } from "./ConfirmDialog"; + +type DialogMap<D extends string, V> = { + [K in D]: V; +}; + +type DialogKeyMap<D extends string> = DialogMap<D, number>; + +type DialogPropsMap<D extends string> = DialogMap< + D, + { key: number | string; open: boolean; onClose: () => void } +>; + +export function useDialog<D extends string>( + dialogs: D[], + initDialog?: D | null, +): { + dialog: D | null; + switchDialog: (newDialog: D | null) => void; + dialogPropsMap: DialogPropsMap<D>; + createDialogSwitch: (newDialog: D | null) => () => void; +} { + const [dialog, setDialog] = useState<D | null>(initDialog ?? null); + + const [dialogKeys, setDialogKeys] = useState<DialogKeyMap<D>>( + () => Object.fromEntries(dialogs.map((d) => [d, 0])) as DialogKeyMap<D>, + ); + + const switchDialog = (newDialog: D | null) => { + if (dialog !== null) { + setDialogKeys({ ...dialogKeys, [dialog]: dialogKeys[dialog] + 1 }); + } + setDialog(newDialog); + }; + + return { + dialog, + switchDialog, + dialogPropsMap: Object.fromEntries( + dialogs.map((d) => [ + d, + { + key: `${d}-${dialogKeys[d]}`, + open: dialog === d, + onClose: () => switchDialog(null), + }, + ]), + ) as DialogPropsMap<D>, + createDialogSwitch: (newDialog: D | null) => () => switchDialog(newDialog), + }; +} |