rebase over add-remote-proof-generation latest commits: Remove check …

…for google client id and Remove copied SDK files and add zk-regex-sdk package
zkemail · Aug 7, 2024 · 664c4fc · 664c4fc
1 parent 05ae932
commit 664c4fc
Show file tree

Hide file tree

Showing 6 changed files with 81 additions and 41 deletions.
diff --git a/package.json b/package.json
@@ -9,9 +9,6 @@
   "author": "",
   "license": "MIT",
   "packageManager": "[email protected]",
-  "resolutions": {
-    "zk-regex-sdk": "portal:/Users/savitar/Projects/opensource/proof-of-twitter/packages/app/zk-regex-sdk"
-  },
   "devDependencies": {
     "autoprefixer": "^10.4.19",
     "postcss": "^8.4.40",

diff --git a/packages/app/package.json b/packages/app/package.json
@@ -7,6 +7,7 @@
     "@rainbow-me/rainbowkit": "^1.3.3",
     "@react-oauth/google": "^0.12.1",
     "@zk-email/helpers": "^6.1.3",
+    "@zk-email/zk-regex-sdk": "^1.0.2",
     "js-base64": "^3.7.7",
     "lodash": "^4.17.21",
     "react": "^17.0.2",

diff --git a/packages/app/src/index.tsx b/packages/app/src/index.tsx
@@ -14,7 +14,7 @@ import {
 import "@rainbow-me/rainbowkit/styles.css";
 import { GoogleOAuthProvider } from "@react-oauth/google";
 import { GoogleAuthProvider } from "./contexts/GoogleAuth";
-import { ZkRegexProvider } from "../zk-regex-sdk";
+import { ZkRegexProvider } from "@zk-email/zk-regex-sdk";
 
 import { ThemeProvider, CssBaseline } from '@mui/material';
 import theme from './theme'; 
@@ -34,44 +34,25 @@ const config = createConfig({
   connectors: connectors,
 });
 
-if (import.meta.env.VITE_GOOGLE_CLIENT_ID) {
-  ReactDOM.render(
-    <React.StrictMode>
-      <ThemeProvider theme={theme}>
-        <ZkRegexProvider
-          clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}
-          zkRegexRegistryUrl="https://registry-dev.zkregex.com"
-        >
-          <WagmiConfig config={config}>
-            <RainbowKitProvider chains={[sepolia]} theme={darkTheme()}>
-              <GoogleOAuthProvider
-                clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}
-              >
-                <GoogleAuthProvider>
-                  <App />
-                </GoogleAuthProvider>
-              </GoogleOAuthProvider>
-            </RainbowKitProvider>
-          </WagmiConfig>{" "}
-        </ZkRegexProvider>
-      </ThemeProvider>
-    </React.StrictMode>,
-    document.getElementById("root")
-  );
-} else {
-  ReactDOM.render(
-    <React.StrictMode>
+
+ReactDOM.render(
+  <React.StrictMode>
+    <ThemeProvider theme={theme}> 
       <ZkRegexProvider
         clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}
         zkRegexRegistryUrl="https://registry-dev.zkregex.com"
       >
         <WagmiConfig config={config}>
           <RainbowKitProvider chains={[sepolia]} theme={darkTheme()}>
-            <App />
+            <GoogleOAuthProvider clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}>
+              <GoogleAuthProvider>
+                <App />
+              </GoogleAuthProvider>
+            </GoogleOAuthProvider>
           </RainbowKitProvider>
-        </WagmiConfig>
+        </WagmiConfig>{" "}
       </ZkRegexProvider>
-    </React.StrictMode>,
-    document.getElementById("root")
-  );
-}
+    </ThemeProvider>
+  </React.StrictMode>,
+  document.getElementById("root")
+);
diff --git a/packages/app/src/pages/MainPage.tsx b/packages/app/src/pages/MainPage.tsx
@@ -30,8 +30,8 @@ import {
 } from "../hooks/useGmailClient";
 import { formatDateTime } from "../helpers/dateTimeFormat";
 import EmailInputMethod from "../components/EmailInputMethod";
-import { useZkRegex } from "../../zk-regex-sdk";
 import { randomUUID } from "crypto";
+import { useZkRegex } from "@zk-email/zk-regex-sdk";
 
 import { Box, Grid, Typography } from "@mui/material";
 import Stepper from '../components/Stepper'
