add data request straking dashboard

app/javascript/relay/environment.ts

@@ -1,7 +1,7 @@
 import type { Variables, RequestParameters, CacheConfig } from "relay-runtime";
 import { Environment, Network, RecordSource, Store } from "relay-runtime";
 
-export const fetchRelay = async (
+const fetchRelay = async (
   params: RequestParameters,
   variables: Variables,
   _cacheConfig: CacheConfig

app/javascript/src/Routes.tsx

@@ -2,7 +2,7 @@ import type { FC } from "react";
 import React from "react";
 import { Switch, Route } from "react-router-dom";
 
-import { Home, Orders, Wallet } from "./pages";
+import { Dashbaord, Home, Orders, Wallet } from "./pages";
 
 export const Routes: FC = () => {
   return (
@@ -10,6 +10,9 @@ export const Routes: FC = () => {
       <Route exact path="/">
         <Home />
       </Route>
+      <Route exact path="/dashboard">
+        <Dashbaord />
+      </Route>
       <Route exact path="/wallet">
         <Wallet />
       </Route>

app/javascript/src/components/SideNav/SideNav.tsx

@@ -14,6 +14,10 @@ const MenuItems: MenuItem[] = [
     label: "Início",
     path: "/",
   },
+  {
+    label: "Dashbaord",
+    path: "/dashboard",
+  },
   {
     label: "Carteira",
     path: "/wallet",

app/javascript/src/pages/Dashboard/Dashboard.tsx

@@ -0,0 +1,28 @@
+import type { FC } from "react";
+import React from "react";
+import useSWR from "swr";
+
+import { useCurrentUser } from "../../contexts/UserProvider";
+import type { YieldwatchResponse } from "../../types/yieldwatch";
+
+export const Dashbaord: FC = () => {
+  const { user } = useCurrentUser();
+
+  const { data } = useSWR<YieldwatchResponse>(
+    `https://www.yieldwatch.net/api/all/${user?.walletAddress}?platforms=pancake`
+  );
+
+  if (data?.status === "0" || !data) return null;
+
+  return (
+    <div>
+      <ul>
+        <li>Ganho: {data.result.PancakeSwap.staking.totalUSDValues.yield}</li>
+        <li>
+          Depositado: {data.result.PancakeSwap.staking.totalUSDValues.deposit}
+        </li>
+        <li>Total: {data.result.PancakeSwap.staking.totalUSDValues.total}</li>
+      </ul>
+    </div>
+  );
+};

app/javascript/src/pages/Dashboard/index.ts

@@ -0,0 +1 @@
+export * from "./Dashboard";

app/javascript/src/pages/index.ts

@@ -1,3 +1,4 @@
+export * from "./Dashboard";
 export * from "./Home";
-export * from "./Wallet";
 export * from "./Orders";
+export * from "./Wallet";

app/javascript/src/types/yieldwatch.d.ts

@@ -0,0 +1,85 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+type WatchBalance = {
+  USDPrice: number;
+  totalBalance: number;
+  maxMonitorValue: number;
+  walletBalance: number;
+  watchFromLP: number;
+};
+
+type Currencies = {
+  EUR: number;
+  RMB: number;
+  JPY: number;
+  GBP: number;
+  BTCB: number;
+  WBNB: number;
+  BRL: number;
+  AUD: number;
+  HKD: number;
+  SGD: number;
+  RUB: number;
+  KRW: number;
+  CAD: number;
+  THB: number;
+  CHF: number;
+  IDR: number;
+  TRY: number;
+  TWD: number;
+};
+
+type TotalUSDValues = {
+  deposit: number;
+  yield: number;
+  total: number;
+};
+
+type Vaults = {
+  totalUSDValues: TotalUSDValues;
+  vaults: any[];
+};
+
+type TotalUSDValues2 = {
+  deposit: number;
+  yield: number;
+  total: number;
+};
+
+type LPStaking = {
+  totalUSDValues: TotalUSDValues2;
+  vaults: any[];
+};
+
+type TotalUSDValues3 = {
+  deposit: number;
+  yield: number;
+  total: number;
+};
+
+type Staking = {
+  totalUSDValues: TotalUSDValues3;
+  vaults: any[];
+};
+
+type PancakeSwap = {
+  vaults: Vaults;
+  LPStaking: LPStaking;
+  staking: Staking;
+};
+
+type WalletBalance = {
+  totalUSDValue: number;
+  balances: any[];
+};
+
+type Result = {
+  watchBalance: WatchBalance;
+  currencies: Currencies;
+  PancakeSwap: PancakeSwap;
+};
+
+export type YieldwatchResponse = {
+  status: "0" | "1";
+  message: string;
+  result: Result;
+};

config/routes.rb

@@ -20,7 +20,7 @@ Rails.application.routes.draw do
   root to: "home#index"
   get "*all" => "home#index", constraints: lambda { |req|
     ["playground", "rails", "sidekiq"].filter do |path|
-      req.path != path
+      req.path.include?(path)
     end.blank?
   }
 

package.json

@@ -40,6 +40,7 @@
     "react-router-dom": "^5.2.0",
     "regenerator-runtime": "^0.13.9",
     "relay-runtime": "^11.0.2",
+    "swr": "^0.5.6",
     "tailwindcss": "npm:@tailwindcss/postcss7-compat",
     "turbolinks": "^5.2.0",
     "typescript": "^4.3.5",

yarn.lock

@@ -3472,6 +3472,11 @@ depd@~1.1.2:
   resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
   integrity sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=
 
+dequal@2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.2.tgz#85ca22025e3a87e65ef75a7a437b35284a7e319d"
+  integrity sha512-q9K8BlJVxK7hQYqa6XISGmBZbtQQWVXSrRrWreHC94rMt1QL/Impruc+7p2CYSYuVIUr+YCt6hjrs1kkdJRTug==
+
 des.js@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/des.js/-/des.js-1.0.1.tgz#5382142e1bdc53f85d86d53e5f4aa7deb91e0843"
@@ -8684,6 +8689,13 @@ svgo@^1.0.0:
     unquote "~1.1.1"
     util.promisify "~1.0.0"
 
+swr@^0.5.6:
+  version "0.5.6"
+  resolved "https://registry.yarnpkg.com/swr/-/swr-0.5.6.tgz#70bfe9bc9d7ac49a064be4a0f4acf57982e55a31"
+  integrity sha512-Bmx3L4geMZjYT5S2Z6EE6/5Cx6v1Ka0LhqZKq8d6WL2eu9y6gHWz3dUzfIK/ymZVHVfwT/EweFXiYGgfifei3w==
+  dependencies:
+    dequal "2.0.2"
+
 table@^6.0.9:
   version "6.7.1"
   resolved "https://registry.yarnpkg.com/table/-/table-6.7.1.tgz#ee05592b7143831a8c94f3cee6aae4c1ccef33e2"