chore: add page proxy for debug

Signed-off-by: Innei <i@innei.in>
RSSNext · Aug 2, 2024 · 50e9ce6 · 50e9ce6
1 parent f4790da
commit 50e9ce6
Show file tree

Hide file tree

Showing 4 changed files with 90 additions and 15 deletions.
diff --git a/src/renderer/public/__debug_proxy/index.html b/src/renderer/public/__debug_proxy/index.html
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <script>
+      const host = "http://localhost:2233";
+
+      const createRefreshRuntimeScript = `
+      import RefreshRuntime from "${host}/@react-refresh";
+      RefreshRuntime.injectIntoGlobalHook(window);
+      window.$RefreshReg$ = () => {};
+      window.$RefreshSig$ = () => (type) => type;
+      window.__vite_plugin_react_preamble_installed__ = true;
+`;
+
+      const $script = document.createElement("script");
+      $script.innerHTML = createRefreshRuntimeScript;
+      $script.type = "module";
+      document.head.appendChild($script);
+
+      createModuleScript(`${host}/@vite/client`);
+      createModuleScript(`${host}/dx-helper.ts`);
+      createModuleScript(`${host}/src/main.tsx`);
+      function createModuleScript(src) {
+        const $script = document.createElement("script");
+        $script.src = src;
+        $script.type = "module";
+        document.head.appendChild($script);
+      }
+
+      globalThis["__DEBUG_PROXY__"] = true;
+    </script>
+
+    <meta charset="UTF-8" />
+    <meta name="referrer" content="no-referrer" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"
+    />
+
+    <meta name="theme-color" content="#ff5c00" />
+    <!-- favicon -->
+    <link rel="icon" href="/favicon.ico" type="image/x-icon" />
+    <title>Follow</title>
+
+    <script>
+      (function () {
+        var e =
+            window.matchMedia &&
+            window.matchMedia("(prefers-color-scheme: dark)").matches,
+          t = localStorage.getItem("theme") || '"system"';
+        t && t !== '"system"' && (document.documentElement.dataset.theme = t);
+        t &&
+          t === '"system"' &&
+          e &&
+          (document.documentElement.dataset.theme = "dark");
+      })();
+    </script>
+  </head>
+  <body>
+    <div id="root">
+      <!-- Skeleton -->
+      <div class="h-full w-full flex">
+        <div class="w-64 shrink-0 h-full"></div>
+        <div class="grow w-full h-full bg-theme-background"></div>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/src/renderer/src/modules/app/EnvironmentIndicator.tsx b/src/renderer/src/modules/app/EnvironmentIndicator.tsx
@@ -6,17 +6,21 @@ import {
   TooltipTrigger,
 } from "@renderer/components/ui/tooltip"
 
-export const EnvironmentIndicator = () => (
-  <Tooltip>
-    <TooltipTrigger asChild>
-      <div className="fixed bottom-0 left-0 rounded-tr bg-theme-accent px-1 py-0.5 text-xs text-white">
-        {import.meta.env.MODE}
-      </div>
-    </TooltipTrigger>
-    <TooltipPortal>
-      <TooltipContent className="max-w-max break-all" side="top">
-        <pre>{JSON.stringify({ ...env }, null, 2)}</pre>
-      </TooltipContent>
-    </TooltipPortal>
-  </Tooltip>
-)
+export const EnvironmentIndicator = () => {
+  const show = !import.meta.env.PROD || globalThis["__DEBUG_PROXY__"]
+  if (!show) return null
+  return (
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <div className="fixed bottom-0 left-0 rounded-tr bg-theme-accent px-1 py-0.5 text-xs text-white">
+          {import.meta.env.MODE}
+        </div>
+      </TooltipTrigger>
+      <TooltipPortal>
+        <TooltipContent className="max-w-max break-all" side="top">
+          <pre>{JSON.stringify({ ...env }, null, 2)}</pre>
+        </TooltipContent>
+      </TooltipPortal>
+    </Tooltip>
+  )
+}
diff --git a/src/renderer/src/pages/(main)/layout.tsx b/src/renderer/src/pages/(main)/layout.tsx
@@ -50,7 +50,7 @@ export function Component() {
           {ELECTRON && <AutoUpdater />}
 
           <NetworkStatusIndicator />
-          {!import.meta.env.PROD && <EnvironmentIndicator />}
+          <EnvironmentIndicator />
         </FeedColumn>
       </FeedResponsiveResizerContainer>
       <main

diff --git a/vite.config.ts b/vite.config.ts
@@ -29,6 +29,9 @@ export default defineConfig({
     },
   },
   base: "/",
+  server: {
+    port: 2233,
+  },
   plugins: [
     react(),
     sentryVitePlugin({