From 4dc6a47813a72d5f4f3b0a9e53b10d40faafdff2 Mon Sep 17 00:00:00 2001 From: Neila Date: Sun, 31 Mar 2024 20:50:31 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20=E6=B7=BB=E5=8A=A0=E5=9C=A8?= =?UTF-8?q?=E4=B8=BB=E9=A1=B5=E5=8F=AF=E5=88=A0=E9=99=A4=E6=89=A9=E5=B1=95?= =?UTF-8?q?=E5=B7=A5=E5=85=B7=E7=9A=84=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/index/SingleTool.tsx | 31 ++++++++- src/app/locales/zh-CN.json | 3 +- .../extensions/RemoveExtensionDialog.tsx | 57 ++++++++++++++++ .../setting/extensions/clearExtensionData.tsx | 34 ++++++++++ src/app/setting/extensions/page.tsx | 66 +++++-------------- 5 files changed, 138 insertions(+), 53 deletions(-) create mode 100644 src/app/setting/extensions/RemoveExtensionDialog.tsx create mode 100644 src/app/setting/extensions/clearExtensionData.tsx diff --git a/src/app/index/SingleTool.tsx b/src/app/index/SingleTool.tsx index cd371cf5..1e3d0fd8 100644 --- a/src/app/index/SingleTool.tsx +++ b/src/app/index/SingleTool.tsx @@ -1,5 +1,6 @@ "use client"; import { + createElement, useContext, useState } from 'react'; @@ -14,7 +15,8 @@ import { import { ExitToApp as ExitToAppIcon, DragIndicator as DragIndicatorIcon, - Delete + Delete, + FolderDelete } from "@mui/icons-material"; import { tool @@ -51,6 +53,7 @@ import { import destroyer from '../components/destroyer'; import MouseOverPopover from '../components/Popover'; import useStoragedState from '../components/useStoragedState'; +import { NXTMetadata } from '../setting/extensions/page'; export default function SingleTool(props: { tool: tool; isFirst: boolean; @@ -84,6 +87,7 @@ export default function SingleTool(props: { color = colorContext.value, [jumpto, setJumpTo] = useState(""), homeWhere = useContext(homeWhereContext), + [removeDialogOpen, setRemoveDialogOpen] = useState(false), [elevation, setElevation] = useState(2), [jumpName, setJumpName] = useState(""), [jumpDialogOpen, setJumpDialogOpen] = useState(false), @@ -221,6 +225,29 @@ export default function SingleTool(props: { display: "flex", alignItems: "center" }}> + {tool.to.startsWith("/tools/extension") && ( + <> + + { + setRemoveDialogOpen(true); + }}> + + + + {createElement(dynamic(() => import("../setting/extensions/RemoveExtensionDialog")), { + open: removeDialogOpen, + reset: () => setRemoveDialogOpen(false), + fileInfo: { + ...tool, + to: tool.to.replace("/tools/extension?tool=", "") as Lowercase, + settings: [], + main: "" + } as unknown as NXTMetadata, + files: [], + onTrue: () => setTools(old => old.slice(0).filter(atool => atool.to !== tool.to)) + })} + + )} {sortingFor !== "__global__" && sortingFor !== "__home__" && ( { @@ -232,7 +259,7 @@ export default function SingleTool(props: { })); setTools(old => old.slice(0).filter(atool => atool.to !== tool.to)) }}> - + )} diff --git a/src/app/locales/zh-CN.json b/src/app/locales/zh-CN.json index bd3694b3..fd3d65e1 100644 --- a/src/app/locales/zh-CN.json +++ b/src/app/locales/zh-CN.json @@ -324,6 +324,7 @@ }, "singleTool": { "jump": "确定离开Verkfi并跳转至", - "deleteFromCategory": "从此分类中删除此工具" + "deleteFromCategory": "从此分类中删除此工具", + "deleteExtension": "删除此扩展工具" } } diff --git a/src/app/setting/extensions/RemoveExtensionDialog.tsx b/src/app/setting/extensions/RemoveExtensionDialog.tsx new file mode 100644 index 00000000..090f05d8 --- /dev/null +++ b/src/app/setting/extensions/RemoveExtensionDialog.tsx @@ -0,0 +1,57 @@ +"use client"; +import { + FormControlLabel, + Checkbox +} from "@mui/material"; +import { + useContext, + useState +} from "react"; +import { + get +} from "react-intl-universal"; +import db from "../../components/db"; +import CheckDialog from "../../components/dialog/CheckDialog"; +import { + lists as listsContext, + mostUsed as mostUsedContext, + recentlyUsed as recentlyUsedContext +} from "../../layout/layoutClient"; +import clearExtensionData from "./clearExtensionData"; +import { + NXTMetadata +} from "./page"; +export default function RemoveExtensionDialog(props: { + open: boolean; + reset: () => any; + fileInfo: NXTMetadata; + onTrue?: () => any; + files: [string, Uint8Array][]; +}) { + const [clearData, setClearData] = useState(false), + recentlyUsed = useContext(recentlyUsedContext), + mostUsed = useContext(mostUsedContext), + lists = useContext(listsContext); + return ( + { + setClearData(event.target.checked); + }} />} label={get("extensions.clear")} />} onFalse={() => { + props.reset(); + setClearData(false); + }} onTrue={async () => { + debugger + if (lists.value !== undefined) { + lists.set(lists.value.map(singleList => [singleList[0], singleList[1].filter(item => item !== `/tools/extension?tool=${props.fileInfo.to}`)])); + } + if (clearData) { + clearExtensionData(props.fileInfo, props.files, recentlyUsed, mostUsed); + } + await db.extensionTools.delete(props.fileInfo.to); + setClearData(false); + if ("onTrue" in props) { + props.onTrue(); + } + return props.reset(); + }} open={props.open} title={get("extensions.删除扩展")} description={`${get("extensions.确定删除扩展")}${props.fileInfo.name}?`} /> + ); +} diff --git a/src/app/setting/extensions/clearExtensionData.tsx b/src/app/setting/extensions/clearExtensionData.tsx new file mode 100644 index 00000000..96dbcbda --- /dev/null +++ b/src/app/setting/extensions/clearExtensionData.tsx @@ -0,0 +1,34 @@ +"use client"; +import db from "../../components/db"; +import { + mostUsedMarks +} from "../../layout/layoutClient"; +import { + setState +} from "../../declare"; +import { + NXTMetadata +} from "./page"; +export default async function clearExtensionData(clearingExtension: NXTMetadata, clearingFiles: [string, Uint8Array][], recentlyUsed: { + value: string[]; + set: setState; +}, mostUsed: { + value: mostUsedMarks; + set: setState; +}) { + await db.extensionTools.put({ + ...clearingExtension, + files: clearingFiles, + settings: clearingExtension.settings.map(setting => ({ + ...setting, + value: setting.defaultValue + })) + }); + const oldRecently = recentlyUsed.value; + recentlyUsed.set(oldRecently.filter(item => item !== clearingExtension.to)); + const oldMost = { + ...mostUsed.value + }; + Reflect.deleteProperty(oldMost, clearingExtension.to); + mostUsed.set(oldMost); +} diff --git a/src/app/setting/extensions/page.tsx b/src/app/setting/extensions/page.tsx index a790bf55..d0050180 100644 --- a/src/app/setting/extensions/page.tsx +++ b/src/app/setting/extensions/page.tsx @@ -7,8 +7,6 @@ import { Divider, IconButton, Box, - FormControlLabel, - Checkbox, useMediaQuery, useTheme, ButtonGroup @@ -31,7 +29,8 @@ const PureDialog = dynamic(() => import("../../components/dialog/PureDialog")); import { FilePondFile, FilePondServerConfigProps -} from 'filepond'; import { +} from 'filepond'; +import { Add as AddIcon, Edit as EditIcon, SyncProblem as SyncProblemIcon, @@ -41,10 +40,8 @@ import { useLiveQuery } from "dexie-react-hooks"; import db, { - option, single } from "../../components/db"; -import CheckDialog from "../../components/dialog/CheckDialog"; import DialogInputs from "./DialogInputs"; import { lists as listsContext, @@ -61,9 +58,8 @@ import { import { emptyNXTMetadata } from "../../tools/extension/empties"; -import { - lists -} from "../../index/Sidebar"; +import clearExtensionData from "./clearExtensionData"; +import RemoveExtensionDialog from "./RemoveExtensionDialog"; export type inputTypes = "modify" | "add"; export default function ExtensionManager() { const [addDialogOpen, setAddDialogOpen] = useState(false), @@ -73,11 +69,10 @@ export default function ExtensionManager() { [removeDialogOpen, setRemoveDialogOpen] = useState(false), [modifyDialogOpen, setModifyDialogOpen] = useState(false), lists = useContext(listsContext), - [clearData, setClearData] = useState(false), theme = useTheme(), fullScreen = useMediaQuery(theme.breakpoints.down('sm')), dialogButtons = (type: "modify" | "add") => - {files.length !== 0 &&