Akhil's Connect Wallet Button & "Provider" Data Extraction

frontend/package.json

@@ -12,6 +12,8 @@
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.6",
     "@mui/material": "^5.11.16",
+    "@types/source-map": "^0.5.2",
+    "ethers": "^6.3.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.10.0"
@@ -23,4 +25,4 @@
     "typescript": "^4.9.3",
     "vite": "^4.2.0"
   }
-}
+}

frontend/src/components/ConnectWallet.tsx

@@ -0,0 +1,66 @@
+import Button from '@mui/material/Button';
+import Box from '@mui/material/Box';
+
+import { useState } from 'react';
+import { ethers } from 'ethers';
+
+export default function ConnectButton() {
+    const [walletAddress, setWalletAddress] = useState("This");
+
+    return (
+        <Button
+            variant="contained" 
+            color="secondary"
+            size="small"
+
+            onClick={() => {
+                requestAccount();
+            }}
+        >          
+            Connect To Wallet  
+
+        </Button>
+
+        /*
+            My Wallet Address: {walletAddress}
+
+            Use Wallet Address For Send and Recieve Purposes
+            Need help with connecting to contract
+        */
+
+      );
+
+      async function ConnectedContract() {
+
+      }
+
+
+    //   0x74eD261E8ec5cf49170748F8D1B0b91c39665b53
+
+      async function requestAccount() {
+
+        if(window.ethereum) {
+          try {
+
+
+
+            const provider = new ethers.BrowserProvider(window.ethereum);
+
+            // Prompt user for account connections
+            await provider.send("eth_requestAccounts", []);
+            const signer = provider.getSigner();
+            console.log("Account:", (await signer).getAddress());
+
+            // console.log(provider.getSigner());
+
+
+        } catch (error) {
+            console.log('Error Connecting...')
+          }
+
+        } else {
+          console.log('Not there')
+        }
+      } 
+
+  }

frontend/src/components/Navbar.tsx

@@ -4,6 +4,8 @@ import * as data from './links.json';
 const linksString = JSON.stringify(data);
 const links = JSON.parse(linksString).links;
 
+import ConnectButton from './ConnectWallet';
+
 type Link = {
     label: string;
     href: string;
@@ -21,6 +23,8 @@ const Links: React.FC<{ links: Link[] }> = ({ links }) => {
                     </div>
                 )
             })}
+
+            <ConnectButton/>
         </div>
     )
 };

frontend/src/components/links.json

@@ -11,10 +11,6 @@
         {
             "label": "Account",
             "href": "/account"
-        },
-        {
-            "label": "Connect Wallet",
-            "href": "/connectwallet"
         }
 
     ]

frontend/src/react-app-env.d.ts

@@ -0,0 +1,3 @@
+interface Window {
+    ethereum: any
+}

frontend/src/routes/root.tsx

@@ -4,6 +4,7 @@ import  { Lend }  from "./lend";
 import { MainCard } from "../components/MainCard";
 import Navbar from "../components/Navbar";
 import { Outlet } from "react-router-dom";
+import ConnectButton from "../components/ConnectWallet";
 
 
 interface rootProps {}

frontend/vite.config.ts.timestamp-1682558962830.mjs

@@ -0,0 +1,10 @@
+// vite.config.ts
+import { defineConfig } from "file:///mnt/c/Users/gogin/Desktop/IB/LendingHand/frontend/node_modules/vite/dist/node/index.js";
+import react from "file:///mnt/c/Users/gogin/Desktop/IB/LendingHand/frontend/node_modules/@vitejs/plugin-react/dist/index.mjs";
+var vite_config_default = defineConfig({
+  plugins: [react()]
+});
+export {
+  vite_config_default as default
+};
+//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvbW50L2MvVXNlcnMvZ29naW4vRGVza3RvcC9JQi9MZW5kaW5nSGFuZC9mcm9udGVuZFwiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9maWxlbmFtZSA9IFwiL21udC9jL1VzZXJzL2dvZ2luL0Rlc2t0b3AvSUIvTGVuZGluZ0hhbmQvZnJvbnRlbmQvdml0ZS5jb25maWcudHNcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfaW1wb3J0X21ldGFfdXJsID0gXCJmaWxlOi8vL21udC9jL1VzZXJzL2dvZ2luL0Rlc2t0b3AvSUIvTGVuZGluZ0hhbmQvZnJvbnRlbmQvdml0ZS5jb25maWcudHNcIjtpbXBvcnQgeyBkZWZpbmVDb25maWcgfSBmcm9tICd2aXRlJ1xuaW1wb3J0IHJlYWN0IGZyb20gJ0B2aXRlanMvcGx1Z2luLXJlYWN0J1xuXG4vLyBodHRwczovL3ZpdGVqcy5kZXYvY29uZmlnL1xuZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29uZmlnKHtcbiAgcGx1Z2luczogW3JlYWN0KCldLFxufSlcbiJdLAogICJtYXBwaW5ncyI6ICI7QUFBd1UsU0FBUyxvQkFBb0I7QUFDclcsT0FBTyxXQUFXO0FBR2xCLElBQU8sc0JBQVEsYUFBYTtBQUFBLEVBQzFCLFNBQVMsQ0FBQyxNQUFNLENBQUM7QUFDbkIsQ0FBQzsiLAogICJuYW1lcyI6IFtdCn0K

