joelamouche · Tris92 · Jun 3, 2022 · Jun 7, 2022 · Jun 13, 2022 · Jun 13, 2022
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,5 @@
 node_modules
 .DS_Store
 build
+.env
+/build
diff --git a/README.md b/README.md
@@ -1,11 +1,19 @@
 # web3-react-template
 
 Template to make a DApp with React, typescript and ethers.js.
+
 - Button to Connect to MetaMask
 - Display Account
 - Display Network
 - Display Dai Balance
 
 Made using the create-react-app typescript template, MetaMask recommandation to connect, ethers.js library and types generated by Typechain in a separate repo.
 
-To launch, run `npm run start`
+To launch, run `npm run start`
+
+## TODO
+
+- handle errors
+- only allow buy if allowance
+- sell
+- check non -zero
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,20 +2,32 @@
   "name": "web3-react-template",
   "version": "0.1.0",
   "private": true,
+  "homepage": "https://dowgo.io",
   "dependencies": {
-    "@metamask/detect-provider": "^1.2.0",
-    "@metamask/providers": "^8.1.1",
+    "@metamask/detect-provider": "^2.0.0",
+    "@metamask/providers": "^10.2.1",
+    "@reduxjs/toolkit": "^1.9.7",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.3.0",
     "@testing-library/user-event": "^13.5.0",
     "@types/jest": "^27.5.2",
     "@types/node": "^16.11.38",
-    "@types/react": "^18.0.10",
     "@types/react-dom": "^18.0.5",
+    "antd": "^4.24.8",
+    "axios": "^1.2.1",
     "ethers": "^5.6.8",
-    "react": "^18.1.0",
+    "jquery": "^3.6.1",
+    "jsonp": "^0.2.1",
+    "react": "^18.2.0",
     "react-dom": "^18.1.0",
+    "react-jazzicon": "^1.0.4",
+    "react-redux": "^8.1.3",
+    "react-responsive": "^9.0.2",
+    "react-router-dom": "^6.4.3",
     "react-scripts": "5.0.1",
+    "redux": "^4.2.1",
+    "reselect": "^4.1.8",
+    "sass": "^1.56.0",
     "typescript": "^4.7.2",
     "web-vitals": "^2.1.4"
   },
@@ -24,7 +36,9 @@
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject",
-    "lint": "npx prettier -w ."
+    "lint": "npx prettier -w src && npx prettier -w public",
+    "predeploy": "npm run build",
+    "deploy": "echo 'dowgo.io' > ./build/CNAME && gh-pages -d build"
   },
   "eslintConfig": {
     "extends": [
@@ -52,5 +66,10 @@
   "license": "ISC",
   "bugs": {
     "url": "https://github.com/joelamouche/web3-react-template/issues"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.8",
+    "gh-pages": "^4.0.0"
   }
 }
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -9,7 +9,17 @@
       name="description"
       content="Web site created using create-react-app"
     />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700;800&display=swap"
+      rel="stylesheet"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
@@ -24,7 +34,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
+    <title>dowgo interface</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/public/logo.png b/public/logo.png
diff --git a/public/logo192.png b/public/logo192.png
diff --git a/public/logo512.png b/public/logo512.png
diff --git a/public/manifest.json b/public/manifest.json
@@ -8,12 +8,12 @@
       "type": "image/x-icon"
     },
     {
-      "src": "logo192.png",
+      "src": "logo.png",
       "type": "image/png",
       "sizes": "192x192"
     },
     {
-      "src": "logo512.png",
+      "src": "logo.png",
       "type": "image/png",
       "sizes": "512x512"
     }

diff --git a/src/App.css b/src/App.css
diff --git a/src/App.scss b/src/App.scss
@@ -0,0 +1,68 @@
+.app-container {
+  text-align: center;
+}
+
+.app-header {
+  position: fixed;
+  z-index: 999;
+  width: 100%;
+  padding: 0;
+  height: 100px;
+  /* margin-bottom: 200px; */
+}
+
+.menu {
+  /* Your default menu styles go here */
+  background-color: transparent;
+  transition: background-color 0.2s ease;
+
+  &.scrolled {
+    /* Styles applied when scrollY > 100px */
+    background-color: rgba(0, 0, 0, 0.7) !important;
+    backdrop-filter: blur(5px);
+  }
+}
+
+.dowgo-logo-container {
+  top: 0;
+  position: absolute;
+  z-index: 1000;
+  margin-left: 20px;
+  margin-top: 20px;
+  @media (max-width: 480px) {
+    margin-left: 20px;
+  }
+}
+
+.dowgo-logo-menu {
+  height: 40px;
+  width: auto;
+  @media (max-width: 480px) {
+    height: 60px;
+  }
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+.ant-layout {
+  background: black !important;
+}
+
+.ant-layout-footer {
+  background: black !important;
+}
+
+.ant-layout-content {
+  min-height: 100vh;
+}
+
+/* Notifications */
+.ant-notification-notice-message {
+  background-color: #191922 !important;
+  color: #969696 !important;
+}
+.ant-notification-notice-close-x {
+  color: #969696;
+}
diff --git a/src/App.test.tsx b/src/App.test.tsx
@@ -1,9 +1,15 @@
 import React from "react";
 import { render, screen } from "@testing-library/react";
 import App from "./App";
+import ReactDOM from "react-dom";
 
 test("renders learn react link", () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
+  // render(<App />);
+  // const linkElement = screen.getByText(/learn react/i);
+  // expect(linkElement).toBeInTheDocument();
+
+  // renders without crashing
+  const div = document.createElement("div");
+  ReactDOM.render(<App />, div);
+  ReactDOM.unmountComponentAtNode(div);
 });