Merge pull request #17 from SnickerdoodleLabs/feat/add-onChainData-popup

Feat/add on chain data popup
SnickerdoodleLabs · Jun 7, 2022 · d2f4e07 · d2f4e07
2 parents b53f175 + 074ef2a
commit d2f4e07
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 4 deletions.
diff --git a/packages/browserExtension/src/pages/Content/components/App/App.tsx b/packages/browserExtension/src/pages/Content/components/App/App.tsx
@@ -76,8 +76,27 @@ const App = () => {
     console.log("accounts received: ", accounts);
     console.log("signature received: ", signature);
     console.log("chainId received: ", chainId);
-    chrome.storage.sync.set({ accountAddress: accounts }, function () {
-      console.log("Value is set to" + accounts);
+    chrome.storage.sync.set(
+      {
+        onChainData: {
+          accountAddress: accounts[0],
+          signatureValue: signature,
+          chainId: chainId,
+          timestamp: new Date(),
+        },
+      },
+      function () {
+        console.log("Value is set to" + accounts);
+      },
+    );
+    chrome.runtime.sendMessage({
+      message: "cardData",
+      onChainData: {
+        accountAddress: accounts[0],
+        signatureValue: signature,
+        chainId: chainId,
+        timestamp: new Date(),
+      },
     });
     setAppState(EAPP_STATE.CONNECT_WALLET_SUCCESS);
   };

diff --git a/packages/browserExtension/src/pages/Popup/Popup.jsx b/packages/browserExtension/src/pages/Popup/Popup.jsx
@@ -11,7 +11,17 @@ import Data from "./components/Data";
 
 const Popup = () => {
   const [obj, setObj] = useState(null);
+  const [onChainData, setOnChainData] = useState(null);
   const [loadCard, setLoadCard] = useState(true);
+  const hostname = window.location.hostname;
+  useEffect(() => {
+    chrome.runtime.sendMessage({ message: "onChainDataRequest", hostname: "onChainData"});
+    chrome.storage.sync.get(["onChainData"], ((result) => {
+      if (result.onChainData) {
+        setOnChainData(result.onChainData)
+      }
+    }));
+  }, []);
 
   chrome.runtime.sendMessage({ message: "dataRequest", obj: obj });
 
@@ -173,12 +183,19 @@ const Popup = () => {
             <Data
               dataType="Text"
               title="WALLET ACCOUNT"
-              data="0x5274f8D7....296f7f6B2469"
+              data={`${onChainData?.accountAddress.slice(0, 8)}...
+              ${onChainData?.accountAddress.slice(-8)}`}
             />
             <Data
               dataType="Text"
               title="SIGNATURE"
-              data="0x2454f8G4....126f5f6B5439"
+              data={`${onChainData?.signatureValue.slice(0, 8)}...
+              ${onChainData?.signatureValue.slice(-8)}`}
+            />
+            <Data
+              dataType="Text"
+              title="CHAIN ID"
+              data={onChainData?.chainId}
             />
           </Grid>
         </Grid>