chore: code refactor

BakaOtaku · Oct 31, 2023 · 5352bd4 · 5352bd4
1 parent 1af2239
commit 5352bd4
Show file tree

Hide file tree

Showing 31 changed files with 4,975 additions and 115 deletions.
diff --git a/client/index.html b/client/index.html
@@ -29,6 +29,8 @@
   </script>
   <script type="module">
     import { Buffer } from "buffer";
+    import process from "process";
+    window.process = process;
     window.Buffer = Buffer;
   </script>
 </head>
@@ -70,4 +72,4 @@
   }
 </style>
 
-</html>
+</html>
diff --git a/client/package.json b/client/package.json
@@ -10,25 +10,39 @@
   },
   "dependencies": {
     "@cosmjs/cosmwasm-stargate": "^0.30.1",
+    "@cosmjs/launchpad": "^0.27.1",
     "@cosmjs/stargate": "^0.30.1",
     "@emotion/react": "11.10.6",
     "@emotion/styled": "11.10.6",
     "@mui/icons-material": "5.11.11",
     "@mui/lab": "^5.0.0-alpha.123",
     "@mui/material": "5.11.12",
     "@mui/styles": "5.11.12",
+    "@passwordless-id/webauthn": "^1.3.0",
+    "@peculiar/asn1-ecc": "^2.3.8",
+    "@peculiar/asn1-schema": "^2.3.8",
+    "@simplewebauthn/browser": "^8.3.4",
     "@types/node": "^20.5.7",
+    "@walletconnect/sign-client": "^2.10.4",
+    "@web3auth/base": "^7.0.4",
+    "@web3auth/modal": "^7.0.5",
+    "@web3auth/no-modal": "^7.0.4",
+    "@web3auth/openlogin-adapter": "^7.0.4",
+    "base64url": "^3.0.1",
     "buffer": "^6.0.3",
     "chain-registry": "^1.13.0",
     "crypto-browserify": "^3.12.0",
+    "elliptic": "^6.5.4",
+    "ethers": "5.7.2",
     "osmojs": "^15.2.1",
     "process": "^0.11.10",
     "react": "18.2.0",
     "react-blockies": "^1.4.1",
     "react-dom": "18.2.0",
     "react-router-dom": "^5.3.4",
     "react-toastify": "^9.1.2",
-    "stream-browserify": "^3.0.0"
+    "stream-browserify": "^3.0.0",
+    "uuid": "^9.0.1"
   },
   "browser": {
     "crypto": false

diff --git a/client/public/img/demo.png b/client/public/img/demo.png
diff --git a/client/src/App.tsx b/client/src/App.tsx
@@ -2,17 +2,21 @@ import React from "react";
 import { Switch, Route, BrowserRouter } from "react-router-dom";
 
 import Home from "@/pages/Home";
+// import Deploy from "@/pages/Deploy";
 import Intent from "@/pages/Intent";
 import Passkeys from "@/pages/Passkeys";
+import Recovery from "@/pages/Recovery";
 
 const App = () => {
   return (
     <React.Fragment>
       <BrowserRouter>
         <Switch>
           <Route exact path="/" component={Home} />
+          {/* <Route exact path="/deploy" component={Deploy} /> */}
+          <Route exact path="/account" component={Passkeys} />
           <Route exact path="/intent" component={Intent} />
-          {/* <Route exact path="/passkeys" component={Passkeys} /> */}
+          <Route exact path="/recover" component={Recovery} />
         </Switch>
       </BrowserRouter>
     </React.Fragment>

diff --git a/client/src/components/Connect.tsx b/client/src/components/Connect.tsx
@@ -1,40 +1,57 @@
 import { useState } from "react";
 // @ts-ignore
 import Blockies from "react-blockies";
-
 import { makeStyles } from "@mui/styles";
 import { useSigningClient } from "@/context/cosmwasm";
+import { useWeb3Context } from "@/context/Web3Auth";
+import ChoiceModal from "./UI/ChoiceModal";
 
 const truncateAddress = (address: string) => {
   return address.slice(0, 6) + "..." + address.slice(-4);
 };
 
 const ConnectWallet = () => {
   const classes = useStyles();
-  const { walletAddress, connectWallet, disconnect } = useSigningClient();
+  const [addr, setAddr] = useState("");
+  const { disconnect: dissconnectWallet } = useSigningClient();
+  const { disconnect } = useWeb3Context();
   const [showLogout, setShowLogout] = useState(false);
+  const [choice, setChoice] = useState(false);
 
   const toggleLogoutButton = () => {
+    navigator.clipboard.writeText(addr);
     showLogout ? setShowLogout(false) : setShowLogout(true);
   };
 
+  const connectChoice = () => {
+    setChoice(true);
+  };
+
   const disconnectWallet = () => {
     disconnect();
+    // dissconnectWallet();
+    setAddr("");
     setShowLogout(false);
   };
 
   return (
     <div className={classes.walletBtnContainer}>
+      <ChoiceModal
+        triggerModal={choice}
+        setTriggerModal={setChoice}
+        addr={addr}
+        setAddr={setAddr}
+      />
       <button
         className={classes.walletBtn}
-        onClick={walletAddress ? toggleLogoutButton : connectWallet}
+        onClick={addr ? toggleLogoutButton : connectChoice}
       >
         <Blockies
-          className={`${classes.img} ${walletAddress ? "green" : "red"}`}
-          seed={walletAddress ? walletAddress : ""}
+          className={`${classes.img} ${addr ? "green" : "red"}`}
+          seed={addr ? addr : ""}
         />
         <div style={{ fontFamily: "Roboto", fontWeight: 700 }}>
-          {walletAddress ? truncateAddress(walletAddress) : "Connect Wallet"}
+          {addr ? truncateAddress(addr) : "Connect Wallet"}
         </div>
       </button>
       {showLogout && (

diff --git a/client/src/components/Footer.tsx b/client/src/components/Footer.tsx
@@ -1,4 +1,4 @@
-import { GitHub, Twitter } from "@mui/icons-material";
+import { GitHub, Twitter, Article } from "@mui/icons-material";
 import { makeStyles } from "@mui/styles";
 
 const Footer = ({ color }: any) => {
@@ -16,13 +16,13 @@ const Footer = ({ color }: any) => {
           display: "flex",
           justifyContent: "space-between",
           padding: "0px 20px",
-          maxWidth: 1280,
+          maxWidth: 1080,
           margin: "auto",
         }}
       >
         <div
           style={{
-            margin: "auto",
+            // margin: "auto",
             display: "flex",
             flexDirection: "column",
             alignItems: "center",
@@ -31,26 +31,38 @@ const Footer = ({ color }: any) => {
           <img src="/img/logo-white.png" alt="logo" className={classes.logo} />
           <p className={classes.text}>Wise Wallet</p>
         </div>
-        {/* <div className={classes.smIconsContainer}>
+        <div className={classes.smIconsContainer}>
+          <a
+            href="https://arpitsrivastava2012.gitbook.io/wisewallet"
+            target="_blank"
+            rel="noreferrer"
+            style={{ margin: "auto" }}
+          >
+            <div className={classes.smIcon}>
+              <Article style={{ fontSize: "20px" }} />
+            </div>
+          </a>
           <a
             href="https://twitter.com/"
             target="_blank"
             rel="noreferrer"
+            style={{ margin: "auto" }}
           >
             <div className={classes.smIcon}>
-              <Twitter style={{ fontSize: "26px" }} />
+              <Twitter style={{ fontSize: "20px" }} />
             </div>
           </a>
           <a
             href="https://github.com/"
             target="_blank"
             rel="noreferrer"
+            style={{ margin: "auto" }}
           >
             <div className={classes.smIcon}>
-              <GitHub style={{ fontSize: "26px" }} />
+              <GitHub style={{ fontSize: "20px" }} />
             </div>
           </a>
-        </div> */}
+        </div>
       </div>
     </footer>
   );
@@ -62,6 +74,7 @@ const useStyles = makeStyles((theme) => ({
     position: "relative",
     borderTop: "2px solid #9DB2BF",
     display: "block",
+    margin: "auto",
     padding: "25px 0 50px 0",
   },
   logo: {
@@ -78,8 +91,8 @@ const useStyles = makeStyles((theme) => ({
     // marginTop: "20px",
   },
   smIcon: {
-    width: "40px",
-    height: "40px",
+    width: "35px",
+    height: "35px",
     borderRadius: "6px",
     backgroundColor: "#576CBC",
     display: "flex",
@@ -111,7 +124,7 @@ const useStyles = makeStyles((theme) => ({
   },
   smIconsContainer: {
     display: "flex",
-    height: "100%",
+    height: "auto",
     alignItems: "flex-end",
     justifyContent: "flex-end",
     "@media (max-width:599px)": {

diff --git a/client/src/components/Home/Hero.tsx b/client/src/components/Home/Hero.tsx
@@ -1,4 +1,3 @@
-import { Container, Grid } from "@mui/material";
 import { makeStyles } from "@mui/styles";
 import { Link } from "react-router-dom";
 
@@ -32,7 +31,7 @@ const Main = () => {
         <div className={classes.trade}>
           <div className={classes.tradeCont}>
             <div className={classes.btnCont}>
-              <Link to="/intent" className={classes.btn}>
+              <Link to="/account" className={classes.btn}>
                 Live Demo
               </Link>
             </div>

diff --git a/client/src/components/Home/Team.tsx b/client/src/components/Home/Team.tsx
@@ -1,5 +1,4 @@
-// import { GitHub } from "@mui/icons-material";
-import { Container, Typography, Grid } from "@mui/material";
+import { Container, Grid } from "@mui/material";
 import { makeStyles } from "@mui/styles";
 
 const Team = () => {
@@ -12,8 +11,9 @@ const Team = () => {
           <Grid item xs={12} sm={6}>
             <h1 className={classes.title}>Team</h1>
             <div className={classes.text}>
-              We are a team of 3 engineers working togerther on blockchain since
-              college.
+              We are a team of three engineers working togerther for past 3
+              years. With a collective background on different technologies, our
+              journey has guided us through numerous successful projects.
             </div>
           </Grid>
 
@@ -98,7 +98,7 @@ const useStyles = makeStyles(() => ({
     color: "rgb(25, 56, 51)",
   },
   text: {
-    fontSize: 20,
+    fontSize: 17,
     fontWeight: "400",
     color: "rgba(25, 56, 51, 0.8)",
     fontFamily: "Inter",

diff --git a/client/src/components/Intent.tsx b/client/src/components/Intent.tsx
@@ -7,9 +7,9 @@ import { showErrorMessage } from "@/util";
 import { useSigningClient } from "@/context/cosmwasm";
 
 const contractAddr =
-  "comdex1dr9ztzlwpeqmq5h9c4fapdzftgk5x44nx63t0fhn9fv3v9kjcw3qclf2qk";
+  "neutron1dr9ztzlwpeqmq5h9c4fapdzftgk5x44nx63t0fhn9fv3v9kjcw3qclf2qk";
 const swapAddr =
-  "comdex1tnfwzm9xucghaxg9fsuwkk8skhwmkx5njr3ndyahtrvtu4e824sqlaryf3";
+  "neutron1tnfwzm9xucghaxg9fsuwkk8skhwmkx5njr3ndyahtrvtu4e824sqlaryf3";
 
 const Intent: React.FC = () => {
   const classes = useStyles();
@@ -107,7 +107,7 @@ const Intent: React.FC = () => {
         ),
         funds: [
           {
-            denom: "ucmdx",
+            denom: "untrn",
             amount: "0",
           },
         ],
@@ -122,7 +122,7 @@ const Intent: React.FC = () => {
           amount: [
             {
               amount: "0",
-              denom: "ucmdx",
+              denom: "untrn",
             },
           ],
         },
@@ -154,7 +154,7 @@ const Intent: React.FC = () => {
       });
 
       // promies await to wait for the tx to be mined
-      await new Promise((r) => setTimeout(r, 15000));
+      await new Promise((r) => setTimeout(r, 6000));
 
       const res = await fetch("http://localhost:3000/txHash");
       const resJson = await res.json();

diff --git a/client/src/components/Navbar.tsx b/client/src/components/Navbar.tsx
@@ -22,7 +22,7 @@ const Navbar = () => {
     <AppBar position="static" classes={{ root: classes.nav }}>
       <Container className={classes.container}>
         <div className={classes.flexContainer}>
-        <NavLink style={{ display: "flex", alignItems: "center" }} to="/">
+          <NavLink style={{ display: "flex", alignItems: "center" }} to="/">
             <img
               src="/img/logo-white.png"
               alt="logo"
@@ -36,19 +36,32 @@ const Navbar = () => {
               className={classes.menuItemContainer}
               ref={menuItemContainerRef}
             >
+              <NavLink
+                to="/account"
+                className={(isActive) => `menuItem ${isActive ? "active" : ""}`}
+              >
+                Account
+              </NavLink>
+              {/* <NavLink
+                to="/deploy"
+                className={(isActive) => `menuItem ${isActive ? "active" : ""}`}
+              >
+                Home
+              </NavLink> */}
+
               <NavLink
                 to="/intent"
                 className={(isActive) => `menuItem ${isActive ? "active" : ""}`}
               >
                 Intents
               </NavLink>
 
-              {/* <NavLink
-                to="/passkeys"
+              <NavLink
+                to="/recover"
                 className={(isActive) => `menuItem ${isActive ? "active" : ""}`}
               >
-                Passkeys
-              </NavLink> */}
+                Social Recovery
+              </NavLink>
 
               <a
                 href="https://arpitsrivastava2012.gitbook.io/wisewallet"