diff --git a/packages/nextjs/pages/example-zk/BirthDateSignature.tsx b/packages/nextjs/pages/example-zk/BirthDateSignature.tsx index e28f139..1442f92 100644 --- a/packages/nextjs/pages/example-zk/BirthDateSignature.tsx +++ b/packages/nextjs/pages/example-zk/BirthDateSignature.tsx @@ -38,12 +38,20 @@ export const signBirthYear = async (form: TForm) => { export const BirthDateSignature = ({ aliceDefaultAge }: { aliceDefaultAge: number }) => { const [form, setForm] = useState(() => getInitialFormState(aliceDefaultAge)); + const ethereumAddress = useBirthYearProofsStore(state => state.ethereumAddress); + const setEthereumAddress = useBirthYearProofsStore(state => state.setEthereumAddress); + const birthYear = useBirthYearProofsStore(state => state.birthYear); + const setBirthYear = useBirthYearProofsStore(state => state.setBirthYear); const setSignedBirthYear = useBirthYearProofsStore(state => state.setSignedBirthYear); const setSignerPublicKey = useBirthYearProofsStore(state => state.setSignerPublicKey); const handleSubmission = async () => { try { - const { signedMessage, signerPublicKey } = await signBirthYear(form); + const { signedMessage, signerPublicKey } = await signBirthYear({ + ...form, + personEthereumAddress: ethereumAddress, + birthYear, + }); setSignedBirthYear(signedMessage); setSignerPublicKey(signerPublicKey); notification.success("Successfully signed birth year"); @@ -84,10 +92,10 @@ export const BirthDateSignature = ({ aliceDefaultAge }: { aliceDefaultAge: numbe Enter your Ethereum address setForm({ ...form, personEthereumAddress: val })} + onChange={(value: string) => setEthereumAddress(value)} />
@@ -98,8 +106,8 @@ export const BirthDateSignature = ({ aliceDefaultAge }: { aliceDefaultAge: numbe type="number" placeholder="Birth year" className="input input-bordered" - value={form.birthYear} - onChange={e => setForm({ ...form, birthYear: e.target.value as unknown as number })} + value={birthYear} + onChange={e => setBirthYear(e.target.value)} />
diff --git a/packages/nextjs/pages/example-zk/GenerateProof.tsx b/packages/nextjs/pages/example-zk/GenerateProof.tsx index 047418c..ac91287 100644 --- a/packages/nextjs/pages/example-zk/GenerateProof.tsx +++ b/packages/nextjs/pages/example-zk/GenerateProof.tsx @@ -61,6 +61,10 @@ export const parseForm = (form: TForm) => { }; export const GenerateProof = ({ requiredBirthYear }: { requiredBirthYear: number }) => { + const ethereumAddress = useBirthYearProofsStore(state => state.ethereumAddress); + const setEthereumAddress = useBirthYearProofsStore(state => state.setEthereumAddress); + const birthYear = useBirthYearProofsStore(state => state.birthYear); + const setBirthYear = useBirthYearProofsStore(state => state.setBirthYear); const setProof = useBirthYearProofsStore(state => state.setProof); const signedBirthYear = useBirthYearProofsStore(state => state.signedBirthYear); const signerPublicKey = useBirthYearProofsStore(state => state.signerPublicKey); @@ -73,7 +77,7 @@ export const GenerateProof = ({ requiredBirthYear }: { requiredBirthYear: number setIsProofRunning(true); const notifcationId = notification.loading("Generating proof..."); try { - const parsedForm = parseForm(form); + const parsedForm = parseForm({ ...form, personEthereumAddress: ethereumAddress, birthYear }); const { proof } = await generateProof("LessThanSignedAge", parsedForm as ParsedArgs); setProof(`0x${proof}`); notification.success("Proof generated"); @@ -120,8 +124,8 @@ export const GenerateProof = ({ requiredBirthYear }: { requiredBirthYear: number type="number" placeholder="Signed birth year" className="input input-bordered" - value={form.birthYear} - onChange={e => setForm({ ...form, birthYear: e.target.value as unknown as number })} + value={birthYear} + onChange={e => setBirthYear(e.target.value)} />
@@ -133,7 +137,7 @@ export const GenerateProof = ({ requiredBirthYear }: { requiredBirthYear: number placeholder="Required birth year" className="input input-bordered" value={form.requiredBirthYear} - onChange={e => setForm({ ...form, requiredBirthYear: e.target.value as unknown as number })} + onChange={e => setForm({ ...form, requiredBirthYear: Number(e.target.value) })} />
@@ -168,10 +172,10 @@ export const GenerateProof = ({ requiredBirthYear }: { requiredBirthYear: number *Ethereum address signature setForm({ ...form, personEthereumAddress: val })} + onChange={(value: string) => setEthereumAddress(value)} />
diff --git a/packages/nextjs/pages/example-zk/ZkSteps.tsx b/packages/nextjs/pages/example-zk/ZkSteps.tsx index 309635b..c5297e7 100644 --- a/packages/nextjs/pages/example-zk/ZkSteps.tsx +++ b/packages/nextjs/pages/example-zk/ZkSteps.tsx @@ -41,13 +41,15 @@ const ZkSteps: NextPage = () => { > Previous - + {currentStep !== LAST_STEP && ( + + )} )}
diff --git a/packages/nextjs/services/store/birth-year-proofs.ts b/packages/nextjs/services/store/birth-year-proofs.ts index 1c9fd88..369cc0e 100644 --- a/packages/nextjs/services/store/birth-year-proofs.ts +++ b/packages/nextjs/services/store/birth-year-proofs.ts @@ -2,18 +2,26 @@ import { create } from "zustand"; import { HexString } from "~~/hooks/noir/useProofGenerator"; type BirthYearProofs = { + ethereumAddress: string; + birthYear: number; signedBirthYear: string; signerPublicKey: string; proof: HexString; + setEthereumAddress: (input: string) => void; + setBirthYear: (input: string) => void; setSignedBirthYear: (input: string) => void; setSignerPublicKey: (input: string) => void; setProof: (input: HexString) => void; }; export const useBirthYearProofsStore = create(set => ({ + ethereumAddress: "", + birthYear: 2014, signedBirthYear: "", signerPublicKey: "", proof: "0x", + setEthereumAddress: (input: string) => set({ ethereumAddress: input }), + setBirthYear: (input: string) => set({ birthYear: Number(input) }), setSignedBirthYear: (input: string) => set({ signedBirthYear: input }), setSignerPublicKey: (input: string) => set({ signerPublicKey: input }), setProof: (input: HexString) => set({ proof: input }),