diff --git a/src/lang/en/home.json b/src/lang/en/home.json index c98dfaeb7..1f04c47a2 100644 --- a/src/lang/en/home.json +++ b/src/lang/en/home.json @@ -92,6 +92,9 @@ "recursive_move_directory-tips": "Are you sure you want to move all files in the current folder and its subfolders to the specified folder?", "remove_empty_directory": "Remove Empty Folder", "remove_empty_directory-tips": "Are you sure to delete all its empty subfolders?", + "recurse_list": "Recursive List", + "recurse_list_interval": "Interval (seconds)", + "recurse_list_refresh": "Refresh", "batch_rename": "Batch Rename", "regex_rename": "Regex Rename", "sequential_renaming": "Sequential Rename", diff --git a/src/pages/home/toolbar/RecurseList.tsx b/src/pages/home/toolbar/RecurseList.tsx new file mode 100644 index 000000000..7942fc216 --- /dev/null +++ b/src/pages/home/toolbar/RecurseList.tsx @@ -0,0 +1,120 @@ +import { + Button, + FormControl, + FormLabel, + HStack, + IconButton, + Input, + Modal, + ModalBody, + ModalContent, + ModalFooter, + ModalHeader, + ModalOverlay, + Switch as HopeSwitch, + createDisclosure, +} from "@hope-ui/solid" +import { useFetch, usePath, useRouter, useT } from "~/hooks" +import { bus, fsRecurseList, handleRespWithNotifySuccess } from "~/utils" +import { createSignal, onCleanup } from "solid-js" +import { FaSolidMinus, FaSolidPlus } from "solid-icons/fa" + +export const RecurseList = () => { + const { isOpen, onOpen, onClose } = createDisclosure() + const { pathname } = useRouter() + const [loading, ok] = useFetch(fsRecurseList) + const { refresh } = usePath() + const [intervalSec, setIntervalSec] = createSignal(3) + const [refreshEnabled, setRefreshEnabled] = createSignal(false) + const t = useT() + + const handler = (name: string) => { + if (name === "recurseList") { + setIntervalSec(3) + setRefreshEnabled(false) + onOpen() + } + } + bus.on("tool", handler) + onCleanup(() => { + bus.off("tool", handler) + }) + + const handleSubmit = async () => { + const resp = await ok(pathname(), refreshEnabled(), intervalSec()) + handleRespWithNotifySuccess(resp, () => { + refresh() + onClose() + }) + } + + return ( + + + + {t("home.toolbar.recurse_list")} + + + {t("home.toolbar.recurse_list_interval")} + + } + onClick={() => { + setIntervalSec((prev) => Math.max(0, prev - 1)) + }} + /> + { + const value = parseInt(e.currentTarget.value) || 0 + setIntervalSec(Math.max(0, value)) + }} + style={{ + "-moz-appearance": "textfield", + "::-webkit-inner-spin-button": { display: "none" }, + "::-webkit-outer-spin-button": { display: "none" }, + }} + class="hide-spin" + textAlign="center" + /> + } + onClick={() => { + setIntervalSec((prev) => prev + 1) + }} + /> + + + + {t("home.toolbar.recurse_list_refresh")} + { + setRefreshEnabled(e.currentTarget.checked) + }} + /> + + + + + + + + + ) +} diff --git a/src/pages/home/toolbar/Right.tsx b/src/pages/home/toolbar/Right.tsx index 82ec5ac8b..6b26226c3 100644 --- a/src/pages/home/toolbar/Right.tsx +++ b/src/pages/home/toolbar/Right.tsx @@ -101,6 +101,13 @@ export const Right = () => { bus.emit("tool", "removeEmptyDirectory") }} /> + { + bus.emit("tool", "recurseList") + }} + /> import("../uploads/Upload")) @@ -33,6 +34,7 @@ export const Modal = () => { + diff --git a/src/pages/home/toolbar/operations.ts b/src/pages/home/toolbar/operations.ts index 2f50c4976..1e18c92d7 100644 --- a/src/pages/home/toolbar/operations.ts +++ b/src/pages/home/toolbar/operations.ts @@ -8,6 +8,7 @@ import { CgFileAdd, CgFolderAdd, CgFolderRemove } from "solid-icons/cg" import { AiOutlineCloudDownload } from "solid-icons/ai" import { ImMoveUp } from "solid-icons/im" import { BiRegularRename } from "solid-icons/bi" +import { BiRegularSitemap } from "solid-icons/bi" export interface Operations { [key: string]: { @@ -31,6 +32,7 @@ export const operations: Operations = { cancel_select: { icon: TiDeleteOutline }, download: { icon: AiOutlineCloudDownload, color: "$primary9" }, share: { icon: CgShare, color: "$primary9" }, + recurse_list: { icon: BiRegularSitemap, p: true }, } // interface Operation { // label: string; diff --git a/src/utils/api.ts b/src/utils/api.ts index 26e5985d9..9d470b6c6 100644 --- a/src/utils/api.ts +++ b/src/utils/api.ts @@ -281,3 +281,11 @@ export const updateIndex = async (paths = [], max_depth = -1): PEmptyResp => { max_depth, }) } + +export const fsRecurseList = ( + path: string, + refresh: boolean, + interval_sec: number, +): PEmptyResp => { + return r.post("/fs/recurse_list", { path, refresh, interval_sec }) +}