Add listen modes for embedded vs. embedding

proofcarryingdata · Sep 24, 2024 · 341d532 · 341d532
1 parent 5d998d9
commit 341d532
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 6 deletions.
diff --git a/apps/passport-client/components/screens/ZappScreens/ZappScreen.tsx b/apps/passport-client/components/screens/ZappScreens/ZappScreen.tsx
@@ -1,5 +1,6 @@
 import { ReactNode } from "react";
 import { useDispatch, useEmbeddedScreenState } from "../../../src/appHooks";
+import { ListenMode, useZappServer } from "../../../src/zapp/useZappServer";
 import { AdhocModal } from "../../modals/AdhocModal";
 import { EmbeddedScreen } from "../EmbeddedScreens/EmbeddedScreen";
 
@@ -17,6 +18,7 @@ export function ZappScreen({ url }: { url: string }): ReactNode {
 }
 
 function ZappModal(): ReactNode {
+  useZappServer(ListenMode.LISTEN_IF_NOT_EMBEDDED);
   const embeddedScreen = useEmbeddedScreenState();
   const dispatch = useDispatch();
   return (

diff --git a/apps/passport-client/pages/index.tsx b/apps/passport-client/pages/index.tsx
@@ -62,11 +62,10 @@ import { Emitter } from "../src/emitter";
 import { loadInitialState } from "../src/loadInitialState";
 import { registerServiceWorker } from "../src/registerServiceWorker";
 import { AppState, StateEmitter } from "../src/state";
-import { useZappServer } from "../src/zapp/useZappServer";
 
 function App(): JSX.Element {
   useBackgroundJobs();
-  useZappServer();
+  // useZappServer();
   const state = useStateContext().getState();
 
   const hasStack = !!state.error?.stack;

diff --git a/apps/passport-client/src/zapp/useZappServer.ts b/apps/passport-client/src/zapp/useZappServer.ts
@@ -8,13 +8,31 @@ import { v4 as uuidv4 } from "uuid";
 import { useStateContext } from "../appHooks";
 import { ZupassRPCProcessor } from "./ZappServer";
 
-export function useZappServer(): void {
+export enum ListenMode {
+  LISTEN_IF_EMBEDDED,
+  LISTEN_IF_NOT_EMBEDDED
+}
+
+export function useZappServer(
+  mode: ListenMode = ListenMode.LISTEN_IF_EMBEDDED
+): void {
   const context = useStateContext();
 
   useEffect(() => {
+    if (
+      mode === ListenMode.LISTEN_IF_EMBEDDED &&
+      window.parent === window.self
+    ) {
+      return;
+    }
+    if (
+      mode === ListenMode.LISTEN_IF_NOT_EMBEDDED &&
+      window.parent !== window.self
+    ) {
+      return;
+    }
     (async (): Promise<void> => {
       const { zapp, advice, origin } = await listen();
-      console.log("Zapp connected", zapp, advice, origin);
 
       if (!context.getState().self) {
         advice.showClient();
@@ -94,9 +112,8 @@ export function useZappServer(): void {
           window.location.hash = "embedded";
         }
 
-        console.log("Zapp ready");
         advice.ready(server);
       }
     })();
-  }, [context]);
+  }, [context, mode]);
 }