feat: typo frontend explaantions + fix chain error

sismo-core · Jul 18, 2023 · 9e98abe · 9e98abe
1 parent db5df13
commit 9e98abe
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 15 deletions.
diff --git a/front/src/app/components/Header.tsx b/front/src/app/components/Header.tsx
@@ -11,27 +11,24 @@ const Header: React.FC = () => {
         <a href="https://builders.sismo.io"> Join the Telegram Builders Group </a>
       </h3>
       <p>
-        1. The frontend requests ZK Proofs via Sismo Connect Button <br />
-        2. The user generates ZK Proofs in their Data Vault and sends the Sismo Connect response to
+        1. A contract is deployed with a Sismo Connect Configuration and a Sismo Connect Request <br />
+        2. The frontend queries the Sismo Connect Configuration and Request from the contract <br />
+        3. The frontend requests ZK Proofs via Sismo Connect Button <br />
+        4. The user generates ZK Proofs in their Data Vault and sends the Sismo Connect response to
         the frontend <br />
-        3. The frontend forwards the response to ERC20 smart contract via claimWithSismo function{" "}
+        5. The frontend forwards the response to ERC20 smart contract via claimWithSismo function{" "}
         <br />
-        4. The smart contract verifies the proofs contained in the response, mints ERC20 tokens and stores
+        6. The smart contract verifies the proofs contained in the response, mints ERC20 tokens and stores
         verified claims and auths <br />
-        5. The frontend reads the verified claims and auths from the contract and displays them
+        7. The frontend reads the verified claims and auths from the contract and displays them
       </p>
       <div>
         <p>
-          <b className="code-snippet">src/front/app/sismo-connect-config.ts</b>: Sismo Connect
-          configuration and requests
+          <b className="code-snippet">src/front/app/page.tsx</b>: Frontend - Queries contract to know Sismo Connect Configuration and Request, requests ZK Proofs from users via Sismo Connect Button
         </p>
         <p>
-          <b className="code-snippet">src/front/app/page.tsx</b>: Frontend - make Sismo Connect
-          request
-        </p>
-        <p>
-          <b className="code-snippet">src/Airdrop.sol</b>: Contract - verify Sismo Connect request,
-          mint tokens and stores verified claims and auths
+          <b className="code-snippet">src/Airdrop.sol</b>: Contract - Sets up the Sismo Connect Configuration and Request, verifies Sismo Connect response,
+          mints tokens and stores verified claims, auths and signed message
         </p>
         <p className="callout">
           {" "}

diff --git a/front/src/app/page.tsx b/front/src/app/page.tsx
@@ -102,6 +102,10 @@ export default function Home() {
   // Set react state accordingly to display the Sismo Connect Button
   useEffect(() => {
     if (!isConnected) return;
+    if (chain?.id !== CHAIN.id) {
+      setSismoConnectRequest(null);
+      return;
+    }
     async function getRequests() {
       const appId = (await airdropContract.read.APP_ID()) as string;
       const isImpersonationMode = (await airdropContract.read.IS_IMPERSONATION_MODE()) as boolean;
@@ -123,12 +127,12 @@ export default function Home() {
       });
     }
     getRequests();
-  }, [pageState]);
+  }, [pageState, chain]);
 
   useEffect(() => {
+    setClaimError(error);
     if (!responseBytes) return;
     setPageState("responseReceived");
-    setClaimError(error);
   }, [responseBytes, error, claimError]);
 
   /* *************************  Reset state **************************** */