package.json

@@ -34,7 +34,7 @@
     "@tauri-apps/plugin-store": "^2.2.0",
     "@tauri-store/valtio": "^2.0.0",
     "@types/throttle-debounce": "^5.0.2",
-    "@uidotdev/usehooks": "^2.4.1",
+    "ahooks": "^3.8.4",
     "framer-motion": "^12.5.0",
     "jotai": "^2.12.2",
     "next": "15.2.2",

src/app/layout.tsx

@@ -4,7 +4,7 @@ import { useEffect } from "react"
 import "./globals.css"
 import Providers from "./providers"
 import { init } from "@/store"
-import { useDebounce } from "@uidotdev/usehooks"
+import { useDebounce } from "ahooks"
 
 export default function RootLayout({ children }: { children: React.ReactNode }) {
   useEffect(() => {
@@ -13,8 +13,8 @@ export default function RootLayout({ children }: { children: React.ReactNode })
 
   // 检测steam路径和游戏路径是否有效
   const steam = useSteamStore()
-  const debounceSteamDir = useDebounce(steam.state.steamDir, 500)
+  const debounceSteamDir = useDebounce(steam.state.steamDir, {wait: 500, leading: true, trailing: true, maxWait: 2500})
-  const debounceCs2Dir = useDebounce(steam.state.cs2Dir, 500)
+  const debounceCs2Dir = useDebounce(steam.state.cs2Dir, {wait: 500, leading: true, trailing: true, maxWait: 2500})
   useEffect(() => {
     void steam.checkSteamDirValid()
   }, [debounceSteamDir])

src/components/cstb/Prepare.tsx

@@ -1,10 +1,11 @@
-import { addToast, Button, Chip, Spinner } from "@heroui/react"
+import { addToast, Button, Chip, Input, Spinner } from "@heroui/react"
 import { useRouter } from "next/navigation"
 import { useEffect, useState } from "react"
 import { useSteamStore } from "@/store/steam"
 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"
 
 /**
  * 检查指定路径的有效性
@@ -29,33 +30,43 @@ export function Prepare() {
   const steam = useSteamStore()
   const router = useRouter()
   const [loading, setLoading] = useState(true)
-  const [inited, setInited] = useState(false)
   const [, setSteamDir] = useState(steam.state.steamDir)
   const [, setCs2Dir] = useState(steam.state.cs2Dir)
 
+  // Init
   useEffect(() => {
-    const initValues = () => {
+    void steam.store.start()
-      const initialSteamDir = steam.state.steamDir
+  }, [])
-      const initialCs2Dir = steam.state.cs2Dir
 
-      setSteamDir(initialSteamDir)
+  // valid变动后调整State
-      setCs2Dir(initialCs2Dir)
+  const debounceValid = useDebounce(steam.state.steamDirValid && steam.state.cs2DirValid, {
+    wait: 500,
+    leading: true,
+    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)
 
-      const allCheckPassed = steam.state.steamDirValid && steam.state.cs2DirValid
+    if (checkCount < 1) {
-      setInited(steam.state.steamDirValid && steam.state.cs2DirValid)
+      if (debounceValid) {
-      // 逻辑有点问题，第一次启动时检查成功直接跳转，第一次检查失败不跳转，用户手动点击
+        console.log("跳转")
-      if (allCheckPassed) {
         setTimeout(() => {
           router.push("/home")
         }, 500)
+      } else {
+        setTimeout(() => {
+          setLoading(false)
+        }, 1200)
+      }
     } else {
       setTimeout(() => {
         setLoading(false)
       }, 800)
     }
-    }
+  }, [debounceValid])
-    initValues()
-  })
 
   const handleSelectSteamDir = async () => {
     const selected = await open({
@@ -102,7 +113,7 @@ export function Prepare() {
         addToast({ title: "路径不存在", color: "warning" })
         return
       }
-      setCs2Dir(dir)
+      // setCs2Dir(dir)
       steam.setCsDir(dir)
     }
   }
@@ -120,42 +131,45 @@ export function Prepare() {
     <div className="flex flex-col w-full max-w-3xl gap-2 p-5">
       <p className="text-center">当前路径等设置有待确认</p>
       <br />
-      <p>Steam所在文件夹</p>
+      <h3 className="font-semibold">Steam所在文件夹</h3>
       <div className="flex gap-2">
-        <input
+        <Input
-          className="flex-grow px-2 py-1 mb-2 rounded-lg"
+          variant="bordered"
+          size="sm"
           value={steam.state.steamDir}
-          onChange={(e) => {
+          onValueChange={(value) => {
-            setSteamDir(e.target.value)
+            setSteamDir(value)
-            steam.setDir(e.target.value)
+            steam.setDir(value)
           }}
+          description="steam.exe所在文件夹"
+          errorMessage={"路径无效"}
+          isInvalid={!steam.state.steamDirValid}
         />
-        <Button onPress={handleSelectSteamDir} variant="solid" color="primary" size="sm">
+        <Button onPress={handleSelectSteamDir} variant="solid" color="primary" size="sm" isLoading={steam.state.steamDirChecking}>
           选择
         </Button>
       </div>
-      <p>CS2所在文件夹</p>
+      <h3 className="font-semibold">CS2所在文件夹</h3>
       <div className="flex gap-2">
-        <input
+        <Input
-          className="flex-grow px-2 py-1 mb-2 rounded-lg"
+          variant="bordered"
+          size="sm"
           value={steam.state.cs2Dir}
-          onChange={(e) => {
+          onValueChange={(value) => {
-            setCs2Dir(e.target.value)
+            setCs2Dir(value)
-            steam.setCsDir(e.target.value)
+            steam.setCsDir(value)
           }}
+          description="cs2.exe所在文件夹"
+          errorMessage={"路径无效"}
+          isInvalid={!steam.state.cs2DirValid}
         />
-        <Button onPress={handleSelectCs2Dir} variant="solid" color="primary" size="sm">
+        <Button onPress={handleSelectCs2Dir} variant="solid" color="primary" size="sm" isLoading={steam.state.cs2DirChecking}>
           选择
         </Button>
       </div>
 
       <TestDeepLink />
 
-      <section className="flex justify-center gap-3">
-        <Chip>{steam.state.steamDirValid ? "Steam √" : "Steam ×"}</Chip>
-        <Chip>{steam.state.cs2DirValid ? "CS2 √" : "CS2 ×"}</Chip>
-      </section>
-
       <section className="flex justify-center w-full gap-3 mt-6">
         <Button
           onPress={() => void autoGetPaths()}
@@ -173,7 +187,7 @@ export function Prepare() {
           size="sm"
           className="w-24"
           isLoading={steam.state.steamDirChecking || steam.state.cs2DirChecking}
-          isDisabled={!inited}
+          isDisabled={!steam.state.steamDirValid || !steam.state.cs2DirValid}
         >
           进入
         </Button>

src/store/app.ts

@@ -18,6 +18,7 @@ export const useAppStore = () => {
 
   return {
     state,
+    store: appStore,
     setVersion,
     setHasUpdate,
     setInited,

src/store/steam.ts

@@ -35,6 +35,7 @@ export const useSteamStore = () => {
 
   return {
     state,
+    store: steamStore,
     setDir,
     setCsDir,
     setUsers,
@@ -74,7 +75,6 @@ const SetCs2DirChecking = (checking: boolean) => {
 const checkSteamDirValid = async () => {
   SetSteamDirChecking(true)
   const pathExist = await invoke<boolean>("check_path", { path: steamStore.state.steamDir })
-  console.log("steamDir", steamStore.state.steamDir, "pathExist", pathExist)
   setSteamDirValid(pathExist)
   setTimeout(() => {
     SetSteamDirChecking(false)
@@ -84,7 +84,6 @@ const checkSteamDirValid = async () => {
 const checkCs2DirValid = async () => {
   SetCs2DirChecking(true)
   const pathExist = await invoke<boolean>("check_path", { path: steamStore.state.cs2Dir })
-  console.log("cs2Dir", steamStore.state.cs2Dir, "pathExist", pathExist)
   setCs2DirValid(pathExist)
   setTimeout(() => {
     SetCs2DirChecking(false)

src/store/tool.ts

@@ -25,6 +25,7 @@ export const useToolStore = () => {
 
   return {
     state,
+    store: toolStore,
     setLaunchOption,
     setLaunchOptions,
     setLaunchIndex,