chore: Merge pull request #38 from alist-org/dev

Dev 2.4.0
AlistGo · Apr 17, 2022 · 524e808 · 524e808
2 parents 3cb5caf + 4759c84
commit 524e808
Show file tree

Hide file tree

Showing 13 changed files with 514 additions and 137 deletions.
diff --git a/index.html b/index.html
@@ -3,24 +3,47 @@
   <head>
     <!-- customize head -->
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="https://cdn.jsdelivr.net/gh/alist-org/logo@main/logo.svg" />
+    <link
+      rel="icon"
+      type="image/svg+xml"
+      href="https://cdn.jsdelivr.net/gh/alist-org/logo@main/logo.svg"
+    />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="referrer" content="no-referrer">
+    <meta name="referrer" content="no-referrer" />
     <meta name="generator" content="Alist V2" />
     <script src="https://g.alicdn.com/IMM/office-js/1.1.5/aliyun-web-office-sdk.min.js"></script>
+    <script>
+      window.matchMediaBak = window.matchMedia;
+      window.matchMedia = function (e) {
+        let result = window.matchMediaBak(e);
+        if (!result.addEventListener) {
+          result.addEventListener = function (event, listener) {
+            result.addListener(listener);
+          };
+          result.removeEventListener = function (event, listener) {
+            result.removeListener(listener);
+          };
+        }
+        return result;
+      };
+      this.globalThis || (this.globalThis = this);
+    </script>
     <title>Loading...</title>
   </head>
   <body>
     <script>
       window.ALIST = {
-        cdn:"/CDN_URL/",
-        api:undefined,
-      }
+        cdn: "/CDN_URL/",
+        api: undefined,
+      };
     </script>
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
     <noscript>
-      <strong>We're sorry but alist doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+      <strong
+        >We're sorry but alist doesn't work properly without JavaScript enabled.
+        Please enable it to continue.</strong
+      >
     </noscript>
     <!-- customize body -->
   </body>

diff --git a/package.json b/package.json
@@ -60,6 +60,7 @@
     "@types/react-dom": "^17.0.11",
     "@types/react-router-dom": "^5.1.8",
     "@types/streamsaver": "^2.0.1",
+    "@vitejs/plugin-legacy": "^1.8.1",
     "@vitejs/plugin-react-refresh": "^1.3.1",
     "typescript": "^4.5.4",
     "vite": "^2.7.10",

