Merge branch 'main' into carousel-updates

apps/consumer-client/package.json

@@ -38,6 +38,7 @@
     "@simplewebauthn/browser": "^7.2.0",
     "@simplewebauthn/server": "^7.2.0",
     "@zk-kit/eddsa-poseidon": "^1.1.0",
+    "buffer": "^6.0.3",
     "dotenv": "^16.0.3",
     "ethers": "^5.7.2",
     "json-bigint": "^1.0.0",

apps/consumer-client/src/pages/examples/add-pcd.tsx

@@ -43,6 +43,7 @@ import {
   verifyRegistrationResponse
 } from "@simplewebauthn/server";
 import { derivePublicKey } from "@zk-kit/eddsa-poseidon";
+import { Buffer } from "buffer";
 import { ethers } from "ethers";
 import JSONBig from "json-bigint";
 import { useEffect, useState } from "react";

apps/passport-client/components/modals/PrivacyNoticeModal.tsx

@@ -30,7 +30,7 @@ export function PrivacyNoticeModal(): JSX.Element {
       });
     } else {
       // Persist to local storage and sync this later
-      savePrivacyNoticeAgreed(LATEST_PRIVACY_NOTICE);
+      await savePrivacyNoticeAgreed(LATEST_PRIVACY_NOTICE);
       dispatch({
         type: "handle-agreed-privacy-notice",
         version: LATEST_PRIVACY_NOTICE

apps/passport-client/components/screens/EmbeddedScreens/EmbeddedSignPODScreen.tsx

@@ -1,17 +1,18 @@
 import { PODData, podToPODData } from "@parcnet-js/podspec";
 import { POD, PODEntries, encodePrivateKey } from "@pcd/pod";
 import { v3tov4Identity } from "@pcd/semaphore-identity-pcd";
+import { Buffer } from "buffer";
 import { ReactNode, useMemo } from "react";
 import styled from "styled-components";
+import { BottomModalHeader } from "../../../new-components/shared/BottomModal";
+import { Button2 } from "../../../new-components/shared/Button";
+import { Typography } from "../../../new-components/shared/Typography";
+import { hideScrollCSS } from "../../../new-components/shared/utils";
 import { useIdentityV3, useZappOrigin } from "../../../src/appHooks";
+import { BANNER_HEIGHT } from "../../../src/sharedConstants";
 import { useSyncE2EEStorage } from "../../../src/useSyncE2EEStorage";
 import { AppContainer } from "../../shared/AppContainer";
 import { displayPODValue } from "../../shared/uiUtil";
-import { BottomModalHeader } from "../../../new-components/shared/BottomModal";
-import { Typography } from "../../../new-components/shared/Typography";
-import { Button2 } from "../../../new-components/shared/Button";
-import { BANNER_HEIGHT } from "../../../src/sharedConstants";
-import { hideScrollCSS } from "../../../new-components/shared/utils";
 
 export function EmbeddedSignPODScreen({
   entries,

apps/passport-client/components/screens/ScannedTicketScreens/PodboxScannedTicketScreen/hooks/useTicketDataFromQuery.tsx

@@ -1,5 +1,6 @@
 import { decodeQRPayload } from "@pcd/passport-ui";
 import { ZKEdDSAEventTicketPCDPackage } from "@pcd/zk-eddsa-event-ticket-pcd";
+import { Buffer } from "buffer";
 import { useEffect, useState } from "react";
 import { useQuery } from "../../../../../src/appHooks";
 

apps/passport-client/components/shared/AccountExportButton.tsx

@@ -1,5 +1,6 @@
 import { serializeStorage } from "@pcd/passport-interface";
 import { LinkButton } from "@pcd/passport-ui";
+import { Buffer } from "buffer";
 import { useCallback, useEffect, useState } from "react";
 import { toast } from "react-hot-toast";
 import {

apps/passport-client/new-components/screens/Home/NewHomeScreen.tsx

@@ -44,6 +44,7 @@ import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/16/solid";
 import { isEmailPCD } from "@pcd/email-pcd";
 import { PCDGetRequest } from "@pcd/passport-interface";
 import { Spacer } from "@pcd/passport-ui";
+import { isPODEmailPCD } from "@pcd/pod-email-pcd";
 import { isSemaphoreIdentityPCD } from "@pcd/semaphore-identity-pcd";
 import {
   ReactElement,
@@ -195,8 +196,12 @@ export const NewHomeScreen = (): ReactElement => {
   const noPods =
     collection
       .getAll()
-      .filter((pcd) => !isEmailPCD(pcd) && !isSemaphoreIdentityPCD(pcd))
-      .length === 0;
+      .filter(
+        (pcd) =>
+          !isEmailPCD(pcd) &&
+          !isSemaphoreIdentityPCD(pcd) &&
+          !isPODEmailPCD(pcd)
+      ).length === 0;
 
   const orientation = useOrientation();
   const isLandscape =

apps/passport-client/new-components/screens/Home/NoUpcomingTicketsState.tsx

@@ -1,4 +1,5 @@
 import { isEmailPCD } from "@pcd/email-pcd";
+import { isPODEmailPCD } from "@pcd/pod-email-pcd";
 import { isSemaphoreIdentityPCD } from "@pcd/semaphore-identity-pcd";
 import {
   ReactElement,
@@ -9,17 +10,17 @@ import {
 } from "react";
 import { useSearchParams } from "react-router-dom";
 import styled from "styled-components";
+import { ZappButton } from "../../../components/screens/ZappScreens/ZappButton";
+import { ZappButtonsContainer } from "../../../components/screens/ZappScreens/ZappButtonsContainer";
+import { ZappFullScreen } from "../../../components/screens/ZappScreens/ZappFullScreen";
+import { appConfig } from "../../../src/appConfig";
 import { useDispatch, usePCDCollection, useSelf } from "../../../src/appHooks";
 import { BANNER_HEIGHT, MAX_WIDTH_SCREEN } from "../../../src/sharedConstants";
 import { nextFrame } from "../../../src/util";
 import { PodsCollectionList } from "../../shared/Modals/PodsCollectionBottomModal";
 import { Typography } from "../../shared/Typography";
 import { hideScrollCSS, replaceDotWithSlash } from "../../shared/utils";
 import { ScrollIndicator } from "./ScrollIndicator";
-import { ZappButtonsContainer } from "../../../components/screens/ZappScreens/ZappButtonsContainer";
-import { ZappButton } from "../../../components/screens/ZappScreens/ZappButton";
-import { appConfig } from "../../../src/appConfig";
-import { ZappFullScreen } from "../../../components/screens/ZappScreens/ZappFullScreen";
 
 const EMPTY_CARD_CONTAINER_HEIGHT = 220;
 const EmptyCardContainer = styled.div<{ longVersion: boolean }>`
@@ -124,8 +125,12 @@ export const NoUpcomingEventsState = ({
   const noPods =
     pods
       .getAll()
-      .filter((pcd) => !isEmailPCD(pcd) && !isSemaphoreIdentityPCD(pcd))
-      .length === 0;
+      .filter(
+        (pcd) =>
+          !isEmailPCD(pcd) &&
+          !isSemaphoreIdentityPCD(pcd) &&
+          !isPODEmailPCD(pcd)
+      ).length === 0;
 
   useLayoutEffect(() => {
     // Restore scroll position when list is shown again

apps/passport-client/new-components/screens/NewUpdatedTermsScreen.tsx

@@ -34,7 +34,7 @@ export const NewUpdatedTermsScreen = (): JSX.Element => {
       });
     } else {
       // Persist to local storage and sync this later
-      savePrivacyNoticeAgreed(LATEST_PRIVACY_NOTICE);
+      await savePrivacyNoticeAgreed(LATEST_PRIVACY_NOTICE);
       dispatch({
         type: "handle-agreed-privacy-notice",
         version: LATEST_PRIVACY_NOTICE

apps/passport-client/new-components/shared/Modals/ChangePasswordModal.tsx

@@ -71,7 +71,7 @@ export const ChangePasswordModal = (): JSX.Element | null => {
     try {
       let currentEncryptionKey: HexString;
       if (!hasSetupPassword) {
-        currentEncryptionKey = loadEncryptionKey() as string;
+        currentEncryptionKey = (await loadEncryptionKey()) as string;
       } else {
         const saltResult = await requestPasswordSalt(
           appConfig.zupassServer,

apps/passport-client/new-components/shared/Modals/PodsCollectionBottomModal.tsx

@@ -2,6 +2,7 @@ import { isEdDSAFrogPCD } from "@pcd/eddsa-frog-pcd";
 import { isEdDSATicketPCD } from "@pcd/eddsa-ticket-pcd";
 import { isEmailPCD } from "@pcd/email-pcd";
 import { PCD } from "@pcd/pcd-types";
+import { isPODEmailPCD } from "@pcd/pod-email-pcd";
 import {
   getImageUrlEntry,
   getDisplayOptions as getPodDisplayOptions,
@@ -57,7 +58,7 @@ const filterOverlappingEdDSATickets = (
     )
     .map((eddsa) => eddsa.id);
 
-  const noEmails = pcds.filter((p) => !isEmailPCD(p));
+  const noEmails = pcds.filter((p) => !isEmailPCD(p) && !isPODEmailPCD(p));
 
   return noEmails.filter((pcd) => !overlapping.includes(pcd.id));
 };
@@ -67,6 +68,8 @@ const getPcdName = (pcd: PCD<unknown, unknown>): string => {
       return pcd.claim.ticket.eventName + " - " + pcd.claim.ticket.ticketName;
     case isEmailPCD(pcd):
       return pcd.claim.emailAddress;
+    case isPODEmailPCD(pcd):
+      return pcd.claim.podEntries.emailAddress.value;
     case isPODPCD(pcd):
       return getPodDisplayOptions(pcd).header ?? pcd.id;
     case isEdDSAFrogPCD(pcd):

apps/passport-client/new-components/shared/utils.ts

@@ -1,4 +1,5 @@
 import { serializeStorage } from "@pcd/passport-interface";
+import { Buffer } from "buffer";
 import { useCallback, useEffect, useState } from "react";
 import { css } from "styled-components";
 import {

apps/passport-client/package.json

@@ -47,6 +47,8 @@
     "@pcd/pcd-collection": "0.15.0",
     "@pcd/pcd-types": "0.15.0",
     "@pcd/pod": "0.5.0",
+    "@pcd/pod-email-pcd": "0.1.0",
+    "@pcd/pod-email-pcd-ui": "0.1.0",
     "@pcd/pod-pcd": "0.5.0",
     "@pcd/pod-pcd-ui": "0.5.0",
     "@pcd/pod-ticket-pcd": "0.5.0",
@@ -76,13 +78,15 @@
     "@types/react-swipeable-views": "^0.13.5",
     "boring-avatars": "^1.10.1",
     "broadcast-channel": "^5.3.0",
+    "buffer": "^6.0.3",
     "csstype": "^3.1.3",
     "dotenv": "^16.0.3",
     "email-validator": "^2.0.4",
     "fast-json-stable-stringify": "^2.1.0",
     "handlebars": "^4.7.7",
     "isomorphic-timers-promises": "^1.0.1",
     "js-sha256": "^0.11.0",
+    "localforage": "^1.10.0",
     "lodash": "^4.17.21",
     "nanoevents": "^9.0.0",
     "pretty-ms": "^8.0.0",

apps/passport-client/pages/index.tsx

@@ -38,6 +38,7 @@ import { LocalStorageNotAccessibleScreen } from "../components/screens/LocalStor
 import { MissingScreen } from "../components/screens/MissingScreen";
 import { NoWASMScreen } from "../components/screens/NoWASMScreen";
 // import { RemoveEmailScreen } from "../components/screens/RemoveEmailScreen";
+import * as localForage from "localforage";
 import styled from "styled-components";
 import { NewLoader } from "../../../packages/lib/passport-ui/src/NewLoader";
 import { ProveScreen } from "../components/screens/ProveScreen/ProveScreen";
@@ -87,13 +88,15 @@ if (typeof window !== "undefined") {
   const params = new URLSearchParams(window.location.search);
   if (params.has("forceNewSession")) {
     localStorage.clear();
-    const newParams = new URLSearchParams(window.location.search);
-    newParams.delete("forceNewSession");
-    const newSearch = newParams.toString();
-    const newPath = `${window.location.pathname}${
-      newSearch ? `?${newSearch}` : ""
-    }${window.location.hash}`;
-    window.location.replace(newPath);
+    localForage.clear().then(() => {
+      const newParams = new URLSearchParams(window.location.search);
+      newParams.delete("forceNewSession");
+      const newSearch = newParams.toString();
+      const newPath = `${window.location.pathname}${
+        newSearch ? `?${newSearch}` : ""
+      }${window.location.hash}`;
+      window.location.replace(newPath);
+    });
   }
 }
 

apps/passport-client/src/appHooks.ts

@@ -305,7 +305,8 @@ export function useHasSetupPassword(): boolean {
 export function useLaserScannerKeystrokeInput(): string {
   const [typedText, setTypedText] = useState("");
   const nav = useNavigate();
-  const usingLaserScanner = loadUsingLaserScanner();
+  const [usingLaserScanner, setUsingLaserScanner] = useState(false);
+  loadUsingLaserScanner().then((value) => setUsingLaserScanner(value));
 
   useEffect(() => {
     function handleKeyDown(event: KeyboardEvent): void {

apps/passport-client/src/backgroundJobs.ts

@@ -129,8 +129,9 @@ export function useBackgroundJobs(): void {
     };
 
     setupBroadcastChannel(dispatch);
-    setupUsingLaserScanning();
-    startBackgroundJobs();
+    setupUsingLaserScanning().then(() => {
+      startBackgroundJobs();
+    });
 
     return () => {
       closeBroadcastChannel();
@@ -143,13 +144,13 @@ export function useBackgroundJobs(): void {
  * on the scan screen so the laser scanner can be used. This flag will be
  * exclusively used on the Devconnect laser scanning devices.
  */
-function setupUsingLaserScanning(): void {
+async function setupUsingLaserScanning(): Promise<void> {
   const queryParams = new URLSearchParams(window.location.search.slice(1));
   const laserQueryParam = queryParams.get("laser");
   if (laserQueryParam === "true") {
-    saveUsingLaserScanner(true);
+    await saveUsingLaserScanner(true);
   } else if (laserQueryParam === "false") {
     // We may want to use this to forcibly make this state false
-    saveUsingLaserScanner(false);
+    await saveUsingLaserScanner(false);
   }
 }