[feat] optimization for getting cs2 path + add Toast for auto path

2025-03-23 01:08:50 +08:00
parent ad5a1bd870
commit e7b6d81319
12 changed files with 184 additions and 81 deletions
--- a/src/app/(main)/users/layout.tsx
+++ b/src/app/(main)/users/layout.tsx
@@ -1,26 +1,13 @@
 "use client"
 import SteamUsers from "@/components/cstb/SteamUsers"
-import {
-  Card,
-  CardBody,
-  CardHeader,
-  CardIcon,
-  CardTool,
-} from "@/components/window/Card"
-import { ToolButton } from "@/components/window/ToolButton"
-import { cn } from "@heroui/react"
-import {
-  AssemblyLine, HardDisk, SettingConfig,
-  UploadOne
-} from "@icon-park/react"
-import { usePathname, useRouter } from "next/navigation"
+// import { usePathname, useRouter } from "next/navigation"
 // import { platform } from "@tauri-apps/plugin-os"

 export default function PreferenceLayout({
  children,
 }: { children: React.ReactNode }) {
-  const router = useRouter()
-  const pathname = usePathname()
+  // const router = useRouter()
+  // const pathname = usePathname()

  return (
    <div className="flex w-full gap-3">
--- a/src/app/providers.tsx
+++ b/src/app/providers.tsx
@@ -13,13 +13,10 @@ export default function Providers({ children }: { children: React.ReactNode }) {

  return (
    <HeroUIProvider
-      className={cn(
-        "h-full bg-zinc-100/90 dark:bg-zinc-900",
-        os === "macos" && "rounded-lg",
-      )}
+      className={cn("h-full bg-zinc-200/90 dark:bg-zinc-900", os === "macos" && "rounded-lg")}
    >
      <NextThemesProvider attribute="class" defaultTheme="light">
-        <ToastProvider toastOffset={10} placement="top-center" />
+        <ToastProvider toastOffset={10} placement="top-center" toastProps={{ timeout: 3000 }} />
        {children}
      </NextThemesProvider>
    </HeroUIProvider>
--- a/src/components/cstb/CommonDir.tsx
+++ b/src/components/cstb/CommonDir.tsx
@@ -2,7 +2,6 @@ import { addToast } from "@heroui/react"
 import { FolderFocusOne } from "@icon-park/react"
 import { Card, CardBody, CardHeader, CardIcon } from "../window/Card"
 import { invoke } from "@tauri-apps/api/core"
-import { configDir } from "@tauri-apps/api/path"
 import { useSteamStore } from "@/store/steam"
 import path from "path"

@@ -17,7 +16,7 @@ const RoundedButton = ({
  return (
    <button
      type="button"
-      className="flex items-center justify-center px-3 py-1 transition rounded-full select-none min-w-fit active:scale-95 hover:bg-black/10 text-zinc-700 dark:text-zinc-100 bg-black/5"
+      className="flex items-center justify-center px-3 py-1 transition rounded-full select-none min-w-fit active:scale-95 hover:bg-black/10 text-zinc-700 dark:text-zinc-100 bg-black/5 dark:bg-white/5"
      {...props}
    >
      {children}
--- a/src/components/cstb/Prepare.tsx
+++ b/src/components/cstb/Prepare.tsx
@@ -1,4 +1,4 @@
-import { addToast, Button, Chip, Input, Spinner } from "@heroui/react"
+import { addToast, Button, Input, Spinner } from "@heroui/react"
 import { useRouter } from "next/navigation"
 import { useEffect, useState } from "react"
 import { useSteamStore } from "@/store/steam"
@@ -6,6 +6,7 @@ import { open } from "@tauri-apps/plugin-dialog"
 import { invoke } from "@tauri-apps/api/core"
 import { onOpenUrl } from "@tauri-apps/plugin-deep-link"
 import { useDebounce } from "ahooks"
+import { useAppStore } from "@/store/app"

 /**
 * 检查指定路径的有效性
@@ -28,6 +29,7 @@ function trim_end_string(str: string, suffix: string): string {

 export function Prepare() {
  const steam = useSteamStore()
+  const app = useAppStore()
  const router = useRouter()
  const [loading, setLoading] = useState(true)
  const [, setSteamDir] = useState(steam.state.steamDir)
@@ -35,7 +37,12 @@ export function Prepare() {

  // Init
  useEffect(() => {
-    void steam.store.start()
+    const init = async () => {
+      await steam.store.start()
+      await app.store.start()
+      if (!app.state.inited) await autoGetPaths()
+    }
+    void init()
  }, [])

  // valid变动后调整State
@@ -45,22 +52,12 @@ export function Prepare() {
    trailing: true,
    maxWait: 2500,
  })
-  const [checkCount, setCheckCount] = useState(0)
  useEffect(() => {
-    setCheckCount((prev) => (prev >= 10 ? 10 : prev + 1))
-    console.log(checkCount, "触发", debounceValid, steam.state.steamDir, steam.state.cs2Dir)
-
-    if (checkCount < 2) {
-      if (debounceValid) {
-        console.log("跳转")
-        setTimeout(() => {
-          router.push("/home")
-        }, 500)
-      } else {
-        setTimeout(() => {
-          setLoading(false)
-        }, 1200)
-      }
+    // console.log(checkCount, "触发", debounceValid, steam.state.steamDir, steam.state.cs2Dir)
+    if (debounceValid && app.state.inited) {
+      setTimeout(() => {
+        router.push("/home")
+      }, 500)
    } else {
      setTimeout(() => {
        setLoading(false)
@@ -94,10 +91,17 @@ export function Prepare() {
    }

    try {
-      const cs2_path = await invoke<string>("get_cs_path", { name: "cs2" })
-      if (cs2_path) steam.setCsDir(cs2_path.replace(/\\[^\\]+$/, ""))
+      const cs2_path = await invoke<string>("get_cs_path", {
+        name: "cs2",
+        steamDir: steam.state.steamDir,
+      })
+      if (cs2_path) {
+        steam.setCsDir(cs2_path)
+        addToast({ title: "自动获取路径成功", color: "success" })
+      }
    } catch (e) {
      addToast({ title: "自动获取CS2路径失败", color: "danger" })
+      console.log(e)
    }
  }

@@ -129,7 +133,7 @@ export function Prepare() {

  return (
    <div className="flex flex-col w-full max-w-3xl gap-2 p-5">
-      <p className="text-center">当前路径等设置有待确认</p>
+      <p className="text-center">请确认下列设置以确保工具箱正常运行</p>
      <br />
      <h3 className="font-semibold">Steam所在文件夹</h3>
      <div className="flex gap-2">
@@ -145,7 +149,13 @@ export function Prepare() {
          errorMessage={"路径无效"}
          isInvalid={!steam.state.steamDirValid}
        />
-        <Button onPress={handleSelectSteamDir} variant="solid" color="primary" size="sm" isLoading={steam.state.steamDirChecking}>
+        <Button
+          onPress={handleSelectSteamDir}
+          variant="solid"
+          color="primary"
+          size="sm"
+          isLoading={steam.state.steamDirChecking}
+        >
          选择
        </Button>
      </div>
@@ -160,10 +170,16 @@ export function Prepare() {
            steam.setCsDir(value)
          }}
          description="cs2.exe所在文件夹"
-          errorMessage={"路径无效"}
+          errorMessage={"路径无效，建议启动游戏后点击自动获取，可以检测运行中的cs2"}
          isInvalid={!steam.state.cs2DirValid}
        />
-        <Button onPress={handleSelectCs2Dir} variant="solid" color="primary" size="sm" isLoading={steam.state.cs2DirChecking}>
+        <Button
+          onPress={handleSelectCs2Dir}
+          variant="solid"
+          color="primary"
+          size="sm"
+          isLoading={steam.state.cs2DirChecking}
+        >
          选择
        </Button>
      </div>
@@ -175,16 +191,19 @@ export function Prepare() {
          onPress={() => void autoGetPaths()}
          variant="ghost"
          color="default"
-          size="sm"
+          size="md"
          className="w-24"
        >
          自动获取
        </Button>
        <Button
-          onPress={() => router.push("/home")}
+          onPress={() => {
+            app.setInited(true)
+            router.push("/home")
+          }}
          variant="solid"
          color="primary"
-          size="sm"
+          size="md"
          className="w-24"
          isLoading={steam.state.steamDirChecking || steam.state.cs2DirChecking}
          isDisabled={!steam.state.steamDirValid || !steam.state.cs2DirValid}
--- a/src/components/cstb/SteamUsers.tsx
+++ b/src/components/cstb/SteamUsers.tsx
@@ -1,6 +1,6 @@
 import { User } from "@icon-park/react"
 import { Card, CardBody, CardHeader, CardIcon } from "../window/Card"
-import { Button, Chip, cn, Code } from "@heroui/react"
+import { Button, Chip } from "@heroui/react"
 import { useSteamStore } from "@/store/steam"

 const SteamUsers = ({ className }: { className?: string }) => {
--- a/src/components/window/Nav.tsx
+++ b/src/components/window/Nav.tsx
@@ -42,15 +42,18 @@ const Nav = () => {
  const router = useRouter()
  const pathname = usePathname()

+  const app = useAppStore()
+
  return (
    <nav className="absolute top-0 right-0 flex flex-row h-16 gap-0.5 p-4" data-tauri-drag-region>
-      <ResetModal />
-
      {pathname !== "/" && (
        <button
          type="button"
          className="px-2 py-0 transition duration-150 rounded hover:bg-zinc-200/80 dark:hover:bg-zinc-100/10 active:scale-95"
-          onClick={() => (pathname !== "/" ? router.push("/") : router.back())}
+          onClick={() => {
+            app.setInited(false)
+            if(pathname !== "/") router.push("/")
+          }}
        >
          <RocketOne size={16} />
        </button>
@@ -64,6 +67,8 @@ const Nav = () => {
        {theme === "light" ? <SunOne size={16} /> : <Moon size={16} />}
      </button>

+      <ResetModal />
+
      {/* { platform() === "windows" && ( */}
      <>
        <button
@@ -127,9 +132,7 @@ function ResetModal() {
            <>
              <ModalHeader className="flex flex-col gap-1">重置设置</ModalHeader>
              <ModalBody>
-                <p>
-                  确认后会恢复CS工具箱的偏好设置为默认设置
-                </p>
+                <p>确认后会恢复CS工具箱的偏好设置为默认设置</p>
              </ModalBody>
              <ModalFooter>
                <Button color="danger" variant="light" onPress={onClose}>
--- a/src/components/window/SideBar.tsx
+++ b/src/components/window/SideBar.tsx
@@ -29,8 +29,8 @@ const SideButton = ({
      onClick={() => router.push(route || "/")}
      className={cn(
        className,
-        "p-2.5 hover:bg-black/5 rounded-lg transition relative",
-        path.startsWith(route) && "bg-black/5"
+        "p-2.5 hover:bg-black/5 dark:hover:bg-white/5 rounded-lg transition relative active:scale-90",
+        path.startsWith(route) && "bg-black/5 dark:bg-white/5"
      )}
      {...rest}
    >