preparing for launch

MantasImb · Dec 13, 2022 · e05a2c9 · e05a2c9
1 parent 73dd184
commit e05a2c9
Show file tree

Hide file tree

Showing 57 changed files with 38,072 additions and 4,024 deletions.
diff --git a/blockvision.code-workspace b/blockvision.code-workspace
@@ -0,0 +1,11 @@
+{
+  "folders": [
+	{
+		"path": "."
+	},
+	{
+		"path": "../Ordis.space"
+	}
+],
+  "settings": {}
+}
diff --git a/client/index.html b/client/index.html
@@ -8,6 +8,7 @@
   </head>
   <body>
     <div id="root"></div>
+    <div id="portal"></div>
     <script type="module" src="/src/main.jsx"></script>
   </body>
 </html>
diff --git a/client/package-lock.json b/client/package-lock.json
diff --git a/client/package.json b/client/package.json
@@ -10,8 +10,16 @@
   },
   "dependencies": {
     "axios": "^1.0.0",
+    "ethers": "^5.7.2",
+    "flowbite": "^1.5.3",
+    "flowbite-react": "^0.3.2",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "react-icons": "^4.6.0",
+    "react-router-dom": "^6.4.2",
+    "react-scripts": "^5.0.1",
+    "react-table": "^7.8.0",
+    "vite-plugin-svgr": "^2.2.2"
   },
   "devDependencies": {
     "@types/react": "^18.0.17",

diff --git a/client/src/APIContext.jsx b/client/src/APIContext.jsx
diff --git a/client/src/App.css b/client/src/App.css
@@ -0,0 +1,41 @@
+.sidebar {
+  box-shadow: rgb(113 122 131 / 11%) 0px 7px 30px 0px;
+}
+.nav-item,
+.navbar {
+  z-index: 2;
+}
+
+@media screen and (max-width: 800px) {
+  .sidebar {
+    z-index: 2;
+  }
+}
+
+.e-dlg-center-center,
+.e-quick-popup-wrapper.e-device {
+  z-index: 2 !important;
+}
+
+::-webkit-scrollbar {
+  width: 6px;
+}
+::-webkit-scrollbar-thumb {
+  background-color: rgb(216, 216, 216);
+  border-radius: 40px;
+}
+::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+
+/* Chrome, Safari, Edge, Opera */
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* Firefox */
+input[type="number"] {
+  -moz-appearance: textfield;
+}
diff --git a/client/src/App.jsx b/client/src/App.jsx
@@ -1,14 +1,122 @@
-import React from "react"
-import Menu from "./components/Menu"
-import Tracker from "./components/Tracker"
+// TODO: Make a dashboard page
+
+import React, { useContext, useEffect } from "react"
+import { BrowserRouter, Routes, Route } from "react-router-dom"
+import { SlWallet } from "react-icons/sl"
+import { HiCheck, HiX } from "react-icons/hi"
+
+import { Navbar, Sidebar, ThemeSettings } from "./components"
+import { Dashboard, TrackedWallets, WalletInfo } from "./pages"
+import { Toast } from "flowbite-react"
+
+import { StateContext } from "./contexts/StateProvider"
+import { APIContext } from "./contexts/APIProvider"
+
+import "./App.css"
+
+export default function App() {
+  const {
+    activeMenu,
+    themeSettings,
+    setThemeSettings,
+    currentColor,
+    currentMode,
+    toastState,
+    setToastState,
+  } = useContext(StateContext)
+
+  const { currentAccount, connectWallet } = useContext(APIContext)
+
+  useEffect(() => {
+    if (currentAccount) {
+      setToastState({
+        message: "Wallet connected successfully.",
+        type: "success",
+      })
+    } else {
+      setToastState({
+        message: "Wallet is not connected.",
+        type: "error",
+      })
+    }
+  }, [currentAccount])
 
-function App() {
   return (
-    <>
-      <Menu />
-      <Tracker />
-    </>
+    <div className={currentMode === "Dark" ? "dark" : ""}>
+      {toastState.message.length > 0 && (
+        <Toast className="fixed top-5 right-5 z-50 animate-toastIn">
+          {toastState.type == "success" ? (
+            <div className="inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-green-100 text-green-500 dark:bg-green-800 dark:text-green-200">
+              <HiCheck className="h-5 w-5" />
+            </div>
+          ) : (
+            <div className="inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-red-100 text-red-500 dark:bg-red-800 dark:text-red-200">
+              <HiX className="h-5 w-5" />
+            </div>
+          )}
+          <div className="ml-3 text-sm font-normal">{toastState.message}</div>
+          <Toast.Toggle />
+        </Toast>
+      )}
+      <BrowserRouter>
+        <div className="flex relative dark:bg-main-dark-bg">
+          <div className="fixed right-4 bottom-4" style={{ zIndex: "1000" }}>
+            <button
+              type="button"
+              className="text-xl md:text-3xl p-3 hover:drop-shadow-xl hover:bg-light-gray text-white"
+              style={{
+                background: currentAccount ? currentColor : "red",
+                borderRadius: "50%",
+              }}
+              onClick={() => {
+                if (!currentAccount) connectWallet()
+                else setThemeSettings(true)
+              }}
+            >
+              <SlWallet />
+            </button>
+          </div>
+          {activeMenu ? (
+            <div className="w-72 fixed sidebar dark:bg-secondary-dark-bg bg-white ">
+              <Sidebar />
+            </div>
+          ) : (
+            <div className="w-0 dark:bg-secondary-dark-bg">
+              <Sidebar />
+            </div>
+          )}
+          <div
+            className={`flex flex-col h-screen dark:bg-main-dark-bg bg-main-bg w-full ${
+              activeMenu ? "md:ml-72" : "flex-2"
+            }`}
+          >
+            <div className="fixed md:static bg-main-bg dark:bg-main-dark-bg navbar w-full">
+              <Navbar />
+            </div>
+
+            {/* {themeSettings && <ThemeSettings />} */}
+            <Routes>
+              {/* Dashboard */}
+              <Route path="/" element={<Dashboard />} />
+              <Route path="/dashboard" element={<Dashboard />} />
+
+              {/* Pages */}
+
+              <Route path="/tracked-wallets" element={<TrackedWallets />} />
+
+              {/* Apps */}
+
+              {/* Charts */}
+              <Route path="/wallet-info" element={<WalletInfo />} />
+              <Route path="/wallet-info/:chainId" element={<WalletInfo />} />
+              <Route
+                path="/wallet-info/:chainId/:ca"
+                element={<WalletInfo />}
+              />
+            </Routes>
+          </div>
+        </div>
+      </BrowserRouter>
+    </div>
   )
 }
-
-export default App
diff --git a/client/src/assets/bscscan-logo.svg b/client/src/assets/bscscan-logo.svg
diff --git a/client/src/assets/etherscan-logo.svg b/client/src/assets/etherscan-logo.svg
diff --git a/client/src/components/Button.jsx b/client/src/components/Button.jsx
@@ -0,0 +1,13 @@
+import React from "react"
+
+export default function Button({ bgColor, color, size, text, borderRadius }) {
+  return (
+    <button
+      type="button"
+      style={{ backgroundColor: bgColor, color, borderRadius }}
+      className={`text-${size} p-3 hover:drop-shadow-xl`}
+    >
+      {text}
+    </button>
+  )
+}
diff --git a/client/src/components/Footer.jsx b/client/src/components/Footer.jsx
@@ -0,0 +1,5 @@
+import React from "react"
+
+export default function Footer() {
+  return <div>Footer</div>
+}
diff --git a/client/src/components/Header.jsx b/client/src/components/Header.jsx
@@ -0,0 +1,12 @@
+import React from "react"
+
+export default function Header({ category, title }) {
+  return (
+    <div className="mb-4 md:mb-10">
+      <p className="text-gray-400">{category}</p>
+      <p className="text-3xl font-extrabold tracking-tight text-slate-900">
+        {title}
+      </p>
+    </div>
+  )
+}
diff --git a/client/src/components/Menu.jsx b/client/src/components/Menu.jsx