feat: Basic folder browsing feature

app/(auth)/login/page.tsx

@@ -50,7 +50,7 @@ export default function Page() {
 
             Cookie.set(tokenStorageKey, token);
             toast.success("登录成功");
-            router.push("/x/root");
+            router.push("/explorer");
         } catch (err) {
             toast.error("登录失败: "+ err);
         }

app/(pages)/explorer/page.tsx

@@ -0,0 +1,91 @@
+/* eslint-disable padding-line-between-statements */
+"use client";
+
+import type { BaseResponseData, SystemPlatform, Drive } from "@/types";
+
+import { useEffect } from "react";
+import { Card } from "@nextui-org/card";
+import axios from "axios";
+import { toast } from "react-toastify";
+
+import Navbar from "@/components/explorer/navbar";
+import Explorer from "@/components/explorer/explorer";
+import { useExplorer } from "@/hooks/useExplorer";
+import { useDetectCookie } from "@/hooks/useDetectCookie";
+import { useFerrum } from "@/hooks/useFerrum";
+import { storage } from "@/lib/storage";
+import { diskStorageKey } from "@/lib/global";
+
+interface DisksResponseData extends BaseResponseData {
+    system: SystemPlatform
+    disks: Drive[]
+}
+
+export default function Page() {
+    const ferrum = useFerrum();
+    const explorer = useExplorer();
+
+    const { path } = explorer;
+
+    useEffect(() => {
+        if(
+            !path ||
+            path.length === 0 ||
+            path[0] !== "root"
+        ) {
+            explorer.backToRoot();
+
+            return;
+        }
+
+        axios.get<DisksResponseData>("/api/fs/disks")
+            .then(({ data }) => {
+                ferrum.setDisks(data.disks);
+
+                if(storage.has(diskStorageKey)) {
+                    explorer.setDisk(storage.getItem(diskStorageKey, "C:"));
+                    return;
+                }
+
+                /** @todo */
+                if(data.system === "linux") {
+                    explorer.setDisk("/");
+                } else if(data.system === "win32") {
+                    explorer.setDisk("C:");
+                }
+            })
+            .catch((err) => {
+                const status = err.response?.status ?? 0;
+
+                switch(status) {
+                    case 401:
+                        toast.error(`未登录 (${status})`);
+                        return;
+                    case 403:
+                        toast.error(`无效的访问token (${status})`);
+                        return;
+                    case 500:
+                        toast.error(`服务器内部错误 (${status})`);
+                        return;
+                }
+
+                throw err;
+            });
+
+        document.title = "Ferrum - "+ explorer.stringifyPath();
+    }, []);
+
+    useDetectCookie();
+
+    return (
+        <div className="w-full h-full pb-10 flex flex-col items-center space-y-3">
+            <Navbar />
+
+            <div className="w-[1000px] h-[78vh] flex gap-7">
+                <Card className="flex-1 dark:bg-[#111]"/>
+
+                <Explorer />
+            </div>
+        </div>
+    );
+}

app/page.tsx

@@ -11,5 +11,5 @@ export default function Page() {
 	if(!token || !validateToken(token.value)) redirect("/login");
 
 	// default redirection
-	redirect("/x/root");
+	redirect("/explorer");
 }

components/explorer/explorer-error.tsx

@@ -0,0 +1,15 @@
+import React from "react";
+
+interface ExplorerErrorProps {
+    error: string
+}
+
+const ExplorerError: React.FC<ExplorerErrorProps> = ({ error }) => {
+    return (
+        <div className="absolute top-0 left-0 right-0 bottom-0 flex justify-center items-center">
+            <span className="text-default-400">{error}</span>
+        </div>
+    );
+}
+
+export default ExplorerError;

components/explorer/explorer-item.tsx

@@ -3,7 +3,6 @@
 import React, { ReactNode } from "react";
 import { Divider } from "@nextui-org/divider";
 import { File } from "lucide-react";
-import { useRouter } from "next/navigation";
 import {
     Folder,
     FolderGit2,
@@ -52,12 +51,10 @@ const ExplorerItem: React.FC<ExplorerItemProps> = (props) => {
         size = bytesSizeTransform(props.size, BytesType.B, BytesType.TB);
     }
 
-    const router = useRouter();
     const explorer = useExplorer();
 
     const handleClick = () => {
         explorer.enterPath(props.name);
-        router.push("/x/root"+ explorer.stringifyPath());
     };
 
     return (