From 07105dc9f209204182ada29bf0d80c49427ef68a Mon Sep 17 00:00:00 2001
From: Tristan Yang <yanggc888@163.com>
Date: Wed, 30 Aug 2023 10:20:34 +0800
Subject: [PATCH] feat: reload currrent page in electron

---
 package.json                          |  2 +-
 src/app/services/server.ts            |  1 +
 src/components/InactiveScreen.tsx     |  3 ++-
 src/components/Loading.tsx            |  3 ++-
 src/components/Version.tsx            |  3 ++-
 src/index.tsx                         |  4 ++--
 src/routes/resources/Filter/index.tsx |  1 +
 src/utils.tsx                         | 16 ++++++++++++++++
 8 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index 78bcb1d7..cad093a7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vocechat-web",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "homepage": "https://voce.chat",
   "dependencies": {
     "@electron-toolkit/preload": "^2.0.0",
diff --git a/src/app/services/server.ts b/src/app/services/server.ts
index 92b27dba..f06642d4 100644
--- a/src/app/services/server.ts
+++ b/src/app/services/server.ts
@@ -242,6 +242,7 @@ export const serverApi = createApi({
         try {
           const resp = await queryFulfilled;
           if (resp.data) {
+            console.info("update login config in redux", resp.data);
             dispatch(updateInfo({ loginConfig: resp.data }));
           }
         } catch {
diff --git a/src/components/InactiveScreen.tsx b/src/components/InactiveScreen.tsx
index 730ff396..e4a3b82a 100644
--- a/src/components/InactiveScreen.tsx
+++ b/src/components/InactiveScreen.tsx
@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
 import useStreaming from "@/hooks/useStreaming";
 // import clsx from "clsx";
 import Button from "./styled/Button";
+import { reloadCurrentPage } from "@/utils";
 
 interface Props {}
 
@@ -21,7 +22,7 @@ const InactiveScreen: FC<Props> = () => {
     };
   }, []);
   const handleReload = () => {
-    location.reload();
+    reloadCurrentPage();
   };
   return (
     <div className="w-screen h-screen dark:bg-gray-700 flex-center text-4xl font-bold">
diff --git a/src/components/Loading.tsx b/src/components/Loading.tsx
index 3db8cb9b..1002d8c5 100644
--- a/src/components/Loading.tsx
+++ b/src/components/Loading.tsx
@@ -4,6 +4,7 @@ import clsx from "clsx";
 
 import useLogout from "@/hooks/useLogout";
 import Button from "./styled/Button";
+import { reloadCurrentPage } from "@/utils";
 
 interface Props {
   reload?: boolean;
@@ -16,7 +17,7 @@ const Loading: FC<Props> = ({ reload = false, fullscreen = false, context = "" }
   const { clearLocalData } = useLogout();
   const handleReload = () => {
     clearLocalData();
-    location.reload();
+    reloadCurrentPage();
   };
   useEffect(() => {
     let inter = 0;
diff --git a/src/components/Version.tsx b/src/components/Version.tsx
index f2130ec7..3a2fd467 100644
--- a/src/components/Version.tsx
+++ b/src/components/Version.tsx
@@ -7,6 +7,7 @@ import { useAppSelector } from "@/app/store";
 import { unregister } from "../serviceWorkerRegistration";
 import Button from "./styled/Button";
 import { shallowEqual } from "react-redux";
+import { reloadCurrentPage } from "@/utils";
 
 type Props = {};
 const Version: FC<Props> = () => {
@@ -18,7 +19,7 @@ const Version: FC<Props> = () => {
     setSyncing(true);
     unregister();
     setTimeout(() => {
-      location.reload();
+      reloadCurrentPage();
     }, 2000);
   };
   return (
diff --git a/src/index.tsx b/src/index.tsx
index 87702d1e..958a11ae 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -18,7 +18,7 @@ import { register } from "./serviceWorkerRegistration";
 import "./i18n";
 import "./libs/polyfills";
 
-import { isDarkMode } from "./utils";
+import { isDarkMode, reloadCurrentPage } from "./utils";
 
 const root = ReactDOM.createRoot(document.getElementById("root") as HTMLElement);
 // dark mode
@@ -48,7 +48,7 @@ register({
   onUpdate: (reg) => {
     const handleUpdate = () => {
       reg.unregister().then(() => {
-        window.location.reload();
+        reloadCurrentPage();
       });
     };
     toast((t) => <NewVersion id={t.id} handleUpdate={handleUpdate} />, {
diff --git a/src/routes/resources/Filter/index.tsx b/src/routes/resources/Filter/index.tsx
index 7cf26ac8..c2382501 100644
--- a/src/routes/resources/Filter/index.tsx
+++ b/src/routes/resources/Filter/index.tsx
@@ -10,6 +10,7 @@ import FilterChannel from "./Channel";
 import FilterDate, { Dates } from "./Date";
 import FilterFrom from "./From";
 import FilterType, { FileTypes } from "./Type";
+import { shallowEqual } from "react-redux";
 
 const getClass = (selected: boolean) => {
   return clsx(
diff --git a/src/utils.tsx b/src/utils.tsx
index e0859726..3c6e5d27 100644
--- a/src/utils.tsx
+++ b/src/utils.tsx
@@ -434,6 +434,22 @@ export const transformInviteLink = (link: string) => {
   return tmpLink;
 };
 
+export const reloadCurrentPage = () => {
+  if (isElectronContext()) {
+    // 改变theme color 然后electron reload（约定）
+    const metaThemeColor = document.querySelector("meta[name=theme-color]");
+    if (metaThemeColor) {
+      metaThemeColor.setAttribute("content", "#123456");
+    } else {
+      const meta = document.createElement("meta");
+      meta.name = "theme-color";
+      meta.content = "#123456";
+      document.head.appendChild(meta);
+    }
+  } else {
+    window.location.reload();
+  }
+};
 export const isInIframe = () => window.location !== window.parent.location;
 export const encodeBase64 = (str = "") => btoa(unescape(encodeURIComponent(str)));
 export const shouldPreviewImage = (type: string) => {