@@ -318,10 +318,14 @@ export const MainPage: React.FC<{}> = (props) => {
 
 
 
+
+
+
   const theme = useTheme()
 
   const [counter, setCounter] = useState(0);
 
+
   const [steps, setSteps] = useState<[string, 'completed' | 'uncompleted'][]>([
     ['SEND RESET EMAIL', 'completed'],
     ['COPY/PASTE DKIM SIG', 'uncompleted'],
@@ -384,7 +388,7 @@ export const MainPage: React.FC<{}> = (props) => {
 
 
   useEffect(() => {
-    if (status === 'done' ) {
+    if (status === 'done' || status === 'proof-files-downloaded-successfully') {
       markStepCompleted(3); // Mark 'PROVE' step as completed
     } else {
       // markStepUncompleted(3); // Mark 'PROVE' step as uncompleted 
@@ -422,6 +426,27 @@ export const MainPage: React.FC<{}> = (props) => {
 
 
 
+  const generateProofWithWorker = (input: any, circuitArtifactsUrl: string, circuitName: string): Promise<{ proof: any, publicSignals: any, error?: string }> => {
+    return new Promise((resolve, reject) => {
+      // const proofWorker = new Worker(new URL('../proofWorker.tsx', import.meta.url));
+      const proofWorker = new Worker(new URL('../proofWorker.tsx', import.meta.url), { type: 'module' });
+
+
+      proofWorker.onmessage = (e) => {
+        resolve(e.data);
+        proofWorker.terminate();
+      };
+
+      proofWorker.onerror = (e) => {
+        reject(new Error(`Worker error: ${e.message}`));
+        proofWorker.terminate();
+      };
+
+      proofWorker.postMessage({ input, circuitArtifactsUrl, circuitName });
+    });
+  };
+
+
 
   return (
     <Grid container >
@@ -708,12 +733,25 @@ export const MainPage: React.FC<{}> = (props) => {
                   setStatus("generating-proof");
                   console.log("Starting proof generation");
                   // alert("Generating proof, will fail due to input");
+
+
+                  // //TEST CHANGES W/ WORKER BELOW
                   const { proof, publicSignals } = await generateProof(
                     input,
                     // @ts-ignore
                     import.meta.env.VITE_CIRCUIT_ARTIFACTS_URL,
                     CIRCUIT_NAME
                   );
+
+                  // const { proof, publicSignals, error } = await generateProofWithWorker(
+                  //   input,
+                  //   import.meta.env.VITE_CIRCUIT_ARTIFACTS_URL,
+                  //   CIRCUIT_NAME
+                  // );
+
+                  // TEST CHANGES ABOVE
+
+
                   //const proof = JSON.parse('{"pi_a": ["19201501460375869359786976350200749752225831881815567077814357716475109214225", "11505143118120261821370828666956392917988845645366364291926723724764197308214", "1"], "pi_b": [["17114997753466635923095897108905313066875545082621248342234075865495571603410", "7192405994185710518536526038522451195158265656066550519902313122056350381280"], ["13696222194662648890012762427265603087145644894565446235939768763001479304886", "2757027655603295785352548686090997179551660115030413843642436323047552012712"], ["1", "0"]], "pi_c": ["6168386124525054064559735110298802977718009746891233616490776755671099515304", "11077116868070103472532367637450067545191977757024528865783681032080180232316", "1"], "protocol": "groth16", "curve": "bn128"}');
                   //const publicSignals = JSON.parse('["0", "0", "0", "0", "0", "0", "0", "0", "32767059066617856", "30803244233155956", "0", "0", "0", "0", "27917065853693287", "28015", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "113659471951225", "0", "0", "1634582323953821262989958727173988295", "1938094444722442142315201757874145583", "375300260153333632727697921604599470", "1369658125109277828425429339149824874", "1589384595547333389911397650751436647", "1428144289938431173655248321840778928", "1919508490085653366961918211405731923", "2358009612379481320362782200045159837", "518833500408858308962881361452944175", "1163210548821508924802510293967109414", "1361351910698751746280135795885107181", "1445969488612593115566934629427756345", "2457340995040159831545380614838948388", "2612807374136932899648418365680887439", "16021263889082005631675788949457422", "299744519975649772895460843780023483", "3933359104846508935112096715593287", "556307310756571904145052207427031380052712977221"]');
                   console.log("Finished proof generation");
@@ -1004,4 +1042,7 @@ const Overlay = styled.div`
 `;
 
 
-export default MainPage;
+export default MainPage;
+
+
+
diff --git a/packages/app/proofWorker.js → packages/app/src/proofWorker.tsx b/packages/app/proofWorker.js → packages/app/src/proofWorker.tsx
@@ -1,10 +1,17 @@
 // src/proofWorker.js
 
-import { generateProof } from "@zk-email/helpers/dist/zkp";
+// import { generateProof } from "@zk-email/helpers/dist/zkp";
+
+import { generateProof } from "@zk-email/helpers/dist/chunked-zkey";
+
 
 self.onmessage = async (e) => {
   const { input, circuitArtifactsUrl, circuitName } = e.data;
 
+  console.log('input', input)
+  console.log('circuitArtifactsUrl', circuitArtifactsUrl)
+  console.log('circuitName', circuitName)
+
   try {
     const { proof, publicSignals } = await generateProof(
       input,

diff --git a/yarn.lock b/yarn.lock
@@ -4972,6 +4972,7 @@ __metadata:
     "@types/styled-components": ^5.1.34
     "@vitejs/plugin-react": ^4.2.1
     "@zk-email/helpers": ^6.1.3
+    "@zk-email/zk-regex-sdk": ^1.0.2
     crypto-browserify: ^3.12.0
     jest: ^29.7.0
     jest-environment-jsdom: ^29.7.0
@@ -5021,6 +5022,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@zk-email/zk-regex-sdk@npm:^1.0.2":
+  version: 1.0.2
+  resolution: "@zk-email/zk-regex-sdk@npm:1.0.2"
+  dependencies:
+    "@react-oauth/google": ^0.12.1
+    js-base64: ^3.7.7
+  peerDependencies:
+    react: ^18.3.1
+  checksum: 7d2b9fd16d41d18666120b5047709b854a4df8dfd8fbc588ac9951d298b4e2931f8d41a357f625d3c79370cf9d8d0e8ee499ef8d31bd266bf38307312ee1316b
+  languageName: node
+  linkType: hard
+
 "abab@npm:^2.0.6":
   version: 2.0.6
   resolution: "abab@npm:2.0.6"