From 4889cb0e73ead181cc0f991c4294de2660c25c90 Mon Sep 17 00:00:00 2001 From: Sasha Date: Thu, 26 Oct 2023 15:59:58 +0200 Subject: [PATCH] add RLN init --- examples/rln-js/next.config.js | 7 + examples/rln-js/package-lock.json | 192 +++++++++++++------------- examples/rln-js/package.json | 2 +- examples/rln-js/src/app/home/page.tsx | 4 + examples/rln-js/src/hooks/index.ts | 1 + examples/rln-js/src/hooks/useRLN.ts | 45 ++++++ examples/rln-js/src/services/rln.ts | 32 +++-- 7 files changed, 169 insertions(+), 114 deletions(-) create mode 100644 examples/rln-js/src/hooks/useRLN.ts diff --git a/examples/rln-js/next.config.js b/examples/rln-js/next.config.js index a35bfad..f4eb9d2 100644 --- a/examples/rln-js/next.config.js +++ b/examples/rln-js/next.config.js @@ -1,6 +1,13 @@ /** @type {import('next').NextConfig} */ const nextConfig = { output: "export", + webpack: (config) => { + config.externals.push({ + "utf-8-validate": "commonjs utf-8-validate", + bufferutil: "commonjs bufferutil", + }); + return config; + }, }; module.exports = nextConfig; diff --git a/examples/rln-js/package-lock.json b/examples/rln-js/package-lock.json index cfa9e86..c8216ac 100644 --- a/examples/rln-js/package-lock.json +++ b/examples/rln-js/package-lock.json @@ -8,7 +8,7 @@ "name": "rln-js", "version": "0.1.0", "dependencies": { - "@waku/rln": "^0.1.1-fa49e29", + "@waku/rln": "0.1.1-fa49e29", "ethers": "^5.7.2", "next": "13.5.6", "protobufjs": "^7.2.5", @@ -152,9 +152,9 @@ } }, "node_modules/@eslint-community/regexpp": { - "version": "4.9.1", - "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.9.1.tgz", - "integrity": "sha512-Y27x+MBLjXa+0JWDhykM3+JE+il3kHKAEqabfEWq3SDhZjLYb6/BHL/JKFnH3fe207JaXkyDo685Oc2Glt6ifA==", + "version": "4.10.0", + "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.0.tgz", + "integrity": "sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==", "dev": true, "engines": { "node": "^12.0.0 || ^14.0.0 || >=16.0.0" @@ -491,11 +491,6 @@ "scrypt-js": "3.0.1" } }, - "node_modules/@ethersproject/json-wallets/node_modules/aes-js": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-3.0.0.tgz", - "integrity": "sha512-H7wUZRn8WpTq9jocdxQ2c8x2sKo9ZVmzfRE13GiNJXfp7NcKYEdvl3vspKjXox6RIG2VtaRe4JFvxG4rqp2Zuw==" - }, "node_modules/@ethersproject/keccak256": { "version": "5.7.0", "resolved": "https://registry.npmjs.org/@ethersproject/keccak256/-/keccak256-5.7.0.tgz", @@ -622,26 +617,6 @@ "ws": "7.4.6" } }, - "node_modules/@ethersproject/providers/node_modules/ws": { - "version": "7.4.6", - "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz", - "integrity": "sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==", - "engines": { - "node": ">=8.3.0" - }, - "peerDependencies": { - "bufferutil": "^4.0.1", - "utf-8-validate": "^5.0.2" - }, - "peerDependenciesMeta": { - "bufferutil": { - "optional": true - }, - "utf-8-validate": { - "optional": true - } - } - }, "node_modules/@ethersproject/random": { "version": "5.7.0", "resolved": "https://registry.npmjs.org/@ethersproject/random/-/random-5.7.0.tgz", @@ -1336,11 +1311,11 @@ "dev": true }, "node_modules/@types/node": { - "version": "20.8.8", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.8.tgz", - "integrity": "sha512-YRsdVxq6OaLfmR9Hy816IMp33xOBjfyOgUd77ehqg96CFywxAPbDbXvAsuN2KVg2HOT8Eh6uAfU+l4WffwPVrQ==", + "version": "20.8.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.9.tgz", + "integrity": "sha512-UzykFsT3FhHb1h7yD4CA4YhBHq545JC0YnEz41xkipN88eKQtL6rSgocL5tbAP6Ola9Izm/Aw4Ora8He4x0BHg==", "dependencies": { - "undici-types": "~5.25.1" + "undici-types": "~5.26.4" } }, "node_modules/@types/prop-types": { @@ -1350,9 +1325,9 @@ "devOptional": true }, "node_modules/@types/react": { - "version": "18.2.31", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.31.tgz", - "integrity": "sha512-c2UnPv548q+5DFh03y8lEDeMfDwBn9G3dRwfkrxQMo/dOtRHUUO57k6pHvBIfH/VF4Nh+98mZ5aaSe+2echD5g==", + "version": "18.2.33", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.33.tgz", + "integrity": "sha512-v+I7S+hu3PIBoVkKGpSYYpiBT1ijqEzWpzQD62/jm4K74hPpSP7FF9BnKG6+fg2+62weJYkkBWDJlZt5JO/9hg==", "devOptional": true, "dependencies": { "@types/prop-types": "*", @@ -1554,9 +1529,9 @@ } }, "node_modules/aes-js": { - "version": "4.0.0-beta.5", - "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-4.0.0-beta.5.tgz", - "integrity": "sha512-G965FqalsNyrPqgEGON7nIx1e/OVENSgiEIzyC63haUMuvNnwIgIjMs52hlTCKhkBny7A2ORNlfY9Zu+jmGk1Q==" + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-3.0.0.tgz", + "integrity": "sha512-H7wUZRn8WpTq9jocdxQ2c8x2sKo9ZVmzfRE13GiNJXfp7NcKYEdvl3vspKjXox6RIG2VtaRe4JFvxG4rqp2Zuw==" }, "node_modules/ajv": { "version": "6.12.6", @@ -2042,9 +2017,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001553", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001553.tgz", - "integrity": "sha512-N0ttd6TrFfuqKNi+pMgWJTb9qrdJu4JSpgPFLe/lrD19ugC6fZgF0pUewRowDwzdDnb9V41mFcdlYgl/PyKf4A==", + "version": "1.0.30001554", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001554.tgz", + "integrity": "sha512-A2E3U//MBwbJVzebddm1YfNp7Nud5Ip+IPn4BozBmn4KqVX7AvluoIDFWjsv5OkGnKUXQVmMSoMKLa3ScCblcQ==", "funding": [ { "type": "opencollective", @@ -2357,9 +2332,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.4.566", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.566.tgz", - "integrity": "sha512-mv+fAy27uOmTVlUULy15U3DVJ+jg+8iyKH1bpwboCRhtDC69GKf1PPTZvEIhCyDr81RFqfxZJYrbgp933a1vtg==", + "version": "1.4.567", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.567.tgz", + "integrity": "sha512-8KR114CAYQ4/r5EIEsOmOMqQ9j0MRbJZR3aXD/KFA8RuKzyoUB4XrUCg+l8RUGqTVQgKNIgTpjaG8YHRPAbX2w==", "dev": true }, "node_modules/elliptic": { @@ -5191,6 +5166,11 @@ "resolved": "https://registry.npmjs.org/@types/node/-/node-18.15.13.tgz", "integrity": "sha512-N+0kuo9KgrUQ1Sn/ifDXsvg0TTleP7rIy4zOBGECxAljqvqfqpTfzx0Q1NUedOixRMBfe2Whhb056a42cWs26Q==" }, + "node_modules/rlnjs/node_modules/aes-js": { + "version": "4.0.0-beta.5", + "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-4.0.0-beta.5.tgz", + "integrity": "sha512-G965FqalsNyrPqgEGON7nIx1e/OVENSgiEIzyC63haUMuvNnwIgIjMs52hlTCKhkBny7A2ORNlfY9Zu+jmGk1Q==" + }, "node_modules/rlnjs/node_modules/ethers": { "version": "6.8.0", "resolved": "https://registry.npmjs.org/ethers/-/ethers-6.8.0.tgz", @@ -5223,6 +5203,26 @@ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz", "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==" }, + "node_modules/rlnjs/node_modules/ws": { + "version": "8.5.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.5.0.tgz", + "integrity": "sha512-BWX0SWVgLPzYwF8lTzEy1egjhS4S4OEAHfsO8o65WOVsrnSRGaSiUaa9e0ggGlkMTtBlmOpEXiie9RUcBO86qg==", + "engines": { + "node": ">=10.0.0" + }, + "peerDependencies": { + "bufferutil": "^4.0.1", + "utf-8-validate": "^5.0.2" + }, + "peerDependenciesMeta": { + "bufferutil": { + "optional": true + }, + "utf-8-validate": { + "optional": true + } + } + }, "node_modules/run-parallel": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", @@ -5641,9 +5641,9 @@ } }, "node_modules/tailwindcss": { - "version": "3.3.4", - "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.4.tgz", - "integrity": "sha512-JXZNOkggUAc9T5E7nCrimoXHcSf9h3NWFe5sh36CGD/3M5TRLuQeFnQoDsit2uVTqgoOZHLx5rTykLUu16vsMQ==", + "version": "3.3.5", + "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.5.tgz", + "integrity": "sha512-5SEZU4J7pxZgSkv7FP1zY8i2TIAOooNZ1e/OGtxIEv6GltpoiXUqWvLy89+a10qYTB1N5Ifkuw9lqQkN9sscvA==", "dev": true, "dependencies": { "@alloc/quick-lru": "^5.2.0", @@ -5896,9 +5896,9 @@ "integrity": "sha512-hEQt0+ZLDVUMhebKxL4x1BTtDY7bavVofhZ9KZ4aI26X9SRaE+Y3m83XUL1UP2jn8ynjndwCCpEHdUG+9pP1Tw==" }, "node_modules/undici-types": { - "version": "5.25.3", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.25.3.tgz", - "integrity": "sha512-Ga1jfYwRn7+cP9v8auvEXN1rX3sWqlayd4HP7OKk4mZWylEmu3KzXDUGrQUN6Ol7qo1gPvB2e5gX6udnyEPgdA==" + "version": "5.26.5", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", + "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==" }, "node_modules/update-browserslist-db": { "version": "1.0.13", @@ -6105,11 +6105,11 @@ "dev": true }, "node_modules/ws": { - "version": "8.5.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.5.0.tgz", - "integrity": "sha512-BWX0SWVgLPzYwF8lTzEy1egjhS4S4OEAHfsO8o65WOVsrnSRGaSiUaa9e0ggGlkMTtBlmOpEXiie9RUcBO86qg==", + "version": "7.4.6", + "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz", + "integrity": "sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==", "engines": { - "node": ">=10.0.0" + "node": ">=8.3.0" }, "peerDependencies": { "bufferutil": "^4.0.1", @@ -6267,9 +6267,9 @@ } }, "@eslint-community/regexpp": { - "version": "4.9.1", - "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.9.1.tgz", - "integrity": "sha512-Y27x+MBLjXa+0JWDhykM3+JE+il3kHKAEqabfEWq3SDhZjLYb6/BHL/JKFnH3fe207JaXkyDo685Oc2Glt6ifA==", + "version": "4.10.0", + "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.0.tgz", + "integrity": "sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==", "dev": true }, "@eslint/eslintrc": { @@ -6462,13 +6462,6 @@ "@ethersproject/transactions": "^5.7.0", "aes-js": "3.0.0", "scrypt-js": "3.0.1" - }, - "dependencies": { - "aes-js": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-3.0.0.tgz", - "integrity": "sha512-H7wUZRn8WpTq9jocdxQ2c8x2sKo9ZVmzfRE13GiNJXfp7NcKYEdvl3vspKjXox6RIG2VtaRe4JFvxG4rqp2Zuw==" - } } }, "@ethersproject/keccak256": { @@ -6535,14 +6528,6 @@ "@ethersproject/web": "^5.7.0", "bech32": "1.1.4", "ws": "7.4.6" - }, - "dependencies": { - "ws": { - "version": "7.4.6", - "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz", - "integrity": "sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==", - "requires": {} - } } }, "@ethersproject/random": { @@ -6998,11 +6983,11 @@ "dev": true }, "@types/node": { - "version": "20.8.8", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.8.tgz", - "integrity": "sha512-YRsdVxq6OaLfmR9Hy816IMp33xOBjfyOgUd77ehqg96CFywxAPbDbXvAsuN2KVg2HOT8Eh6uAfU+l4WffwPVrQ==", + "version": "20.8.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.9.tgz", + "integrity": "sha512-UzykFsT3FhHb1h7yD4CA4YhBHq545JC0YnEz41xkipN88eKQtL6rSgocL5tbAP6Ola9Izm/Aw4Ora8He4x0BHg==", "requires": { - "undici-types": "~5.25.1" + "undici-types": "~5.26.4" } }, "@types/prop-types": { @@ -7012,9 +6997,9 @@ "devOptional": true }, "@types/react": { - "version": "18.2.31", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.31.tgz", - "integrity": "sha512-c2UnPv548q+5DFh03y8lEDeMfDwBn9G3dRwfkrxQMo/dOtRHUUO57k6pHvBIfH/VF4Nh+98mZ5aaSe+2echD5g==", + "version": "18.2.33", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.33.tgz", + "integrity": "sha512-v+I7S+hu3PIBoVkKGpSYYpiBT1ijqEzWpzQD62/jm4K74hPpSP7FF9BnKG6+fg2+62weJYkkBWDJlZt5JO/9hg==", "devOptional": true, "requires": { "@types/prop-types": "*", @@ -7151,9 +7136,9 @@ "requires": {} }, "aes-js": { - "version": "4.0.0-beta.5", - "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-4.0.0-beta.5.tgz", - "integrity": "sha512-G965FqalsNyrPqgEGON7nIx1e/OVENSgiEIzyC63haUMuvNnwIgIjMs52hlTCKhkBny7A2ORNlfY9Zu+jmGk1Q==" + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-3.0.0.tgz", + "integrity": "sha512-H7wUZRn8WpTq9jocdxQ2c8x2sKo9ZVmzfRE13GiNJXfp7NcKYEdvl3vspKjXox6RIG2VtaRe4JFvxG4rqp2Zuw==" }, "ajv": { "version": "6.12.6", @@ -7511,9 +7496,9 @@ "dev": true }, "caniuse-lite": { - "version": "1.0.30001553", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001553.tgz", - "integrity": "sha512-N0ttd6TrFfuqKNi+pMgWJTb9qrdJu4JSpgPFLe/lrD19ugC6fZgF0pUewRowDwzdDnb9V41mFcdlYgl/PyKf4A==" + "version": "1.0.30001554", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001554.tgz", + "integrity": "sha512-A2E3U//MBwbJVzebddm1YfNp7Nud5Ip+IPn4BozBmn4KqVX7AvluoIDFWjsv5OkGnKUXQVmMSoMKLa3ScCblcQ==" }, "chalk": { "version": "4.1.2", @@ -7740,9 +7725,9 @@ } }, "electron-to-chromium": { - "version": "1.4.566", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.566.tgz", - "integrity": "sha512-mv+fAy27uOmTVlUULy15U3DVJ+jg+8iyKH1bpwboCRhtDC69GKf1PPTZvEIhCyDr81RFqfxZJYrbgp933a1vtg==", + "version": "1.4.567", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.567.tgz", + "integrity": "sha512-8KR114CAYQ4/r5EIEsOmOMqQ9j0MRbJZR3aXD/KFA8RuKzyoUB4XrUCg+l8RUGqTVQgKNIgTpjaG8YHRPAbX2w==", "dev": true }, "elliptic": { @@ -9821,6 +9806,11 @@ "resolved": "https://registry.npmjs.org/@types/node/-/node-18.15.13.tgz", "integrity": "sha512-N+0kuo9KgrUQ1Sn/ifDXsvg0TTleP7rIy4zOBGECxAljqvqfqpTfzx0Q1NUedOixRMBfe2Whhb056a42cWs26Q==" }, + "aes-js": { + "version": "4.0.0-beta.5", + "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-4.0.0-beta.5.tgz", + "integrity": "sha512-G965FqalsNyrPqgEGON7nIx1e/OVENSgiEIzyC63haUMuvNnwIgIjMs52hlTCKhkBny7A2ORNlfY9Zu+jmGk1Q==" + }, "ethers": { "version": "6.8.0", "resolved": "https://registry.npmjs.org/ethers/-/ethers-6.8.0.tgz", @@ -9839,6 +9829,12 @@ "version": "2.4.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz", "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==" + }, + "ws": { + "version": "8.5.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.5.0.tgz", + "integrity": "sha512-BWX0SWVgLPzYwF8lTzEy1egjhS4S4OEAHfsO8o65WOVsrnSRGaSiUaa9e0ggGlkMTtBlmOpEXiie9RUcBO86qg==", + "requires": {} } } }, @@ -10142,9 +10138,9 @@ "dev": true }, "tailwindcss": { - "version": "3.3.4", - "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.4.tgz", - "integrity": "sha512-JXZNOkggUAc9T5E7nCrimoXHcSf9h3NWFe5sh36CGD/3M5TRLuQeFnQoDsit2uVTqgoOZHLx5rTykLUu16vsMQ==", + "version": "3.3.5", + "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.5.tgz", + "integrity": "sha512-5SEZU4J7pxZgSkv7FP1zY8i2TIAOooNZ1e/OGtxIEv6GltpoiXUqWvLy89+a10qYTB1N5Ifkuw9lqQkN9sscvA==", "dev": true, "requires": { "@alloc/quick-lru": "^5.2.0", @@ -10339,9 +10335,9 @@ "integrity": "sha512-hEQt0+ZLDVUMhebKxL4x1BTtDY7bavVofhZ9KZ4aI26X9SRaE+Y3m83XUL1UP2jn8ynjndwCCpEHdUG+9pP1Tw==" }, "undici-types": { - "version": "5.25.3", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.25.3.tgz", - "integrity": "sha512-Ga1jfYwRn7+cP9v8auvEXN1rX3sWqlayd4HP7OKk4mZWylEmu3KzXDUGrQUN6Ol7qo1gPvB2e5gX6udnyEPgdA==" + "version": "5.26.5", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", + "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==" }, "update-browserslist-db": { "version": "1.0.13", @@ -10489,9 +10485,9 @@ "dev": true }, "ws": { - "version": "8.5.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.5.0.tgz", - "integrity": "sha512-BWX0SWVgLPzYwF8lTzEy1egjhS4S4OEAHfsO8o65WOVsrnSRGaSiUaa9e0ggGlkMTtBlmOpEXiie9RUcBO86qg==", + "version": "7.4.6", + "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz", + "integrity": "sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==", "requires": {} }, "yallist": { diff --git a/examples/rln-js/package.json b/examples/rln-js/package.json index b0e0144..719341e 100644 --- a/examples/rln-js/package.json +++ b/examples/rln-js/package.json @@ -9,7 +9,7 @@ "lint": "next lint" }, "dependencies": { - "@waku/rln": "^0.1.1-fa49e29", + "@waku/rln": "0.1.1-fa49e29", "ethers": "^5.7.2", "next": "13.5.6", "protobufjs": "^7.2.5", diff --git a/examples/rln-js/src/app/home/page.tsx b/examples/rln-js/src/app/home/page.tsx index a9022c3..1d15f14 100644 --- a/examples/rln-js/src/app/home/page.tsx +++ b/examples/rln-js/src/app/home/page.tsx @@ -4,8 +4,12 @@ import { Waku } from "./components/Waku"; import { Keystore } from "./components/Keystore"; import { Blockchain } from "./components/Blockchain"; import { KeystoreDetails } from "./components/KeystoreDetails"; +import { useRLN } from "@/hooks"; export default function Home() { + const { rln } = useRLN(); + console.log(rln); + return (
diff --git a/examples/rln-js/src/hooks/index.ts b/examples/rln-js/src/hooks/index.ts index 16ef1a2..b80e2df 100644 --- a/examples/rln-js/src/hooks/index.ts +++ b/examples/rln-js/src/hooks/index.ts @@ -1 +1,2 @@ export { useStore } from "./useStore"; +export { useRLN } from "./useRLN"; diff --git a/examples/rln-js/src/hooks/useRLN.ts b/examples/rln-js/src/hooks/useRLN.ts new file mode 100644 index 0000000..b475694 --- /dev/null +++ b/examples/rln-js/src/hooks/useRLN.ts @@ -0,0 +1,45 @@ +import React from "react"; +import { RLN, RLNEventsNames } from "@/services/rln"; +import { useStore } from "./useStore"; + +type RLNResult = { + rln: undefined | RLN; +}; + +export const useRLN = (): RLNResult => { + const { setAppStatus } = useStore(); + const rlnRef = React.useRef(undefined); + + React.useEffect(() => { + if (rlnRef.current) { + return; + } + + let terminate = false; + const statusListener = (event: CustomEvent) => { + setAppStatus(event?.detail); + }; + + const rln = new RLN(); + + rln.addEventListener(RLNEventsNames.Status, statusListener); + + const run = async () => { + if (terminate) { + return; + } + await rln.init(); + rlnRef.current = rln; + }; + + run(); + return () => { + terminate = true; + rln.removeEventListener(RLNEventsNames.Status, statusListener); + }; + }, [rlnRef, setAppStatus]); + + return { + rln: rlnRef.current, + }; +}; diff --git a/examples/rln-js/src/services/rln.ts b/examples/rln-js/src/services/rln.ts index 9b96d4b..dac2304 100644 --- a/examples/rln-js/src/services/rln.ts +++ b/examples/rln-js/src/services/rln.ts @@ -10,7 +10,7 @@ import { } from "@waku/rln"; import { isBrowserProviderValid } from "@/utils/ethereum"; -enum RLNEventsNames { +export enum RLNEventsNames { Status = "status", } @@ -19,11 +19,15 @@ enum StatusEventPayload { WASM_FAILED = "Failed to download WASM, check console", CONTRACT_LOADING = "Connecting to RLN contract", CONTRACT_FAILED = "Failed to connect to RLN contract", + RLN_INITIALIZED = "RLN dependencies initialized", } -type EmitterProps = Pick & - Pick; -type IRLN = EmitterProps & {}; +type EventListener = (event: CustomEvent) => void; + +type IRLN = { + addEventListener: (name: RLNEventsNames, fn: EventListener) => void; + removeEventListener: (name: RLNEventsNames, fn: EventListener) => void; +}; export class RLN implements IRLN { private readonly emitter = new EventTarget(); @@ -74,23 +78,21 @@ export class RLN implements IRLN { this.emitStatusEvent(StatusEventPayload.CONTRACT_FAILED); throw error; } + + this.emitStatusEvent(StatusEventPayload.RLN_INITIALIZED); } - public addEventListener( - name: RLNEventsNames, - fn: EventListenerOrEventListenerObject - ) { - return this.emitter.addEventListener(name, fn); + public addEventListener(name: RLNEventsNames, fn: EventListener) { + return this.emitter.addEventListener(name, fn as any); } - public removeEventListener( - name: RLNEventsNames, - fn: EventListenerOrEventListenerObject - ) { - return this.emitter.removeEventListener(name, fn); + public removeEventListener(name: RLNEventsNames, fn: EventListener) { + return this.emitter.removeEventListener(name, fn as any); } private emitStatusEvent(payload: StatusEventPayload) { - this.emitter.dispatchEvent(new Event(payload)); + this.emitter.dispatchEvent( + new CustomEvent(RLNEventsNames.Status, { detail: payload }) + ); } }