snap + middleware - 1

README.md

@@ -1 +1 @@
-# zk-collab-land
+# Cabal

circuits/README.md

@@ -1,9 +1,19 @@
+After you clone the repo, from the root of the repo run:
+```
+git submodule update --init
+```
+
 Follow the intructions here to get circom2 (the ZKSnark compiler) installed in your system
 https://docs.circom.io/getting-started/installation/
 
 You should probably also install VSCode extension to work with circom.
 
-Run `yarn install` to install dependencies.
+To install dependencies.
+```
+yarn install
+cd circom-ecdsa
+yarn install
+```
 
 ```
 mkdir zkeys
@@ -15,6 +25,6 @@ npx zkey-manager compile -c ./zkeys.config.yml
 npx zkey-manager downloadPtau -c ./zkeys.config.yml
 npx zkey-manager genZkeys -c ./zkeys.config.yml
 
-cp zkeys/VerifyCabal_86-3-10_prod.0.zkey ../frontend/public/
-cp zkeys/VerifyCabal_86-3-10_prod_js/VerifyCabal_86-3-10_prod.wasm ../frontend/public/
+cp zkeys/VerifyCabal_86-3-10_prod.0.zkey ../snap/src/snark_utils/
+cp zkeys/VerifyCabal_86-3-10_prod_js/VerifyCabal_86-3-10_prod.wasm ../snap/src/snark_utils/
 ```

circuits/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "zk-collab-land-circuits",
+  "name": "cabal-circuits",
   "version": "1.0.0",
   "description": "",
   "main": "index.js",
@@ -10,7 +10,6 @@
   "license": "GPLv3",
   "dependencies": {
     "circom_tester": "0.0.9",
-    "circomlib": "2.0.2",
     "elliptic": "^6.5.4",
     "ffjavascript": "0.2.46"
   },

circuits/yarn.lock

@@ -148,7 +148,7 @@ camelcase@^6.0.0:
   resolved "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz"
   integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==
 
-chai@^4.3.4:
+chai@^4.3.4, chai@^4.3.6:
   version "4.3.6"
   resolved "https://registry.npmjs.org/chai/-/chai-4.3.6.tgz"
   integrity sha512-bbcp3YfHCUzMOvKqsztczerVgBKSsEijCySNlHHbX3VG1nskvqjz5Rfso1gGwD6w6oOV3eI60pKuMOV5MV7p3Q==
@@ -161,19 +161,6 @@ chai@^4.3.4:
     pathval "^1.1.1"
     type-detect "^4.0.5"
 
-chai@^4.3.6:
-  version "4.3.6"
-  resolved "https://registry.yarnpkg.com/chai/-/chai-4.3.6.tgz#ffe4ba2d9fa9d6680cc0b370adae709ec9011e9c"
-  integrity sha512-bbcp3YfHCUzMOvKqsztczerVgBKSsEijCySNlHHbX3VG1nskvqjz5Rfso1gGwD6w6oOV3eI60pKuMOV5MV7p3Q==
-  dependencies:
-    assertion-error "^1.1.0"
-    check-error "^1.0.2"
-    deep-eql "^3.0.1"
-    get-func-name "^2.0.0"
-    loupe "^2.3.1"
-    pathval "^1.1.1"
-    type-detect "^4.0.5"
-
 chalk@^2.4.2:
   version "2.4.2"
   resolved "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz"
@@ -246,7 +233,7 @@ circom_tester@0.0.9:
     tmp-promise "^3.0.2"
     util "^0.12.4"
 
-circomlib@2.0.2, circomlib@^2.0.0:
+circomlib@^2.0.0:
   version "2.0.2"
   resolved "https://registry.npmjs.org/circomlib/-/circomlib-2.0.2.tgz"
   integrity sha512-hg6HnKAqAhx1NZc5kXuDOOgyOZYa6TQIKbITnuY7dgvBtIFPWh5aNRJhNUBrxrx+wHX3sZvhu0igmFKfaXoLsQ==

frontend/README.md

