[feat] basic open path but having issue of path with spaces

src/components/cstb/CommonDir.tsx

@@ -1,6 +1,10 @@
 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"
 
 interface RoundedButtonProps {
   children?: React.ReactNode
@@ -22,6 +26,8 @@ const RoundedButton = ({
 }
 
 const CommonDir = () => {
+  const steam = useSteamStore()
+
   return (
     <Card>
       <CardHeader>
@@ -32,50 +38,68 @@ const CommonDir = () => {
       <CardBody>
         <div className="flex gap-1.5">
           <RoundedButton
-            onClick={() => {
-              // 调用 tauri api open steam.Dir
+            onClick={async () => {
+              await invoke("open_path", {
+                path: steam.state.steamDir,
+              })
               addToast({ title: "Steam安装位置" })
             }}
           >
             Steam安装位置
           </RoundedButton>
           <RoundedButton
-            onClick={() => {
+            onClick={async () => {
+              await invoke("open_path", {
+                path: path.join(steam.state.cs2Dir, "game", "csgo", "cfg"),
+              })
               addToast({ title: "CS2游戏目录" })
             }}
           >
             CS2游戏目录
           </RoundedButton>
           <RoundedButton
-            onClick={() => {
+            onClick={async () => {
+              await invoke("open_path", {
+                path: path.join(steam.state.cs2Dir, "game", "csgo", "maps"),
+              })
               addToast({ title: "地图文件" })
             }}
           >
             地图文件
           </RoundedButton>
           <RoundedButton
-            onClick={() => {
+            onClick={async () => {
+              await invoke("open_path", {
+                path: path.join(steam.state.cs2Dir, "game", "csgo", "cfg"),
+              })
               addToast({ title: "游戏CFG目录" })
             }}
           >
             游戏CFG目录
           </RoundedButton>
           <RoundedButton
-            onClick={() => {
+            onClick={async () => {
+              await invoke("open_path", {
+                path: path.join(steam.state.steamDir, "userdata"),
+              })
               addToast({ title: "个人CFG目录" })
             }}
           >
             个人CFG目录
           </RoundedButton>
           <RoundedButton
-            onClick={() => {
+            onClick={async () => {
+              const appDataDirPath = await configDir()
+              await invoke("open_path", { path: `${appDataDirPath}/Wmpvp/demo` })
               addToast({ title: "完美平台录像" })
             }}
           >
             完美平台录像
           </RoundedButton>
           <RoundedButton
-            onClick={() => {
+            onClick={async () => {
+              const appDataDirPath = await configDir()
+              await invoke("open_path", { path: `${appDataDirPath}/5E对战平台/demo` })
               addToast({ title: "5E平台录像" })
             }}
           >