From 3fce68c5d08326324f91a0fed439c33763f9f659 Mon Sep 17 00:00:00 2001 From: Project_IO Date: Thu, 13 Mar 2025 11:44:55 +0900 Subject: [PATCH] feat: middle save --- bun.lock | 3 +++ package.json | 3 ++- src/App.tsx | 3 ++- src/components/dashboard/dashboard.scss | 0 src/components/dashboard/index.tsx | 10 ++++++++++ src/components/directory/directory.scss | 1 + src/components/directory/index.tsx | 18 ++++++++++++++++++ src/store/path.ts | 14 ++++++++++++++ 8 files changed, 50 insertions(+), 2 deletions(-) create mode 100644 src/components/dashboard/dashboard.scss create mode 100644 src/components/dashboard/index.tsx create mode 100644 src/components/directory/directory.scss create mode 100644 src/components/directory/index.tsx create mode 100644 src/store/path.ts diff --git a/bun.lock b/bun.lock index be38699..ffb0ef5 100644 --- a/bun.lock +++ b/bun.lock @@ -7,6 +7,7 @@ "react": "^19.0.0", "react-dom": "^19.0.0", "react-router": "^7.3.0", + "zustand": "^5.0.3", }, "devDependencies": { "@eslint/js": "^9.21.0", @@ -447,6 +448,8 @@ "yocto-queue": ["yocto-queue@0.1.0", "", {}, "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="], + "zustand": ["zustand@5.0.3", "", { "peerDependencies": { "@types/react": ">=18.0.0", "immer": ">=9.0.6", "react": ">=18.0.0", "use-sync-external-store": ">=1.2.0" }, "optionalPeers": ["@types/react", "immer", "react", "use-sync-external-store"] }, "sha512-14fwWQtU3pH4dE0dOpdMiWjddcH+QzKIgk1cl8epwSE7yag43k/AD/m4L6+K7DytAOr9gGBe3/EXj9g7cdostg=="], + "@eslint-community/eslint-utils/eslint-visitor-keys": ["eslint-visitor-keys@3.4.3", "", {}, "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag=="], "@eslint/eslintrc/globals": ["globals@14.0.0", "", {}, "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ=="], diff --git a/package.json b/package.json index 8442220..bed8589 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,8 @@ "dependencies": { "react": "^19.0.0", "react-dom": "^19.0.0", - "react-router": "^7.3.0" + "react-router": "^7.3.0", + "zustand": "^5.0.3" }, "devDependencies": { "@eslint/js": "^9.21.0", diff --git a/src/App.tsx b/src/App.tsx index f2da4eb..92c4a3c 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,11 +1,12 @@ import { BrowserRouter, Route, Routes } from "react-router"; import "./App.scss"; +import Dashboard from "./components/dashboard"; function App() { return ( - } /> + } /> ); diff --git a/src/components/dashboard/dashboard.scss b/src/components/dashboard/dashboard.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/components/dashboard/index.tsx b/src/components/dashboard/index.tsx new file mode 100644 index 0000000..5058e63 --- /dev/null +++ b/src/components/dashboard/index.tsx @@ -0,0 +1,10 @@ +import Directory from "../directory"; +import "./dashboard.scss"; + +function Dashboard() { + return ( + + ); +} + +export default Dashboard; diff --git a/src/components/directory/directory.scss b/src/components/directory/directory.scss new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/src/components/directory/directory.scss @@ -0,0 +1 @@ + diff --git a/src/components/directory/index.tsx b/src/components/directory/index.tsx new file mode 100644 index 0000000..01b68cd --- /dev/null +++ b/src/components/directory/index.tsx @@ -0,0 +1,18 @@ +import { usePath } from "../../store/path"; +import { useEffect } from "react"; + +import "./directory.scss"; + +function Directory() { + const path = usePath(); + + useEffect(() => { + path.update(location.pathname); + }); + + return ( +
+ ); +} + +export default Directory; \ No newline at end of file diff --git a/src/store/path.ts b/src/store/path.ts new file mode 100644 index 0000000..14d6c8f --- /dev/null +++ b/src/store/path.ts @@ -0,0 +1,14 @@ +import { create } from "zustand"; + +interface PathState { + data: undefined; + update(path: string): Promise; +} + +export const usePath = create((set) => ({ + data: undefined, + update: async (path: string) => { + console.log(path); + set({ data: undefined }); + } +}));