frontend/vite.config.ts.timestamp-1682558975172.mjs

@@ -0,0 +1,10 @@
+// vite.config.ts
+import { defineConfig } from "file:///mnt/c/Users/gogin/Desktop/IB/LendingHand/frontend/node_modules/vite/dist/node/index.js";
+import react from "file:///mnt/c/Users/gogin/Desktop/IB/LendingHand/frontend/node_modules/@vitejs/plugin-react/dist/index.mjs";
+var vite_config_default = defineConfig({
+  plugins: [react()]
+});
+export {
+  vite_config_default as default
+};
+//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvbW50L2MvVXNlcnMvZ29naW4vRGVza3RvcC9JQi9MZW5kaW5nSGFuZC9mcm9udGVuZFwiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9maWxlbmFtZSA9IFwiL21udC9jL1VzZXJzL2dvZ2luL0Rlc2t0b3AvSUIvTGVuZGluZ0hhbmQvZnJvbnRlbmQvdml0ZS5jb25maWcudHNcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfaW1wb3J0X21ldGFfdXJsID0gXCJmaWxlOi8vL21udC9jL1VzZXJzL2dvZ2luL0Rlc2t0b3AvSUIvTGVuZGluZ0hhbmQvZnJvbnRlbmQvdml0ZS5jb25maWcudHNcIjtpbXBvcnQgeyBkZWZpbmVDb25maWcgfSBmcm9tICd2aXRlJ1xuaW1wb3J0IHJlYWN0IGZyb20gJ0B2aXRlanMvcGx1Z2luLXJlYWN0J1xuXG4vLyBodHRwczovL3ZpdGVqcy5kZXYvY29uZmlnL1xuZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29uZmlnKHtcbiAgcGx1Z2luczogW3JlYWN0KCldLFxufSlcbiJdLAogICJtYXBwaW5ncyI6ICI7QUFBd1UsU0FBUyxvQkFBb0I7QUFDclcsT0FBTyxXQUFXO0FBR2xCLElBQU8sc0JBQVEsYUFBYTtBQUFBLEVBQzFCLFNBQVMsQ0FBQyxNQUFNLENBQUM7QUFDbkIsQ0FBQzsiLAogICJuYW1lcyI6IFtdCn0K

frontend/vite.config.ts.timestamp-1682563718549.mjs

@@ -0,0 +1,10 @@
+// vite.config.ts
+import { defineConfig } from "file:///mnt/c/Users/gogin/Desktop/IB/LendingHand/frontend/node_modules/vite/dist/node/index.js";
+import react from "file:///mnt/c/Users/gogin/Desktop/IB/LendingHand/frontend/node_modules/@vitejs/plugin-react/dist/index.mjs";
+var vite_config_default = defineConfig({
+  plugins: [react()]
+});
+export {
+  vite_config_default as default
+};
+//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvbW50L2MvVXNlcnMvZ29naW4vRGVza3RvcC9JQi9MZW5kaW5nSGFuZC9mcm9udGVuZFwiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9maWxlbmFtZSA9IFwiL21udC9jL1VzZXJzL2dvZ2luL0Rlc2t0b3AvSUIvTGVuZGluZ0hhbmQvZnJvbnRlbmQvdml0ZS5jb25maWcudHNcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfaW1wb3J0X21ldGFfdXJsID0gXCJmaWxlOi8vL21udC9jL1VzZXJzL2dvZ2luL0Rlc2t0b3AvSUIvTGVuZGluZ0hhbmQvZnJvbnRlbmQvdml0ZS5jb25maWcudHNcIjtpbXBvcnQgeyBkZWZpbmVDb25maWcgfSBmcm9tICd2aXRlJ1xuaW1wb3J0IHJlYWN0IGZyb20gJ0B2aXRlanMvcGx1Z2luLXJlYWN0J1xuXG4vLyBodHRwczovL3ZpdGVqcy5kZXYvY29uZmlnL1xuZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29uZmlnKHtcbiAgcGx1Z2luczogW3JlYWN0KCldLFxufSlcbiJdLAogICJtYXBwaW5ncyI6ICI7QUFBd1UsU0FBUyxvQkFBb0I7QUFDclcsT0FBTyxXQUFXO0FBR2xCLElBQU8sc0JBQVEsYUFBYTtBQUFBLEVBQzFCLFNBQVMsQ0FBQyxNQUFNLENBQUM7QUFDbkIsQ0FBQzsiLAogICJuYW1lcyI6IFtdCn0K