@@ -1,3 +1,12 @@
+# Local development
+
+Serve snap
+
+```
+cd ../snap
+yarn install && yarn build:clean && yarn serve
+```
+
 # Next.js + Tailwind CSS Example
 
 This example shows how to use [Tailwind CSS](https://tailwindcss.com/) [(v3.0)](https://tailwindcss.com/blog/tailwindcss-v3) with Next.js. It follows the steps outlined in the official [Tailwind docs](https://tailwindcss.com/docs/guides/nextjs).

frontend/pages/index.tsx

@@ -5,64 +5,87 @@ declare let window: any;
 
 export default function Home() {
   const [metamaskInstalled, setMetamaskInstalled] = useState(false)
+  const [metamaskConnected, setMetamaskConnected] = useState(false)
+
+  useEffect(() => {
+    const installed = isMetaMaskInstalled()
+    setMetamaskInstalled(installed)
+  }, [])
+
+  // TODO: this is only for local dev
+  const snapId = `local:http://localhost:8082`;
 
   const isMetaMaskInstalled = () => {
-    //Have to check the ethereum binding on the window object to see if it's installed
     const { ethereum } = window
+    //Have to check the ethereum binding on the window object to see if it's installed
     return Boolean(ethereum && ethereum.isMetaMask)
   }
 
-  useEffect(() => {
-    const installed = isMetaMaskInstalled()
-    setMetamaskInstalled(installed)
-  }, [])
+  const handleConnect = async () => {
+    await window.ethereum.request({
+      method: 'wallet_enable',
+      params: [{
+        wallet_snap: { [snapId]: {} },
+      }]
+    })
+    setMetamaskConnected(true)
+  }
+
+  const handleGenerate = async () => {
+    try {
+      const response = await window.ethereum.request({
+        method: 'wallet_invokeSnap',
+        params: [snapId, {
+          method: 'generateProof'
+        }]
+      })
+      console.log('Private key byte array (as ints) below:');
+      console.log(response);
+    } catch (err) {
+      console.log('ERROR');
+      console.error(err)
+      alert('Problem happened: ' + err.message || err)
+    }
+  }
 
   return (
     <div className="flex min-h-screen flex-col items-center justify-center py-2">
       <Head>
-        <title>Create Next App</title>
+        <title>Cabal</title>
         <link rel="icon" href="/favicon.ico" />
       </Head>
 
       <main className="flex w-full flex-1 flex-col items-center justify-center px-20 text-center">
         <h1 className="text-6xl font-bold">
           Welcome to{' '}
-          <a className="text-blue-600" href="https://nextjs.org">
-            ZK collab land
-          </a>
+          <span className="text-blue-600">
+            Cabal
+          </span>
         </h1>
 
         <div className="mt-6 flex max-w-4xl flex-wrap items-center justify-around sm:w-full">
-          <button className="rounded bg-blue-500 py-2 px-4 font-bold text-white hover:bg-blue-700">
-            {/* TODO disable button when metamask is not installed */}
+          <button
+            className="rounded bg-blue-500 py-2 px-4 font-bold text-white hover:bg-blue-700"
+            onClick={handleConnect}
+            disabled={!metamaskInstalled}
+          >
             {metamaskInstalled
               ? 'Connect to Metamask'
               : 'Metamask not installed'}
           </button>
-
-          {/* <a
-            href="https://nextjs.org/docs"
-            className="mt-6 w-96 rounded-xl border p-6 text-left hover:text-blue-600 focus:text-blue-600"
-          >
-            <h3 className="text-2xl font-bold">Documentation &rarr;</h3>
-            <p className="mt-4 text-xl">
-              Find in-depth information about Next.js features and API.
-            </p>
-          </a> */}
         </div>
-      </main>
 
-      <footer className="flex h-24 w-full items-center justify-center border-t">
-        <a
-          className="flex items-center justify-center"
-          href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Powered by{' '}
-          <img src="/vercel.svg" alt="Vercel Logo" className="ml-2 h-4" />
-        </a>
-      </footer>
+        {metamaskConnected &&
+          <div className="mt-6 flex max-w-4xl flex-wrap items-center justify-around sm:w-full">
+            <button
+              className="rounded bg-blue-500 py-2 px-4 font-bold text-white hover:bg-blue-700"
+              onClick={handleGenerate}
+            >
+              Generate Proof
+            </button>
+          </div>
+       }
+      </main>
     </div>
   )
 }

snap/.gitignore

@@ -0,0 +1,75 @@
+.DS_Store
+dist/
+coverage/
+public/
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# yarn v2
+.yarn/cache
+.yarn/unplugged
+.yarn/build-state.yml
+.yarn/install-state.gz
+.pnp.*

snap/README.md

@@ -0,0 +1 @@
+yarn install && yarn build:clean && yarn serve