feat: 同步更新每个窗口的全局状态

src/App.tsx

@@ -1,5 +1,7 @@
+import { listen } from "@tauri-apps/api/event";
 import { ConfigProvider, theme } from "antd";
 import zhCN from "antd/locale/zh_CN";
+import { isEqual } from "lodash-es";
 import { RouterProvider } from "react-router-dom";
 import { useSnapshot } from "valtio";
 
@@ -12,6 +14,18 @@ const App = () => {
 		initDatabase();
 
 		generateColorVars();
+
+		listen(LISTEN_KEY.GLOBAL_STORE_CHANGED, ({ payload }) => {
+			if (isEqual(globalStore, payload)) return;
+
+			Object.assign(globalStore, payload);
+		});
+
+		listen(LISTEN_KEY.CLIPBOARD_STORE_CHANGED, ({ payload }) => {
+			if (isEqual(clipboardStore, payload)) return;
+
+			Object.assign(clipboardStore, payload);
+		});
 	});
 
 	return (

src/constants/index.ts

@@ -0,0 +1,7 @@
+export const GITHUB_LINK = "https://github.com/ayangweb/EcoCopy";
+
+export const LISTEN_KEY = {
+	GITHUB: "github",
+	GLOBAL_STORE_CHANGED: "global-store-changed",
+	CLIPBOARD_STORE_CHANGED: "clipboard-store-changed",
+};

src/hooks/useRegister.ts

@@ -5,7 +5,7 @@ import {
 } from "@tauri-apps/api/globalShortcut";
 
 export const useRegister = (handler: ShortcutHandler, deps: string[]) => {
-	const [oldKey, setOldKey] = useState("");
+	const [oldKey, setOldKey] = useState(deps[0]);
 
 	useAsyncEffect(async () => {
 		const [key] = deps;

src/layouts/Default/index.tsx

@@ -1,9 +1,9 @@
 import Icon from "@/components/Icon";
-import { listen } from "@tauri-apps/api/event";
+import { emit, listen } from "@tauri-apps/api/event";
 import { open } from "@tauri-apps/api/shell";
 import { Flex } from "antd";
 import clsx from "clsx";
-import { useSnapshot } from "valtio";
+import { subscribe, useSnapshot } from "valtio";
 
 const DefaultLayout = () => {
 	const { pathname } = useLocation();
@@ -12,8 +12,16 @@ const DefaultLayout = () => {
 	useMount(() => {
 		createWindow("/clipboard-history");
 
-		listen("github", () => {
-			open("https://github.com/ayangweb/EcoCopy");
+		listen(LISTEN_KEY.GITHUB, () => {
+			open(GITHUB_LINK);
+		});
+
+		subscribe(globalStore, () => {
+			emit(LISTEN_KEY.GLOBAL_STORE_CHANGED, globalStore);
+		});
+
+		subscribe(clipboardStore, () => {
+			emit(LISTEN_KEY.CLIPBOARD_STORE_CHANGED, clipboardStore);
 		});
 	});
 

src/router/index.ts

@@ -49,7 +49,7 @@ export const routes: Route[] = [
 				resizable: false,
 				maximizable: false,
 				decorations: false,
-				// visible: false,
+				visible: false,
 				transparent: true,
 				alwaysOnTop: true,
 				acceptFirstMouse: true,

src/stores/clipboard.ts

@@ -11,3 +11,7 @@ export const clipboardStore = proxyWithPersist<ClipboardStore>({
 	migrations: {},
 	getStorage,
 });
+
+// subscribe(clipboardStore, () => {
+// 	emit(LISTEN_KEY.CLIPBOARD_STORE_CHANGED, clipboardStore);
+// });

src/stores/global.ts

@@ -57,3 +57,7 @@ subscribeKey(globalStore, "isDark", (value) => {
 		document.documentElement.classList.remove("dark");
 	}
 });
+
+// subscribe(globalStore, () => {
+// 	emit(LISTEN_KEY.GLOBAL_STORE_CHANGED, globalStore);
+// });

vite.config.ts

@@ -17,6 +17,7 @@ export default defineConfig(async () => ({
 				"src/stores",
 				"src/database",
 				"src/hooks",
+				"src/constants",
 			],
 		}),
 	],