Add button to watch rep token in metamask

client/src/App.jsx

@@ -211,6 +211,10 @@ function App() {
     setWork1(work1Contract);
     setDAO(DAOContract);
 
+    /* -------------------------------------------------------------------------------- */
+    /* --------------------------- BEGIN EVENT HANDLERS ------------------------------- */
+    /* -------------------------------------------------------------------------------- */
+
     DAOContract.events.PostAdded({ fromBlock: 'latest' }).on('data', (event) => {
       console.log('event: post added', event);
       fetchPost(event.returnValues.postIndex);
@@ -281,17 +285,17 @@ function App() {
     }
   }, [sdk]);
 
-  // const watchReputationToken = useCallback(async () => {
-  //   await provider.request({
-  //     method: 'wallet_watchAsset',
-  //     params: {
-  //       type: 'ERC20',
-  //       options: {
-  //         address: DAOAddress,
-  //       },
-  //     },
-  //   });
-  // }, [provider]);
+  const watchReputationToken = useCallback(async () => {
+    await provider.request({
+      method: 'wallet_watchAsset',
+      params: {
+        type: 'ERC20',
+        options: {
+          address: contracts[chainId].DAO,
+        },
+      },
+    });
+  }, [provider, chainId]);
 
   const addPost = useCallback(async () => {
     await DAO.methods.addPost(account).send({
@@ -432,6 +436,7 @@ function App() {
                   </div>
                   <div>
                     <Button onClick={() => disconnect()}>Disconnect</Button>
+                    <Button onClick={() => watchReputationToken()}>Watch REP in MetaMask</Button>
                   </div>
                 </Stack>
               </Col>
@@ -439,7 +444,6 @@ function App() {
           </Container>
           <Tabs>
             <Tab eventKey="admin" title="Admin">
-
               <div>
                 {`Posts count: ${posts.length}`}
               </div>