update: add zustand store and basic setup

package.json

@@ -29,7 +29,8 @@
     "@tauri-apps/plugin-shell": "2.0.0-rc.1",
     "next": "^14.2.13",
     "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react-dom": "^18.3.1",
+    "zustand": "5.0.0-rc.2"
   },
   "devDependencies": {
     "@biomejs/biome": "^1.9.2",

pnpm-lock.yaml

@@ -50,6 +50,9 @@ importers:
       react-dom:
         specifier: ^18.3.1
         version: 18.3.1(react@18.3.1)
+      zustand:
+        specifier: 5.0.0-rc.2
+        version: 5.0.0-rc.2(@types/react@18.3.8)(react@18.3.1)
     devDependencies:
       '@biomejs/biome':
         specifier: ^1.9.2
@@ -2476,6 +2479,24 @@ packages:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}
 
+  zustand@5.0.0-rc.2:
+    resolution: {integrity: sha512-o2Nwuvnk8vQBX7CcHL8WfFkZNJdxB/VKeWw0tNglw8p4cypsZ3tRT7rTRTDNeUPFS0qaMBRSKe+fVwL5xpcE3A==}
+    engines: {node: '>=12.20.0'}
+    peerDependencies:
+      '@types/react': '>=18.0.0'
+      immer: '>=9.0.6'
+      react: '>=18.0.0'
+      use-sync-external-store: '>=1.2.0'
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      immer:
+        optional: true
+      react:
+        optional: true
+      use-sync-external-store:
+        optional: true
+
 snapshots:
 
   '@adobe/css-tools@4.4.0': {}
@@ -5083,3 +5104,8 @@ snapshots:
   yaml@2.5.1: {}
 
   yocto-queue@0.1.0: {}
+
+  zustand@5.0.0-rc.2(@types/react@18.3.8)(react@18.3.1):
+    optionalDependencies:
+      '@types/react': 18.3.8
+      react: 18.3.1

src/app/prepare/page.tsx

@@ -1,4 +1,8 @@
+"use client"
+import useSteamStore from "@/store/steam"
+
 export default function Page() {
+  const { dir, updateDir, csDir, updateCsDir, currentUser } = useSteamStore()
   return (
     <div
       className="bg-[#f1f0f2] h-screen w-full flex flex-col gap-6 items-center justify-center"
@@ -6,6 +10,21 @@ export default function Page() {
     >
       <h1 className="text-4xl font-bold tracking-wide text-zinc-800">CS工具箱</h1>
       <p>准备环节</p>
+
+      <div className="flex flex-col w-full gap-6 p-5 border rounded-lg bg-white/40">
+        <input
+          className="px-2 py-1 rounded-lg"
+          value={dir}
+          onChange={(e) => updateDir(e.target.value)}
+        />
+        <input
+          className="px-2 py-1 rounded-lg"
+          value={csDir}
+          onChange={(e) => updateCsDir(e.target.value)}
+        />
+
+        <p>{currentUser().steamID64}</p>
+      </div>
     </div>
   )
 }

src/store/app.ts

@@ -0,0 +1,24 @@
+import { create } from 'zustand'
+
+interface AppState {
+  version: number
+  hasUpdate: boolean
+  hasInit: boolean
+  notice: string
+  useMirror: boolean
+  init: () => void
+}
+
+const useAppStore = create<AppState>()((/* set */) => ({
+  version: 0,
+  hasUpdate: false,
+  hasInit: false,
+  notice: "",
+  useMirror: true,
+  init: () => {
+    console.log('init')
+  },
+  // increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
+}))
+
+export default useAppStore

src/store/steam.ts

@@ -0,0 +1,45 @@
+import { SteamUser } from '@/types/steam'
+import { create } from 'zustand'
+
+const mock_user: SteamUser = {
+  steamID64: "76561198052315353",
+  steamID32: "STEAM_0:0:46157676",
+  accountName: "wrr",
+  personaName: "wrr",
+  recent: 0,
+  avatar: "",
+  // "https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/0d/0d1d4b9e1a9e8b2b3d4d0a7e1b3d6b1e3f8f4f7.jpg",
+}
+
+interface SteamState {
+  dir: string,
+  csDir: string,
+  users: SteamUser[],
+  currentUser: () => SteamUser,
+  isDirValid: boolean,
+  isCsDirValid: boolean,
+  init: () => void,
+  updateDir: (dir: string) => void,
+  updateCsDir: (dir: string) => void,
+}
+
+const useSteamStore = create<SteamState>()((set, get) => ({
+  // 路径
+  dir: "C:\\Program Files (x86)\\Steam",
+  csDir: "",
+  users: [mock_user] as SteamUser[],
+  currentUser: () => {
+    return get().users[0] || mock_user
+  },
+  // 路径是否可用
+  isDirValid: false,
+  isCsDirValid: false,
+  init: () => {
+    console.log('init')
+  },
+  updateDir: (dir: string) => set(() => ({ dir: dir })),
+  updateCsDir: (dir: string) => set(() => ({ csDir: dir })),
+  // increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
+}))
+
+export default useSteamStore

src/store/tool.ts

@@ -0,0 +1,20 @@
+import { create } from 'zustand'
+
+export interface ToolState {
+  launchOptions: string[]
+  launchIndex: number
+  powerPlan: number
+  init: () => void
+}
+
+const useToolStore = create<ToolState>()((/* set */) => ({
+  launchOptions: ["-novid -nojoy -high -freq 120 -tickrate 128", "", ""],
+  launchIndex: 0,
+  powerPlan: 0,
+  init: () => {
+    console.log('init')
+  },
+  // increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
+}))
+
+export default useToolStore

src/types/cfg.ts

@@ -0,0 +1,21 @@
+import { AdvancedListItem } from "@/types/common"
+
+export interface File {
+  dir: string
+  filename: string
+  format: "cfg" | "vcfg" | "txt" | "zip"
+  createTime: number
+  updateTime: number
+  size: number
+}
+
+export interface Owner {
+  ownerSteamId64: string
+  ownerSteamName: string
+  ownerToolboxId: string
+  ownerToolboxName: string
+}
+
+export interface CfgBackup extends File, Owner {}
+
+export interface Cfg extends File, AdvancedListItem {}

src/types/cfgx.ts

@@ -0,0 +1,30 @@
+import { Owner } from "@/types/cfg"
+
+export interface XBase {
+  name: string
+  value: string
+  default: string
+  info: string
+}
+
+export interface Key extends XBase {}
+export interface Alias extends XBase {}
+export interface Value extends XBase {
+  option: { name: string; value: string }[]
+}
+
+// 转换方法 [[key=${name}]] | [[alias=${name}]] | [[value=${name}]] -> value
+export interface XItem {
+  version: string
+  creater: string
+  key: Key[]
+  alias: Alias[]
+  value: Value[]
+  comment: string
+  content: string
+}
+
+export interface CfgX extends Owner {
+  note: string
+  items: XItem[]
+}

src/types/common.ts

@@ -0,0 +1,5 @@
+export interface AdvancedListItem {
+  mark?: boolean
+  hidden?: boolean
+  priority?: number
+}

src/types/steam.ts

@@ -0,0 +1,10 @@
+import { AdvancedListItem } from "@/types/common"
+
+export interface SteamUser extends AdvancedListItem {
+  steamID64: string
+  steamID32: string
+  accountName: string
+  personaName: string
+  recent: number
+  avatar: string
+}