Update to 0.0.8 (zkp2p#121)

* Update send vkey

* Update ramp abi

* Upgrade zkp2p package to 0.0.8

* Add circuit specific copy to the modal verification step for submit

* Update on ramp call with new function signature

* Copy changes to new position and new registration

* Update remote proving rpc call parameter from order_id to intent_hash

* Update download path to 0.0.8

client/package.json

@@ -20,7 +20,7 @@
     "@types/styled-components": "^5.1.24",
     "@typescript-eslint/eslint-plugin": "^4.5.0",
     "@typescript-eslint/parser": "^4.5.0",
-    "@zkp2p/circuits-circom": "^0.0.7-rc2",
+    "@zkp2p/circuits-circom": "^0.0.8",
     "addressparser": "^1.0.1",
     "atob": "^2.1.2",
     "babel-eslint": "^10.1.0",

client/src/components/Deposit/NewPosition.tsx

@@ -355,7 +355,7 @@ export const NewPosition: React.FC<NewPositionProps> = ({
           <SingleLineInput
             label="Receive Amount"
             value={receiveAmountInput}
-            placeholder={'110'}
+            placeholder={'1050'}
             onChange={(e) => handleInputChange(e.currentTarget.value, setReceiveAmountInput)}
           />
           <ButtonContainer>

client/src/components/Deposit/OffRamp.tsx

@@ -86,12 +86,12 @@ export const OffRamp: React.FC<OffRampProps> = ({
    */
 
   //
-  // new: onRampWithConvenience(uint256[2] memory _a, uint256[2][2] memory _b, uint256[2] memory _c, uint256[9] memory _signals)
+  // onRampWithReceiveEmail(uint256[2] memory _a, uint256[2][2] memory _b, uint256[2] memory _c, uint256[9] memory _signals)
   //
   const { config: writeCompleteOrderConfig } = usePrepareContractWrite({
     address: rampAddress,
     abi: rampAbi,
-    functionName: 'onRampWithConvenience',
+    functionName: 'onRampWithReceiveEmail',
     args: [
       ...reformatProofForChain(proof),
       publicSignals ? JSON.parse(publicSignals) : null,

client/src/components/ProofGen/ProofForm.tsx

@@ -93,7 +93,7 @@ export const ProofGenerationForm: React.FC<ProofGenerationFormProps> = ({
   } = useRemoteProofGen({
     emailType: remoteProofGenEmailType,
     emailBody: emailFull,
-    orderId: circuitInputs,
+    intentHash: circuitInputs,
   });
 
   useEffect(() => {
@@ -326,6 +326,7 @@ export const ProofGenerationForm: React.FC<ProofGenerationFormProps> = ({
             publicSignals={publicSignals}
             onBackClick={handleModalBackClicked}
             status={status}
+            circuitType={circuitType}
             buttonTitle={getModalCtaTitle()}
             isSubmitProcessing={isSubmitProcessing}
             isSubmitSuccessful={isSubmitSuccessful}

client/src/components/RegistrationForm/NewRegistration.tsx

@@ -142,7 +142,7 @@ export const NewRegistration: React.FC<NewRegistrationProps> = ({
         </button>
 
         <ThemedText.HeadlineSmall style={{ flex: '1', margin: 'auto', textAlign: 'center' }}>
-          Update Registration
+          New Registration
         </ThemedText.HeadlineSmall>
 
         <LabeledSwitch

client/src/components/Swap/OnRamp.tsx

@@ -16,9 +16,10 @@ import { LabeledSwitch } from "../common/LabeledSwitch";
 import { SEND_KEY_FILE_NAME, RemoteProofGenEmailTypes  } from "@helpers/constants";
 import { PROVING_TYPE_TOOLTIP, PROOF_FORM_SEND_INSTRUCTIONS } from "@helpers/tooltips";
 import { reformatProofForChain } from "@helpers/submitProof";
+import useBalances from '@hooks/useBalance';
+import useOnRamperIntents from '@hooks/useOnRamperIntents';
 import useProofGenSettings from '@hooks/useProofGenSettings';
 import useSmartContracts from '@hooks/useSmartContracts';
-import useOnRamperIntents from '@hooks/useOnRamperIntents';
 
 
 interface OnRampProps {
@@ -41,12 +42,13 @@ export const OnRamp: React.FC<OnRampProps> = ({
     sendProcessorAbi,
   } = useSmartContracts();
   const { refetchIntentHash } = useOnRamperIntents();
+  const { refetchUsdcBalance } = useBalances();
 
   /*
    * State
    */
 
-  const [shouldConfigureOffRampWrite, setShouldConfigureOffRampWrite] = useState<boolean>(false);
+  const [shouldConfigureRampWrite, setShouldConfigureRampWrite] = useState<boolean>(false);
   const [shouldFetchVerifyProof, setShouldFetchVerifyProof] = useState<boolean>(false);
 
   // ----- transaction state -----
@@ -82,7 +84,7 @@ export const OnRamp: React.FC<OnRampProps> = ({
    */
 
   //
-  // onRamp(uint256[2] memory _a, uint256[2][2] memory _b, uint256[2] memory _c, uint256[8] memory _signals)
+  // onRamp(uint256[2] memory _a, uint256[2][2] memory _b, uint256[2] memory _c, uint256[10] memory _signals)
   //
   const { config: writeSubmitOnRampConfig } = usePrepareContractWrite({
     address: rampAddress,
@@ -95,7 +97,7 @@ export const OnRamp: React.FC<OnRampProps> = ({
     onError: (error: { message: any }) => {
       console.error(error.message);
     },
-    enabled: shouldConfigureOffRampWrite
+    enabled: shouldConfigureRampWrite
   });
 
   const {
@@ -112,6 +114,7 @@ export const OnRamp: React.FC<OnRampProps> = ({
     onSuccess(data) {
       console.log('writeSubmitOnRampAsync successful: ', data);
 
+      refetchUsdcBalance?.();
       refetchIntentHash?.();
     },
   });
@@ -137,9 +140,9 @@ export const OnRamp: React.FC<OnRampProps> = ({
 
   useEffect(() => {
     if (verifyProofRaw) {
-      setShouldConfigureOffRampWrite(true);
+      setShouldConfigureRampWrite(true);
     } else {
-      setShouldConfigureOffRampWrite(false);
+      setShouldConfigureRampWrite(false);
     }
   }, [verifyProofRaw]);
 

client/src/components/modals/Modal.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useMemo, useState } from "react";
 import styled from 'styled-components';
 import { ArrowLeft } from 'react-feather';
 import { useNavigate } from 'react-router-dom';
+import { CircuitType } from '@zkp2p/circuits-circom/scripts/generate_input';
 
 import { ThemedText } from '../../theme/text'
 import { LabeledSwitch } from "../common/LabeledSwitch";
@@ -22,6 +23,7 @@ interface ModalProps {
   publicSignals: string;
   onBackClick: () => void
   status: ProofGenerationStatus;
+  circuitType: CircuitType;
   buttonTitle: string;
   isSubmitProcessing: boolean;
   isSubmitSuccessful: boolean;
@@ -35,6 +37,7 @@ export const Modal: React.FC<ModalProps> = ({
   publicSignals,
   onBackClick,
   status,
+  circuitType,
   buttonTitle,
   isSubmitProcessing,
   isSubmitSuccessful,
@@ -181,6 +184,7 @@ export const Modal: React.FC<ModalProps> = ({
           key={0}
           type={VerificationStepType.DOWNLOAD}
           progress={downloadStepState}
+          circuitType={circuitType}
         />
       );
     }
@@ -190,6 +194,7 @@ export const Modal: React.FC<ModalProps> = ({
         key={1}
         type={VerificationStepType.PROVE}
         progress={proveStepState}
+        circuitType={circuitType}
       />
     );
 
@@ -198,6 +203,7 @@ export const Modal: React.FC<ModalProps> = ({
         key={2}
         type={VerificationStepType.VERIFY}
         progress={verificationStepState}
+        circuitType={circuitType}
       />
     );
 
@@ -206,6 +212,7 @@ export const Modal: React.FC<ModalProps> = ({
         key={3}
         type={VerificationStepType.SUBMIT}
         progress={submitStepState}
+        circuitType={circuitType}
       />
     );
 

client/src/components/modals/VerificationStepRow.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import styled from 'styled-components/macro'
 import { Download, Cpu, Check, Circle, Shield, Play } from 'react-feather';
+import { CircuitType } from '@zkp2p/circuits-circom/scripts/generate_input';
 
 import Spinner from "@components/common/Spinner";
 import {
@@ -13,6 +14,8 @@ import {
   PROOF_MODAL_VERIFY_SUBTITLE,
   PROOF_MODAL_SUBMIT_TITLE,
   PROOF_MODAL_SUBMIT_SUBTITLE,
+  PROOF_MODAL_REGISTRATION_SUBMIT_TITLE,
+  PROOF_MODAL_REGISTRATION_SUBMIT_SUBTITLE
 } from "@helpers/tooltips"
 import useProofGenSettings from "@hooks/useProofGenSettings"
 
@@ -33,13 +36,15 @@ export const VerificationState = {
 interface VerificationStepRowProps {
   type: string;
   progress: string;
+  circuitType: CircuitType;
 }
 
 export type VerificationStepRowData = VerificationStepRowProps;
 
 export const VerificationStepRow: React.FC<VerificationStepRowProps> = ({
   type,
-  progress
+  progress,
+  circuitType
 }: VerificationStepRowProps) => {
   VerificationStepRow.displayName = "VerificationStepRow";
 
@@ -96,7 +101,15 @@ export const VerificationStepRow: React.FC<VerificationStepRowProps> = ({
         return PROOF_MODAL_VERIFY_TITLE;
 
       case VerificationStepType.SUBMIT:
-        return PROOF_MODAL_SUBMIT_TITLE;
+        switch (circuitType) {
+          case CircuitType.EMAIL_VENMO_REGISTRATION:
+            return PROOF_MODAL_REGISTRATION_SUBMIT_TITLE;
+
+          case CircuitType.EMAIL_VENMO_RECEIVE:
+          case CircuitType.EMAIL_VENMO_SEND:
+          default:
+            return PROOF_MODAL_SUBMIT_TITLE;
+        }
 
       default:
         return null;
@@ -119,7 +132,15 @@ export const VerificationStepRow: React.FC<VerificationStepRowProps> = ({
         return PROOF_MODAL_VERIFY_SUBTITLE;
 
       case VerificationStepType.SUBMIT:
-        return PROOF_MODAL_SUBMIT_SUBTITLE;
+        switch (circuitType) {
+          case CircuitType.EMAIL_VENMO_REGISTRATION:
+            return PROOF_MODAL_REGISTRATION_SUBMIT_SUBTITLE;
+
+          case CircuitType.EMAIL_VENMO_RECEIVE:
+          case CircuitType.EMAIL_VENMO_SEND:
+          default:
+            return PROOF_MODAL_SUBMIT_SUBTITLE;
+        }
 
       default:
         return null;

client/src/contexts/Balances/BalancesContext.ts

@@ -7,6 +7,7 @@ const defaultValues: ContextValues = {
   usdcBalance: null,
   usdcApprovalToRamp: null,
   refetchUsdcApprovalToRamp: null,
+  refetchUsdcBalance: null,
 };
 
 const BalancesContext = createContext<ContextValues>(defaultValues)

client/src/contexts/Balances/BalancesProvider.tsx

@@ -51,7 +51,7 @@ const BalancesProvider = ({ children }: ProvidersProps) => {
     data: usdcBalanceRaw,
     // isLoading: isFetchUsdcBalanceLoading,
     // isError: isFetchUsdcBalanceError,
-    // refetch: refetchUsdcBalance,
+    refetch: refetchUsdcBalance,
   } = useBalance({
     address: loggedInEthereumAddress ?? ZERO_ADDRESS,
     token: usdcAddress,
@@ -180,6 +180,7 @@ const BalancesProvider = ({ children }: ProvidersProps) => {
         usdcBalance,
         usdcApprovalToRamp,
         refetchUsdcApprovalToRamp,
+        refetchUsdcBalance,
       }}
     >
       {children}

client/src/contexts/Balances/types.ts

@@ -3,4 +3,5 @@ export interface ContextValues {
   usdcBalance: bigint | null
   usdcApprovalToRamp: bigint | null
   refetchUsdcApprovalToRamp: (() => void) | null
+  refetchUsdcBalance: (() => void) | null
 }

client/src/helpers/abi/ramp.abi.ts

@@ -855,9 +855,9 @@ export const abi = [
         "type": "uint256[2]"
       },
       {
-        "internalType": "uint256[8]",
+        "internalType": "uint256[10]",
         "name": "_signals",
-        "type": "uint256[8]"
+        "type": "uint256[10]"
       }
     ],
     "name": "onRamp",

client/src/helpers/abi/send.abi.ts

@@ -130,9 +130,9 @@ export const abi = [
             "type": "uint256[2]"
           },
           {
-            "internalType": "uint256[8]",
+            "internalType": "uint256[10]",
             "name": "signals",
-            "type": "uint256[8]"
+            "type": "uint256[10]"
           }
         ],
         "internalType": "struct ISendProcessor.SendProof",
@@ -147,6 +147,11 @@ export const abi = [
         "name": "amount",
         "type": "uint256"
       },
+      {
+        "internalType": "uint256",
+        "name": "timestamp",
+        "type": "uint256"
+      },
       {
         "internalType": "bytes32",
         "name": "offRamperIdHash",
@@ -251,9 +256,9 @@ export const abi = [
         "type": "uint256[2]"
       },
       {
-        "internalType": "uint256[8]",
+        "internalType": "uint256[10]",
         "name": "_pubSignals",
-        "type": "uint256[8]"
+        "type": "uint256[10]"
       }
     ],
     "name": "verifyProof",

client/src/helpers/constants.ts

@@ -44,7 +44,7 @@ export const DEFAULT_NETWORK = "goerli";
 
 
 // Proving key paths
-export const HOSTED_FILES_PATH = "https://s3.amazonaws.com/zk-p2p/v2/v0.0.7/";
+export const HOSTED_FILES_PATH = "https://s3.amazonaws.com/zk-p2p/v2/v0.0.8/";
 export const REGISTRATION_KEY_FILE_NAME = "venmo_registration/venmo_registration";
 export const SEND_KEY_FILE_NAME = "venmo_send/venmo_send";
 export const RECEIVE_KEY_FILE_NAME = "venmo_receive/venmo_receive";

client/src/helpers/tooltips.ts

@@ -81,9 +81,17 @@ export const PROOF_MODAL_VERIFY_SUBTITLE = `
 `;
 
 export const PROOF_MODAL_SUBMIT_TITLE = `
-  Complete Verification
+  Complete Order
+`;
+
+export const PROOF_MODAL_REGISTRATION_SUBMIT_TITLE = `
+  Complete Registration
 `;
 
 export const PROOF_MODAL_SUBMIT_SUBTITLE = `
-  Submit on chain to complete transaction
+  Submit transaction to complete the on ramp
+`;
+
+export const PROOF_MODAL_REGISTRATION_SUBMIT_SUBTITLE = `
+  Submit transaction to complete registration
 `;