Merge pull request #436 from gertrude-app/debug-webviews-toggle

appviews: allow debugging webviews from advanced screen
gertrude-app · Jan 10, 2025 · 7ce1b83 · 7ce1b83
2 parents 5cbd3c8 + 6aa69a7
commit 7ce1b83
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/appviews/src/Administrate/administrate-store.ts b/appviews/src/Administrate/administrate-store.ts
@@ -53,12 +53,14 @@ export interface AdvancedState {
   appcastEndpointOverride?: string;
   appcastEndpointDefault: string;
   appVersions?: { [key: string]: string };
+  webviewDebugging: boolean;
 }
 
 export type AdvancedAction =
   | { case: 'pairqlEndpointSet'; url?: string }
   | { case: 'websocketEndpointSet'; url?: string }
   | { case: 'appcastEndpointSet'; url?: string }
+  | { case: 'setWebviewDebugging'; enabled: boolean }
   | { case: 'forceUpdateToSpecificVersionClicked'; version: string }
   | { case: 'deleteAllDeviceStorageClicked' };
 

diff --git a/appviews/src/Administrate/screens/HiddenAdvancedScreen.tsx b/appviews/src/Administrate/screens/HiddenAdvancedScreen.tsx
@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { TextInput, Button, SelectMenu } from '@shared/components';
+import { TextInput, Button, SelectMenu, Toggle } from '@shared/components';
 import { typesafe } from '@shared/ts-utils';
 import type { AdvancedAction, AdvancedState } from '../administrate-store';
 
@@ -18,6 +18,7 @@ const HiddenAdvancedScreen: React.FC<Props> = ({
   appcastEndpointDefault,
   appcastEndpointOverride,
   appVersions,
+  webviewDebugging,
 }) => {
   const [pqlOverride, setPqlOverride] = useState(pairqlEndpointOverride ?? ``);
   const [wsOverride, setWsOverride] = useState(websocketEndpointOverride ?? ``);
@@ -147,6 +148,20 @@ const HiddenAdvancedScreen: React.FC<Props> = ({
           Clear
         </Button>
       </div>
+      <div className="flex justify-between items-center pt-2">
+        <div className="mr-3">
+          <h3 className="font-medium text-slate-700 leading-tight">
+            Webview debugging enabled:
+          </h3>
+          <p className="text-slate-500 text-sm mt-1">
+            Restart app to debug menu bar, use environment variable for onboarding
+          </p>
+        </div>
+        <Toggle
+          enabled={webviewDebugging}
+          setEnabled={(enabled) => emit({ case: `setWebviewDebugging`, enabled })}
+        />
+      </div>
     </div>
   );
 };

diff --git a/storybook/stories/macos-app/Administrate.stories.tsx b/storybook/stories/macos-app/Administrate.stories.tsx
@@ -136,6 +136,7 @@ export const Advanced: Story = props({
     pairqlEndpointDefault: `https://api.getrude.app/pairql`,
     websocketEndpointDefault: `https://api.getrude.app/websocket-app`,
     appcastEndpointDefault: `https://api.getrude.app/appcast.xml`,
+    webviewDebugging: false,
     appVersions: {
       '2.1.1': `2.1.1`,
       '2.2.0': `2.2.0 (beta)`,