diff --git a/src/pages/list/context.tsx b/src/pages/list/context.tsx
@@ -36,6 +36,7 @@ export interface Meta {
   driver: string;
   upload: boolean;
   total: number;
+  readme: string;
 }
 
 export interface PathResp {
@@ -68,7 +69,8 @@ type TypeType =
   | "error"
   | "loading"
   | "unauthorized"
-  | "nexting";
+  | "nexting"
+  | "search";
 
 interface Sort {
   orderBy?: "name" | "updated_at" | "size";
@@ -132,7 +134,7 @@ export const IContext = createContext<ContextProps>({
   selectFiles: [],
   setSelectFiles: () => {},
   setType: () => {},
-  meta: { driver: "", upload: false, total: 0 },
+  meta: { driver: "", upload: false, total: 0, readme: "" },
   setMeta: () => {},
   loggedIn: false,
   page: { page_num: 1, page_size: 30 },
@@ -263,6 +265,7 @@ const IContextProvider = (props: any) => {
     driver: "",
     upload: false,
     total: 0,
+    readme: "",
   });
   const [loggedIn, setLoggedIn] = React.useState<boolean>(false);
   if (!settingLoaded) {

diff --git a/src/pages/list/index.tsx b/src/pages/list/index.tsx
@@ -47,11 +47,14 @@ const Do = (props: any) => {
   const history = useHistory();
   const location = useLocation();
   const toast = useToast();
-  const { path,cancelPath } = useApi();
+  const { path, cancelPath } = useApi();
   const refresh = useSyncCallback(() => {
     if (!settingLoaded) {
       return;
     }
+    if (switchToSearch()) {
+      return;
+    }
     cancelPath();
     console.log("refresh");
     console.log(page);
@@ -159,6 +162,20 @@ const Do = (props: any) => {
   useChangeEffect(() => {
     nextPage();
   }, [page]);
+  const switchToSearch = () => {
+    const query = new URLSearchParams(location.search);
+    const search = query.get("s");
+    if (search) {
+      setType("search");
+      return true;
+    }
+    return false;
+  };
+  useEffect(() => {
+    if(!switchToSearch()){
+      allRefresh();
+    }
+  }, [location.search]);
   const { isOpen, onClose, onOpen } = useDisclosure();
   const initialRef = React.useRef();
   useEffect(() => {

diff --git a/src/pages/list/layout/header.tsx b/src/pages/list/layout/header.tsx
@@ -9,8 +9,9 @@ import {
   Tooltip,
   useColorModeValue,
   Box,
+  SlideFade,
 } from "@chakra-ui/react";
-import React, { useContext, useRef } from "react";
+import React, { useContext, useRef, useState } from "react";
 import { IContext } from "../context";
 import { FaListUl } from "react-icons/fa";
 // import { AiTwotoneCopy } from "react-icons/ai";
@@ -25,6 +26,7 @@ import { Link, useLocation } from "react-router-dom";
 import { copyToClip } from "../../../utils/copy-clip";
 import useFileUrl from "../../../hooks/useFileUrl";
 import Uploader, { UploaderHandle } from "./uploader";
+import Search from "./search";
 
 const Header = () => {
   const { t } = useTranslation();
@@ -46,16 +48,14 @@ const Header = () => {
     logos.split(",").shift(),
     logos.split(",").pop()
   ) as string;
-  const { pathname } = useLocation();
   const uploadRef = useRef<UploaderHandle>(null);
+  const [isSearch, setIsSearch] = useState(false);
   return (
     <Flex className="header" px="2" py="2" justify="space-between" w="full">
       <Link to="/" className="logo">
         {logo.includes("http") ? (
           <Image
-            fallback={
-              <Spinner color={getSetting("icon color") || "#1890ff"} />
-            }
+            fallback={<Spinner color={getSetting("icon color") || "#1890ff"} />}
             rounded="lg"
             h="44px"
             w="auto"
@@ -66,113 +66,117 @@ const Header = () => {
         )}
       </Link>
       <HStack className="buttons" spacing="2">
-        {type === "file" && (
-          <Tooltip
-            shouldWrapChildren
-            hasArrow
-            placement="bottom"
-            label={t("Download")}
-          >
-            <Icon
-              cursor="pointer"
-              boxSize={6}
-              as={BsFillArrowDownCircleFill}
-              onClick={() => {
-                if (type === "file") {
-                  let url = fileUrl();
-                  window.open(url, "_blank");
-                  return;
-                }
-                // if (multiSelect) {
-                //   downPack(selectFiles);
-                //   return;
-                // }
-                // if (type === "folder") {
-                //   downPack(files);
-                //   return;
-                // }
-              }}
-            />
-          </Tooltip>
+        {["folder", "search"].includes(type) && (
+          <Search isSearch={isSearch} setIsSearch={setIsSearch} />
         )}
-        {type === "folder" &&
-          !getSetting("no upload").split(",").includes(meta.driver) &&
-          (meta.upload || loggedIn) && (
-            <Box>
+        {!isSearch && (
+          <SlideFade in={!isSearch} offsetX="20px" offsetY={0}>
+            <HStack spacing="2">
+              {type === "file" && (
+                <Tooltip
+                  shouldWrapChildren
+                  hasArrow
+                  placement="bottom"
+                  label={t("Download")}
+                >
+                  <Icon
+                    cursor="pointer"
+                    boxSize={6}
+                    as={BsFillArrowDownCircleFill}
+                    onClick={() => {
+                      if (type === "file") {
+                        let url = fileUrl();
+                        window.open(url, "_blank");
+                        return;
+                      }
+                    }}
+                  />
+                </Tooltip>
+              )}
+              {type === "folder" &&
+                !getSetting("no upload").split(",").includes(meta.driver) &&
+                (meta.upload || loggedIn) && (
+                  <Box>
+                    <Tooltip
+                      shouldWrapChildren
+                      hasArrow
+                      placement="bottom"
+                      label={t("Upload file")}
+                    >
+                      <Icon
+                        cursor="pointer"
+                        boxSize={6}
+                        as={BsFillArrowUpCircleFill}
+                        onClick={() => {
+                          uploadRef.current!.upload();
+                        }}
+                      />
+                    </Tooltip>
+                    <Uploader ref={uploadRef} />
+                  </Box>
+                )}
+              {type !== "error" && (
+                <Tooltip
+                  shouldWrapChildren
+                  hasArrow
+                  placement="bottom"
+                  label={t("Copy direct link")}
+                >
+                  <Icon
+                    cursor="pointer"
+                    boxSize={6}
+                    as={IoIosCopy}
+                    onClick={() => {
+                      let content = "";
+                      if (type === "file") {
+                        content = fileUrl();
+                      } else {
+                        let files_ = files;
+                        if (multiSelect) {
+                          files_ = selectFiles;
+                        }
+                        content = files_
+                          .filter((file) => file.type !== 1)
+                          .map((file) => {
+                            return fileUrl(file);
+                          })
+                          .join("\n");
+                      }
+                      copyToClip(content);
+                      toast({
+                        title: t("Copied"),
+                        status: "success",
+                        duration: 3000,
+                        isClosable: true,
+                      });
+                    }}
+                  />
+                </Tooltip>
+              )}
               <Tooltip
                 shouldWrapChildren
                 hasArrow
                 placement="bottom"
-                label={t("Upload file")}
+                label={t("switch to layout view", {
+                  layout: t(show === "list" ? "grid" : "list"),
+                })}
               >
                 <Icon
-                  cursor="pointer"
                   boxSize={6}
-                  as={BsFillArrowUpCircleFill}
+                  cursor="pointer"
                   onClick={() => {
-                    uploadRef.current!.upload();
+                    setShow!(show === "list" ? "grid" : "list");
+                    localStorage.setItem(
+                      "show",
+                      show === "list" ? "grid" : "list"
+                    );
                   }}
+                  as={show === "list" ? BsFillGridFill : FaListUl}
                 />
               </Tooltip>
-              <Uploader ref={uploadRef} />
-            </Box>
-          )}
-        {type !== "error" && (
-          <Tooltip
-            shouldWrapChildren
-            hasArrow
-            placement="bottom"
-            label={t("Copy direct link")}
-          >
-            <Icon
-              cursor="pointer"
-              boxSize={6}
-              as={IoIosCopy}
-              onClick={() => {
-                let content = "";
-                if (type === "file") {
-                  content = fileUrl();
-                } else {
-                  let files_ = files;
-                  if (multiSelect) {
-                    files_ = selectFiles;
-                  }
-                  content = files_
-                    .filter((file) => file.type !== 1)
-                    .map((file) => {
-                      return fileUrl(file);
-                    })
-                    .join("\n");
-                }
-                copyToClip(content);
-                toast({
-                  title: t("Copied"),
-                  status: "success",
-                  duration: 3000,
-                  isClosable: true,
-                });
-              }}
-            />
-          </Tooltip>
+            </HStack>
+          </SlideFade>
         )}
-        <Tooltip
-          shouldWrapChildren
-          hasArrow
-          placement="bottom"
-          label={t("switch to layout view", {
-            layout: t(show === "list" ? "grid" : "list"),
-          })}
-        >
-          <Icon
-            boxSize={6}
-            cursor="pointer"
-            onClick={() => {
-              setShow!(show === "list" ? "grid" : "list");
-              localStorage.setItem("show", show === "list" ? "grid" : "list");
-            }}
-            as={show === "list" ? BsFillGridFill : FaListUl}
-          />
-        </Tooltip>
       </HStack>
     </Flex>
   );