From d43a2773e8acdedddc44fc1016be2cd7ce281df1 Mon Sep 17 00:00:00 2001 From: kirill Date: Fri, 13 Jun 2025 13:49:21 +0300 Subject: [PATCH 01/27] refactor: implementing FSD, removed assets, created app, shared and widgets dirs and filled them properly --- packages/apps/dashboard/client/index.html | 2 +- packages/apps/dashboard/client/package.json | 3 +- .../{src/assets/styles => public}/favicon.ico | Bin .../apps/dashboard/client/public/vite.svg | 1 - packages/apps/dashboard/client/src/App.tsx | 24 --- .../dashboard/client/src/app/AppRoutes.tsx | 26 ++++ .../dashboard/client/src/app/config/routes.ts | 6 + .../client/src/{main.tsx => app/index.tsx} | 9 +- .../src/{ => app}/providers/ThemeProvider.tsx | 2 +- .../src/{assets => app}/styles/_const.scss | 0 .../styles/_graph-swipper.scss | 0 .../{assets => app}/styles/_home-page.scss | 0 .../{assets => app}/styles/_page-wrapper.scss | 0 .../src/{assets => app}/styles/_search.scss | 0 .../{assets => app}/styles/_shadow-icon.scss | 0 .../src/{assets => app}/styles/main.scss | 0 .../apps/dashboard/client/src/assets/bing.png | Bin 1363 -> 0 bytes .../dashboard/client/src/assets/bitfinex.png | Bin 844 -> 0 bytes .../dashboard/client/src/assets/coinlist.png | Bin 783 -> 0 bytes .../dashboard/client/src/assets/ethereum.png | Bin 809 -> 0 bytes .../dashboard/client/src/assets/exchange.png | Bin 988 -> 0 bytes .../apps/dashboard/client/src/assets/gate.png | Bin 919 -> 0 bytes .../dashboard/client/src/assets/human.png | Bin 538 -> 0 bytes .../client/src/assets/icons/binance.svg | 33 ---- .../client/src/assets/icons/celo.svg | 11 -- .../client/src/assets/icons/discord.svg | 3 - .../client/src/assets/icons/ethereum.svg | 72 --------- .../src/assets/icons/exchange-oracle.svg | 4 - .../src/assets/icons/excluded/escrow.svg | 56 ------- .../src/assets/icons/excluded/wallet.svg | 51 ------- .../client/src/assets/icons/human-app.svg | 4 - .../client/src/assets/icons/job-launcher.svg | 4 - .../client/src/assets/icons/moonbeam.svg | 85 ----------- .../dashboard/client/src/assets/icons/okx.svg | 49 ------ .../client/src/assets/icons/polygon.svg | 32 ---- .../src/assets/icons/recording-oracle.svg | 9 -- .../src/assets/icons/reputation-oracle.svg | 15 -- .../client/src/assets/icons/xlayer.svg | 68 --------- .../dashboard/client/src/assets/lbank.png | Bin 598 -> 0 bytes .../client/src/assets/logo-mobile.png | Bin 1758 -> 0 bytes .../apps/dashboard/client/src/assets/logo.png | Bin 2856 -> 0 bytes .../client/src/assets/probitGlobal.png | Bin 979 -> 0 bytes .../dashboard/client/src/assets/recording.png | Bin 631 -> 0 bytes .../client/src/assets/reputation.png | Bin 1006 -> 0 bytes .../src/components/Breadcrumbs/index.ts | 1 - .../src/components/Charts/ToggleCharts.tsx | 2 +- .../src/components/Clipboard/Clipboard.tsx | 2 +- .../src/components/CustomTooltip/index.tsx | 1 - .../src/components/DataEntry/DatePicker.tsx | 6 +- .../client/src/components/Footer/index.ts | 1 - .../client/src/components/Header/index.ts | 1 - .../src/components/Home/FormatNumber.tsx | 33 ---- .../src/components/Icons/AvalancheIcon.tsx | 34 ----- .../client/src/components/Icons/CeloIcon.tsx | 31 ---- .../components/Icons/MoonbaseAlphaIcon.tsx | 72 --------- .../src/components/Icons/MoonbeamIcon.tsx | 16 -- .../src/components/Icons/XLayerIcon.tsx | 79 ---------- .../src/components/NetworkIcon/index.tsx | 45 ------ .../src/components/NothingFound/index.ts | 1 - .../src/components/PageWrapper/index.ts | 1 - .../src/components/SearchBar/SearchBar.tsx | 4 +- .../SearchResults/TitleSectionWrapper.tsx | 2 +- .../client/src/components/ShadowIcon/index.ts | 1 - .../Leaderboard/components/AddressCell.tsx | 2 +- .../Leaderboard/components/ChainCell.tsx | 2 +- .../components/DataGridWrapper.tsx | 2 +- .../Leaderboard/components/EntityIcon.tsx | 22 --- .../Leaderboard/components/RoleCell.tsx | 5 +- .../Leaderboard/components/SelectNetwork.tsx | 4 +- .../Leaderboard/hooks/useDataGrid.tsx | 3 +- .../client/src/pages/Graph/Graph.tsx | 4 +- .../client/src/pages/Home/Holders.tsx | 2 +- .../dashboard/client/src/pages/Home/Home.tsx | 8 +- .../src/pages/Home/TotalNumberOfTasks.tsx | 2 +- .../src/pages/Home/TotalTransactions.tsx | 2 +- .../client/src/pages/Leaderboard/index.tsx | 8 +- .../EscrowAddress/EscrowAddress.tsx | 2 +- .../src/pages/SearchResults/KVStore/index.tsx | 3 +- .../SearchResults/RoleDetails/RoleDetails.tsx | 22 +-- .../RoleDetailsEscrowsTable.tsx | 2 +- .../src/pages/SearchResults/SearchResults.tsx | 14 +- .../pages/SearchResults/StakeInfo/index.tsx | 2 +- .../WalletAddress/WalletAddress.tsx | 3 +- .../WalletAddressTransactionsTable.tsx | 2 +- .../tableComponents/TransactionsTableBody.tsx | 2 +- .../tableComponents/TransactionsTableHead.tsx | 2 +- .../ui/AbbreviateClipboard/index.tsx} | 2 +- .../ui/Breadcrumbs/index.tsx} | 0 .../ui/CustomTooltip/index.tsx} | 0 .../client/src/shared/ui/EntityIcon/index.tsx | 24 +++ .../src/shared/ui/FormatNumber/index.tsx | 18 +++ .../ui}/Loader/index.tsx | 0 .../src/shared/ui/NetworkIcon/index.tsx | 26 ++++ .../ui/NothingFound/index.tsx} | 0 .../ui}/SectionWrapper/index.tsx | 0 .../ui/ShadowIcon/index.tsx} | 0 .../ui/icons}/BinanceSmartChainIcon.tsx | 2 +- .../ui/icons}/DarkModeIcon.tsx | 4 +- .../Icons => shared/ui/icons}/DiscordIcon.tsx | 0 .../ui/icons}/EscrowAddressIcon.tsx | 4 +- .../ui/icons}/EthereumIcon.tsx | 2 +- .../ui/icons}/ExchangeOracleIcon.tsx | 4 +- .../Icons => shared/ui/icons}/HumanIcon.tsx | 2 +- .../ui/icons/JobLauncherIcon.tsx} | 4 +- .../ui/icons}/LeaderboardIcon.tsx | 4 +- .../ui/icons}/LightModeIcon.tsx | 4 +- .../ui/icons}/LogoBlockIcon.tsx | 4 +- .../ui/icons}/LogoBlockIconMobile.tsx | 4 +- .../Icons => shared/ui/icons}/PolygonIcon.tsx | 2 +- .../ui/icons/RecordingOracleIcon.tsx} | 4 +- .../ui/icons/ReputationOracleIcon.tsx} | 4 +- .../Icons => shared/ui/icons}/WalletIcon.tsx | 4 +- .../{theme.tsx => shared/ui/theme/index.tsx} | 142 +----------------- .../client/src/shared/ui/theme/palette.ts | 139 +++++++++++++++++ .../client/src/widgets/footer/index.ts | 1 + .../Footer => widgets/footer/ui}/Footer.tsx | 2 +- .../client/src/widgets/header/index.ts | 1 + .../Header => widgets/header/ui}/Header.tsx | 4 +- .../header/ui/ThemeModeSwitch.tsx} | 4 +- .../client/src/widgets/page-wrapper/index.ts | 1 + .../page-wrapper/ui}/PageWrapper.tsx | 4 +- packages/apps/dashboard/client/vite.config.ts | 5 - 122 files changed, 342 insertions(+), 1105 deletions(-) rename packages/apps/dashboard/client/{src/assets/styles => public}/favicon.ico (100%) delete mode 100644 packages/apps/dashboard/client/public/vite.svg delete mode 100644 packages/apps/dashboard/client/src/App.tsx create mode 100644 packages/apps/dashboard/client/src/app/AppRoutes.tsx create mode 100644 packages/apps/dashboard/client/src/app/config/routes.ts rename packages/apps/dashboard/client/src/{main.tsx => app/index.tsx} (79%) rename packages/apps/dashboard/client/src/{ => app}/providers/ThemeProvider.tsx (97%) rename packages/apps/dashboard/client/src/{assets => app}/styles/_const.scss (100%) rename packages/apps/dashboard/client/src/{assets => app}/styles/_graph-swipper.scss (100%) rename packages/apps/dashboard/client/src/{assets => app}/styles/_home-page.scss (100%) rename packages/apps/dashboard/client/src/{assets => app}/styles/_page-wrapper.scss (100%) rename packages/apps/dashboard/client/src/{assets => app}/styles/_search.scss (100%) rename packages/apps/dashboard/client/src/{assets => app}/styles/_shadow-icon.scss (100%) rename packages/apps/dashboard/client/src/{assets => app}/styles/main.scss (100%) delete mode 100644 packages/apps/dashboard/client/src/assets/bing.png delete mode 100644 packages/apps/dashboard/client/src/assets/bitfinex.png delete mode 100644 packages/apps/dashboard/client/src/assets/coinlist.png delete mode 100644 packages/apps/dashboard/client/src/assets/ethereum.png delete mode 100644 packages/apps/dashboard/client/src/assets/exchange.png delete mode 100644 packages/apps/dashboard/client/src/assets/gate.png delete mode 100644 packages/apps/dashboard/client/src/assets/human.png delete mode 100644 packages/apps/dashboard/client/src/assets/icons/binance.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/celo.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/discord.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/ethereum.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/exchange-oracle.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/excluded/escrow.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/excluded/wallet.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/human-app.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/job-launcher.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/moonbeam.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/okx.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/polygon.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/recording-oracle.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/reputation-oracle.svg delete mode 100644 packages/apps/dashboard/client/src/assets/icons/xlayer.svg delete mode 100644 packages/apps/dashboard/client/src/assets/lbank.png delete mode 100644 packages/apps/dashboard/client/src/assets/logo-mobile.png delete mode 100644 packages/apps/dashboard/client/src/assets/logo.png delete mode 100644 packages/apps/dashboard/client/src/assets/probitGlobal.png delete mode 100644 packages/apps/dashboard/client/src/assets/recording.png delete mode 100644 packages/apps/dashboard/client/src/assets/reputation.png delete mode 100644 packages/apps/dashboard/client/src/components/Breadcrumbs/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/CustomTooltip/index.tsx delete mode 100644 packages/apps/dashboard/client/src/components/Footer/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/Header/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/Home/FormatNumber.tsx delete mode 100644 packages/apps/dashboard/client/src/components/Icons/AvalancheIcon.tsx delete mode 100644 packages/apps/dashboard/client/src/components/Icons/CeloIcon.tsx delete mode 100644 packages/apps/dashboard/client/src/components/Icons/MoonbaseAlphaIcon.tsx delete mode 100644 packages/apps/dashboard/client/src/components/Icons/MoonbeamIcon.tsx delete mode 100644 packages/apps/dashboard/client/src/components/Icons/XLayerIcon.tsx delete mode 100644 packages/apps/dashboard/client/src/components/NetworkIcon/index.tsx delete mode 100644 packages/apps/dashboard/client/src/components/NothingFound/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/PageWrapper/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/ShadowIcon/index.ts delete mode 100644 packages/apps/dashboard/client/src/features/Leaderboard/components/EntityIcon.tsx rename packages/apps/dashboard/client/src/{components/SearchResults/AbbreviateClipboard.tsx => shared/ui/AbbreviateClipboard/index.tsx} (97%) rename packages/apps/dashboard/client/src/{components/Breadcrumbs/Breadcrumbs.tsx => shared/ui/Breadcrumbs/index.tsx} (100%) rename packages/apps/dashboard/client/src/{components/CustomTooltip/CustomTooltip.tsx => shared/ui/CustomTooltip/index.tsx} (100%) create mode 100644 packages/apps/dashboard/client/src/shared/ui/EntityIcon/index.tsx create mode 100644 packages/apps/dashboard/client/src/shared/ui/FormatNumber/index.tsx rename packages/apps/dashboard/client/src/{components => shared/ui}/Loader/index.tsx (100%) create mode 100644 packages/apps/dashboard/client/src/shared/ui/NetworkIcon/index.tsx rename packages/apps/dashboard/client/src/{components/NothingFound/NothingFound.tsx => shared/ui/NothingFound/index.tsx} (100%) rename packages/apps/dashboard/client/src/{components => shared/ui}/SectionWrapper/index.tsx (100%) rename packages/apps/dashboard/client/src/{components/ShadowIcon/ShadowIcon.tsx => shared/ui/ShadowIcon/index.tsx} (100%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/BinanceSmartChainIcon.tsx (99%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/DarkModeIcon.tsx (85%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/DiscordIcon.tsx (100%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/EscrowAddressIcon.tsx (98%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/EthereumIcon.tsx (94%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/ExchangeOracleIcon.tsx (93%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/HumanIcon.tsx (97%) rename packages/apps/dashboard/client/src/{components/Icons/JobLauncher.tsx => shared/ui/icons/JobLauncherIcon.tsx} (93%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/LeaderboardIcon.tsx (98%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/LightModeIcon.tsx (94%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/LogoBlockIcon.tsx (99%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/LogoBlockIconMobile.tsx (99%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/PolygonIcon.tsx (97%) rename packages/apps/dashboard/client/src/{components/Icons/RecordingOracle.tsx => shared/ui/icons/RecordingOracleIcon.tsx} (96%) rename packages/apps/dashboard/client/src/{components/Icons/ReputationOracle.tsx => shared/ui/icons/ReputationOracleIcon.tsx} (95%) rename packages/apps/dashboard/client/src/{components/Icons => shared/ui/icons}/WalletIcon.tsx (99%) rename packages/apps/dashboard/client/src/{theme.tsx => shared/ui/theme/index.tsx} (71%) create mode 100644 packages/apps/dashboard/client/src/shared/ui/theme/palette.ts create mode 100644 packages/apps/dashboard/client/src/widgets/footer/index.ts rename packages/apps/dashboard/client/src/{components/Footer => widgets/footer/ui}/Footer.tsx (98%) create mode 100644 packages/apps/dashboard/client/src/widgets/header/index.ts rename packages/apps/dashboard/client/src/{components/Header => widgets/header/ui}/Header.tsx (96%) rename packages/apps/dashboard/client/src/{components/ThemeModeSwitch/index.tsx => widgets/header/ui/ThemeModeSwitch.tsx} (72%) create mode 100644 packages/apps/dashboard/client/src/widgets/page-wrapper/index.ts rename packages/apps/dashboard/client/src/{components/PageWrapper => widgets/page-wrapper/ui}/PageWrapper.tsx (86%) diff --git a/packages/apps/dashboard/client/index.html b/packages/apps/dashboard/client/index.html index c533b6ac6b..3b1a160e05 100644 --- a/packages/apps/dashboard/client/index.html +++ b/packages/apps/dashboard/client/index.html @@ -18,6 +18,6 @@
- + diff --git a/packages/apps/dashboard/client/package.json b/packages/apps/dashboard/client/package.json index d8349972ea..0e7b7392cd 100644 --- a/packages/apps/dashboard/client/package.json +++ b/packages/apps/dashboard/client/package.json @@ -62,8 +62,7 @@ "sass": "^1.85.0", "typescript": "^5.6.3", "typescript-eslint": "^8.33.0", - "vite": "^6.2.4", - "vite-plugin-svgr": "^4.2.0" + "vite": "^6.2.4" }, "lint-staged": { "*.{ts,tsx}": [ diff --git a/packages/apps/dashboard/client/src/assets/styles/favicon.ico b/packages/apps/dashboard/client/public/favicon.ico similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/favicon.ico rename to packages/apps/dashboard/client/public/favicon.ico diff --git a/packages/apps/dashboard/client/public/vite.svg b/packages/apps/dashboard/client/public/vite.svg deleted file mode 100644 index c200287f03..0000000000 --- a/packages/apps/dashboard/client/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/apps/dashboard/client/src/App.tsx b/packages/apps/dashboard/client/src/App.tsx deleted file mode 100644 index c78a2f31b6..0000000000 --- a/packages/apps/dashboard/client/src/App.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { FC } from 'react'; - -import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; - -import Graph from '@/pages/Graph'; -import Home from '@/pages/Home'; -import LeaderBoard from '@/pages/Leaderboard'; -import SearchResults from '@/pages/SearchResults'; - -const App: FC = () => { - return ( - - - } /> - } /> - } /> - } /> - Not find} /> - - - ); -}; - -export default App; diff --git a/packages/apps/dashboard/client/src/app/AppRoutes.tsx b/packages/apps/dashboard/client/src/app/AppRoutes.tsx new file mode 100644 index 0000000000..57fdd09f65 --- /dev/null +++ b/packages/apps/dashboard/client/src/app/AppRoutes.tsx @@ -0,0 +1,26 @@ +import { FC } from 'react'; + +import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; + +import GraphPage from '@/pages/Graph'; +import HomePage from '@/pages/Home'; +import LeaderboardPage from '@/pages/Leaderboard'; +import SearchResultsPage from '@/pages/SearchResults'; + +import { ROUTES } from './config/routes'; + +const AppRoutes: FC = () => { + return ( + + + } /> + } /> + } /> + } /> + Not found} /> + + + ); +}; + +export default AppRoutes; diff --git a/packages/apps/dashboard/client/src/app/config/routes.ts b/packages/apps/dashboard/client/src/app/config/routes.ts new file mode 100644 index 0000000000..9990f8335a --- /dev/null +++ b/packages/apps/dashboard/client/src/app/config/routes.ts @@ -0,0 +1,6 @@ +export const ROUTES = { + HOME: '/', + LEADERBOARD: '/leaderboard', + GRAPH: '/graph', + SEARCH: '/search/:chainId/:address', +} as const; diff --git a/packages/apps/dashboard/client/src/main.tsx b/packages/apps/dashboard/client/src/app/index.tsx similarity index 79% rename from packages/apps/dashboard/client/src/main.tsx rename to packages/apps/dashboard/client/src/app/index.tsx index 0474e89a76..26001b986c 100644 --- a/packages/apps/dashboard/client/src/main.tsx +++ b/packages/apps/dashboard/client/src/app/index.tsx @@ -3,10 +3,9 @@ import React from 'react'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import ReactDOM from 'react-dom/client'; -import ThemeProvider from '@/providers/ThemeProvider'; - -import App from './App'; -import '@/assets/styles/main.scss'; +import AppRoutes from './AppRoutes'; +import ThemeProvider from './providers/ThemeProvider'; +import '@/app/styles/main.scss'; import 'simplebar-react/dist/simplebar.min.css'; const queryClient = new QueryClient({ @@ -20,7 +19,7 @@ ReactDOM.createRoot(document.getElementById('root')!).render( - + diff --git a/packages/apps/dashboard/client/src/providers/ThemeProvider.tsx b/packages/apps/dashboard/client/src/app/providers/ThemeProvider.tsx similarity index 97% rename from packages/apps/dashboard/client/src/providers/ThemeProvider.tsx rename to packages/apps/dashboard/client/src/app/providers/ThemeProvider.tsx index 41b3005a65..82045f6af2 100644 --- a/packages/apps/dashboard/client/src/providers/ThemeProvider.tsx +++ b/packages/apps/dashboard/client/src/app/providers/ThemeProvider.tsx @@ -13,7 +13,7 @@ import { ThemeProvider as MuiThemeProvider, } from '@mui/material'; -import { createAppTheme } from '../theme'; +import { createAppTheme } from '@/shared/ui/theme'; const THEME_STORAGE_KEY = 'dashboard-app-theme-mode'; const RELEASE_DARK_MODE = false; // TODO: remove this once we release the dark mode diff --git a/packages/apps/dashboard/client/src/assets/styles/_const.scss b/packages/apps/dashboard/client/src/app/styles/_const.scss similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/_const.scss rename to packages/apps/dashboard/client/src/app/styles/_const.scss diff --git a/packages/apps/dashboard/client/src/assets/styles/_graph-swipper.scss b/packages/apps/dashboard/client/src/app/styles/_graph-swipper.scss similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/_graph-swipper.scss rename to packages/apps/dashboard/client/src/app/styles/_graph-swipper.scss diff --git a/packages/apps/dashboard/client/src/assets/styles/_home-page.scss b/packages/apps/dashboard/client/src/app/styles/_home-page.scss similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/_home-page.scss rename to packages/apps/dashboard/client/src/app/styles/_home-page.scss diff --git a/packages/apps/dashboard/client/src/assets/styles/_page-wrapper.scss b/packages/apps/dashboard/client/src/app/styles/_page-wrapper.scss similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/_page-wrapper.scss rename to packages/apps/dashboard/client/src/app/styles/_page-wrapper.scss diff --git a/packages/apps/dashboard/client/src/assets/styles/_search.scss b/packages/apps/dashboard/client/src/app/styles/_search.scss similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/_search.scss rename to packages/apps/dashboard/client/src/app/styles/_search.scss diff --git a/packages/apps/dashboard/client/src/assets/styles/_shadow-icon.scss b/packages/apps/dashboard/client/src/app/styles/_shadow-icon.scss similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/_shadow-icon.scss rename to packages/apps/dashboard/client/src/app/styles/_shadow-icon.scss diff --git a/packages/apps/dashboard/client/src/assets/styles/main.scss b/packages/apps/dashboard/client/src/app/styles/main.scss similarity index 100% rename from packages/apps/dashboard/client/src/assets/styles/main.scss rename to packages/apps/dashboard/client/src/app/styles/main.scss diff --git a/packages/apps/dashboard/client/src/assets/bing.png b/packages/apps/dashboard/client/src/assets/bing.png deleted file mode 100644 index c1eab49c16daa4a371f2e4d223e32126c8b0b1d4..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1363 zcmV-Z1+4msP)1Y^2dEBSM!OkqamZA?Ss0=~p5*Ubp-JBi?Z*Bqrh& zgbN80Xz>dS2C9e}6T?{4K!kR;U%NXq=NzAzZEIUTq8BpB&Y79B=XpP#=Y3z`f4;=M zHv0!{DU)gLh2v~8O7shfvPw^hKsquIMjv*(Xms>oTkxL@lnGq&<9DPK`y7}OS7Ii( zT;-BghLF<25n}kv!M6SX%D|f4^|A|h#DOgfnV=fDTpbHY0$XR^K(gh;=_&~$g%cPN zR#rwMmw^uw+_)pKC~MvfG&I2@0vH0>#2;GFQX^7L#L25w{GXHTr;ZK0UN7I(fGfQb zOK=EH&kU@QaCCw~Bg{z)kl*=kXh<3bHv*K6AZ?Qfx(w-$4D7R|1x&T@(6>_$@n~5Z zi+pwx9eH{8Mo zi&wVgP^okx>$O~Lnj|}6izCtCs!Cd!z5IHhC2Na4^Z2CI!yh+%d~7Ec>mxpxOi<9LOjO2$|TQpn)Q;T znW8X>8du7+^+7>%SI`TsDNXBRW>%nH2P;-Gffhcw@$)WXrXYgZ?B z3`7|JE5wP|l|_c%(bRL*02?`e}k*vu&6*t~A6>yJ#R2%R`~EL)1|zVxh&-!L2!q zYF*><*c3iJHHja7brGruQ-0q2u!f_j$FY4&51#8Q!fz)>#-#$uUm}u(7wFN&N=~bJ zXEaO=3<*Y1DBME9Yoam977%C9WE+TOjy0l4G}{Il^;Cn3si7kykDqtsNZar-1Ich{y805+UG_5UqngbtRIpyshnlcVlclOW_9J!+zS~rTuC{3!G+ND2 z$}qU{aog&DR5^c*9TQdSL>1|nAdZr%^kH2dO*$&`su+oDU4ExRl4d~7OV*R-+T>5$ zmU46*6)d@KA2@>?G!8~sHRWX+!rXQ!seNm0I)D`Oq9M_GtI7hXnj5D>&In_Ue? zL;ebR4iTR~$+@nX{gAWjBJkp{Xc6%8eDDy3Ir$xQE~!MQ&Ds*Nk%Sy;dgN!j`f`!8 z%0f7o>fp3h0Y!p5Vt6*=<0{;=lMxUcV*ljc^?MPhr7`J@mbkVA*7ajx%@yEbV~3qA zu7fUb!g#xc(CBQoJ3$@RAfur2&!yAT6E%C;rW4(NZ|)YqaE{XEO*7Pbs^7Ei;X*TdMg3$Z%@o zck4@c^wIe>gdcrS-aDr&k?wBsZ07hk>;@%3RBhRcLgqL)2mP7^{rm&wyJZ;fmz2#p zQ;l@b7CEt8m@mKVWESVa6JQ`Q0`3WfpMFx!7jeXdb-Ni(d$q6Mc(bU|GziZ5mH;7q zRJ=N&0WZr_UfY-J!7B>wdRfO`9T9`^jYL4fN&yMT>dF)wTG1$>V!I?0}=G7UX3me!40~_OyN0cMk z9(4y8bOM2tmCIs_C4xafk`~O^BFI`AyFw&Pa%{N4i*&n9)g(idYx0}rT98|Aj&l7+ zA{uh7Ko+8W_ls8__9jjUmir=6?q%kr!G95w)mA(QQ*igo~nf*{)his{}z8;$HuQAa1VLjmv|I2%@04 z))f3e@#Cua0iy4nnX57$kCJks2OgO-Gv|5dnfIMJ0(>zPgc`zMgdc?1BW(+WYColamwl`~7VE{r!Dh(lvYlfgjZAbOZ6b zyE_a9gLrXqF(jZ+DDd*~a#B?}#wOR}@vs1N<$@q!C={BuWc$g6Z(I%r*xcNNd_E7k zTn^68&VU4f8K9&;-=#*#{zEJlgY)xq_Dsyctmr#P@STA`04kLVtgNiC=flH8n4h1A zDUsjC|aydF24!pm= zAJluHP{5m;8zgSf?RK+1dI&Wd4K6M&N+nrMg=M_}^iT{PaeB|t1V21Hz}3|i>ua~$ zV7J>L8jV7?+hwF%%UTQX*=yW=9XJ==m{`-)Lf+%6kbxpCcu>nU%N3guS48>v*!r?HaQYn5) zg77DZwgx1ENIHQTJ~)$L_@r>TH&+2OKnefKO@PslKK&!0nN|3|;V%*H0`|~pJwE^d N002ovPDHLkV1jRUX(#{y diff --git a/packages/apps/dashboard/client/src/assets/ethereum.png b/packages/apps/dashboard/client/src/assets/ethereum.png deleted file mode 100644 index fcd17dba968bbc706b3173b6a3d8f9834dd9cf0b..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 809 zcmV+^1J?YBP)owvpbICBj&*6-h1x3-~G;a&z;f14(9cGZ_dunehY%|wkb{vTP&4I zF&7sX>Dg=++ZMYOj6k$nErY|5&1Pfw1|wG3anf9)(Zu!!LsljE9Kl$--5z>3SR#?& zuw#^dV#l(qVP`Ngy>%%W)?J1wm>A5!dQ-g&?HX1bY%#UV(5kR1!49T&8B1X6MBl_t zei=GxK{w}jdU^_% zmzRJ~31|a>7>!0aK0XEos1*-;ZnxWlUSfq>aXOt2&d<*mjmBz52T<#DI?!x37rl5H zWxbeti5P4GQ5rF)HXIJ2(P%6#L(lWP!E81^A08euu!m9F7K^28GMPXlIg7<22Y;)c zQEnIv26VbA80uL@{rpHu&=9kOgM*v#c>ILpZlO@%@sktV0Zc%h{n2Q&EWHL@xm+9Ph1jS z#j==QPU%zyqk5wn0(BFx4tceOwLcWGT(U|(>4de}eHR!RYQ@8Hx+^;E3`Xfv diff --git a/packages/apps/dashboard/client/src/assets/exchange.png b/packages/apps/dashboard/client/src/assets/exchange.png deleted file mode 100644 index d48b1b3d00723a0822e91369996be3ed8b0839aa..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 988 zcmV<210(#2P)-cMgq&E zOXawX!|hFG_Be9~2X|y7#KP{(xAXJOEW&?C4i2+gyG2CYCV~PY|78U`0MzII+Bc@z ziql1yQ}Vh}VzuKDNW3s;pTFwkzzXJ&6=%Q7UVZVw=n_2d$aMzGJ-3PSK{RVfP!=#b z!=F#06Sk4sLtl|-)8#B+V-9u1Hz_RRDqvxI+r3PHpdvA$vYZY9x)`hc9 zD!t6R0+GHDP$Js8F{kG`jpCwOmoR1ly`!FYb`B}!&inRj37$Uy;wHy?^QrgpW1@#r zB$7AD3m3q0cyGn2)Y#{0oSx)#bZ$?)EE1V=ilV{S!$p14=xL4fT2D6Nwe1(`Qmltz zo^g>BLBi>4c95t;NS_((GB}@iDh&iYh+byoA=}G2j=ALu?oW6qA=KJ@moW0r(g;k1 z3WQj2U8fT^2J{$(Sm{HfZ?%~!5x_J&b6vH;2JQnezTAbJmmCw&2_%RU28-p{pV8s& z;4I=<7|fUfU*tod3+aBmkXC`|VOQ9(fR<-NFf?YPYi9Fo8kp=!Au(uFLFuH#}>xU zL@I|nlHDFoW>{X>eKr%5!>Kb*Ud8Q6uIxf+h0x-~hBW$dFbl|Ww4Bohwje=^=nPlVsNDBpc$p&Zw6sVYkovUzYJ%Fkd07olvR-#|h<`$&V z5SaMQ2FxM08oBi2=4G5HX~e8hw!a9fapau}COmsAeMp{*EcS`suznq(~5kD zH%of`;m*7MIulGhLu~ou%knH$WFp)PKN*5|r8Ie_-`KzmqyusacfVJ~SfUC3VQFh8KaGpGNIv$M0ivzik0o&C?5bLPzVU(V%U;D3U1?jva< z=_iTtEW~q|q=m$f^}-|$lFV3?y7;Ae5d@2IF$Z!#HDP+9mSZrI#Iv_43`NpN%M!l! zR)H}`E`_9tF{aoDU5@0`jw(7rcc<}bTmxsEOpzgR4XeQTmN;^hxbh|$t7A3v4J{)R6M?!~ox&>>D0m~PrbA>2 zm#xX~qYO9u7K@VK>P=xFlCt`YB5<G+K?#bz~a+lHMI zE;N^+c841ta&k;bqh~*1teH63QC-|xch_DcB53|eu}6f5YYBt+Lia5T1rKq!v+ zWZvFqI?76fMH&{8ZliC9Byl_l`p~f3BaG@K@{r|$&5IFnAN7ah=)9jsBDMAz;AFW= z*3s2kjE-@ z6y#1@L3#BAZAm%Y%y|R1P$eyx#kr+J&#v@dkC3d&1|{`cPk~)$@h_OL=lijf!4M zIiYy?gr(3x=FKw0&!DFABMa`JeAR|r0s587^p72vUazpI;bI>9B&e^c|I<^3;d&%~ cI`41m3q^*Es@O5NEdT%j07*qoM6N<$f>{0L82|tP diff --git a/packages/apps/dashboard/client/src/assets/icons/binance.svg b/packages/apps/dashboard/client/src/assets/icons/binance.svg deleted file mode 100644 index ab171b13dd..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/binance.svg +++ /dev/null @@ -1,33 +0,0 @@ - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/celo.svg b/packages/apps/dashboard/client/src/assets/icons/celo.svg deleted file mode 100644 index 6fa2e074a4..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/celo.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/discord.svg b/packages/apps/dashboard/client/src/assets/icons/discord.svg deleted file mode 100644 index 079c049929..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/discord.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/ethereum.svg b/packages/apps/dashboard/client/src/assets/icons/ethereum.svg deleted file mode 100644 index aaafc35867..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/ethereum.svg +++ /dev/null @@ -1,72 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/exchange-oracle.svg b/packages/apps/dashboard/client/src/assets/icons/exchange-oracle.svg deleted file mode 100644 index 5452044828..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/exchange-oracle.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/excluded/escrow.svg b/packages/apps/dashboard/client/src/assets/icons/excluded/escrow.svg deleted file mode 100644 index 44d5e471a0..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/excluded/escrow.svg +++ /dev/null @@ -1,56 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/excluded/wallet.svg b/packages/apps/dashboard/client/src/assets/icons/excluded/wallet.svg deleted file mode 100644 index f081e6fda0..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/excluded/wallet.svg +++ /dev/null @@ -1,51 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/human-app.svg b/packages/apps/dashboard/client/src/assets/icons/human-app.svg deleted file mode 100644 index 9a9290e7c2..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/human-app.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/job-launcher.svg b/packages/apps/dashboard/client/src/assets/icons/job-launcher.svg deleted file mode 100644 index 433c97afa8..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/job-launcher.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/moonbeam.svg b/packages/apps/dashboard/client/src/assets/icons/moonbeam.svg deleted file mode 100644 index 800dd14dec..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/moonbeam.svg +++ /dev/null @@ -1,85 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/okx.svg b/packages/apps/dashboard/client/src/assets/icons/okx.svg deleted file mode 100644 index 515c561adf..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/okx.svg +++ /dev/null @@ -1,49 +0,0 @@ - - - - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/polygon.svg b/packages/apps/dashboard/client/src/assets/icons/polygon.svg deleted file mode 100644 index 2dfb9ed98f..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/polygon.svg +++ /dev/null @@ -1,32 +0,0 @@ - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/recording-oracle.svg b/packages/apps/dashboard/client/src/assets/icons/recording-oracle.svg deleted file mode 100644 index e703d0b8a3..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/recording-oracle.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/reputation-oracle.svg b/packages/apps/dashboard/client/src/assets/icons/reputation-oracle.svg deleted file mode 100644 index 69f056ede0..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/reputation-oracle.svg +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/icons/xlayer.svg b/packages/apps/dashboard/client/src/assets/icons/xlayer.svg deleted file mode 100644 index b3c4db1cb6..0000000000 --- a/packages/apps/dashboard/client/src/assets/icons/xlayer.svg +++ /dev/null @@ -1,68 +0,0 @@ - - - - - - - - - - - - - - - - diff --git a/packages/apps/dashboard/client/src/assets/lbank.png b/packages/apps/dashboard/client/src/assets/lbank.png deleted file mode 100644 index 4ebb88b9d3998ebbf7fee7d1eb24a4398087e714..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 598 zcmV-c0;&CpP)ga?MH@!Lt-=OsY1fM{A<)BX7TH)^9iN1pb38_*vp{<$M zx9z^|tM}Se{F2%3?o5BPGqXD_@XrX5Y>^z3WJt=E@H|BlA<@tRm^ez3l}LY+XcOG# zi83CE%Su$*Uy(O-(xEu88SHKhV`(M;C%oi~NM62U|0qlIlB_aFrrCrSU6LZIdJj+c zK^ybeNZ(2(ab?essfiwhr+P8Jc?Ts6d@*9Y@JX97C|Z2WxP_+QJ}3U824X@9XvakYdrYS1cCtv^A6NGl_4|+JRouQ ziu9Gez?{0hjS(kvLw2CU1)PfbDLK$Tk-W&;bV26`4B5dsT)?NV&2#X8gzO*=>uEQ_ z92HnVy{5*)x6@bBJcwJwm1OciFjL-++A z3mng|F(yZHgv^8SFtL&BR51nqoYCI(|Ej_>!?ylTkLowjL&o-s^b7>sl1e$z054^UuG8fbMTCiewVGip;zY38>XCiURbi2|b*p+eup}-&6XdC9@Rd@mrbm^@2 zq1Y+g^ZR-B9LHYR^W58=nA$_1k=Pg;YzR3gMN?3gzsnA4ECylq(x3+zdS@@Vz zpboj%HIi+8%qpeUi7<_dT-~adqABdn!rm&&)(Mc?!tsB#_a#$Tdd(4@|EUTyDh&;ATZAXj#P8>gZ8sP+ z<+$vXSF+EX`#V2KQI=En2|t$ux#g@;t7%M>bZe{Y)z-&qxZpjo!=<%OymtMqYP*gr zj=^JRb*V}7?r+^>eh{dc;`^f?&p7%f-c$n;qtHL zN>W3#zUyz7wbm;}*IUgN;yOaJ<+h{R~XlfC%tvxoNK-v+we$w^?`RBJgIesm(K3fnn(XqjcYj}O&C`f6Ey0)i#;5W_4P{2`y*TG|AhINFC z^V-ge=qLo}p)ob+Do1#_v#<4ZA=@0LE9qNkgew>}AuXML;c9cV#5Uf(O zRSY|jsK@R-W=B41OmQsUMm$d6h2C5O9R?EzRx%y^-GWofHH<&QC72Whd1guZ@R1i* zYgSw>NAt9%)&`f(qZ5KkIpE5W?#c%WJc(!E$)o)l!gpd_Og; zkB)qp9+T=YYHm>@2_?;T$|H@$zs$0wqYSIcq~bNim>> z-q=V}#PCR>;YQ;9=>Gp6ESj9*#TbdMk+6N!-7V|kMrz@`oA1&%Kefl04CcRuEK0N0 zvU2c-haY`q89|U`*eKU)R~No-XPw zDp8_DU{K8mx{eRK=tWA?r{pn=>N_e?qD1JSeB+hoho*;AqC|Yq~}rttU=(9Z&R9GF9E6 zD0G$7cTUB@SYJzeom8xE4{dZaZSeJt)I~Y^M}$Y4$gs_(XRTHF-`=e7=rOV7NBvl3+u~JD+X4h(48bSPeofBf*rwnI0Bm8Dl5snpy5c`v$?Wa{_+gW9OIsTO3*?YH`L3$apt)kL~N z(OAhzg78{L&z5v2%qff^Jzdf});XO}PKbC(661>l3}`L-&V_BdWSAU|V?A-o&1<_T zG|^V{Y_0^)L>EoO&?Aqh$VN!r#-u;tNliC{rm|+}ZwaHD@ceJ-mO@M9?VA1(9S0#F z;&HrsbbY<}`=Q6I4(B?`YO;QZcH65|U-Vq6+O1f)mG)8vj@4x~ze2mUqc!(qRVpO6KOvuM96DG?Bd!-3-jVWy$ zA~f8kYXtP@K3&vwE1+l}%Z>?&pw|w(0)I8DHX9RG^7k>xF$F>Q=A5Y)BzDH3=Svo{;)& zHasjM!&q5r?`YEN!M%xt52vlYtc>>6L&!C?Hj%;fwlo$!Z~}s~tJGl6_5Rhnj9x1b z5W;C%Q$v4GR4V4VAD{hmHMsWQwv-F#Lo~=ddw)#VIOMyaxpD387?Z}%d(r2BN->TN zE13tuGZ$$hyAuUviua*MABBBlJTJ`y4A@1#Z{uSa`AtO!CT|fMeaToip0rZRBhIrh zdG}xphs5FG;;XGl=I={Cts5DsKe3FE>LX-2b(~MOFSNv1DqAbPkI#>I?XE1n+|B9{ zOl-)ZEfVSzx5auSWpLclq_%|c-*bD=OJMRJCqq`wcXD-4_NkSP_lCGv>9F2{{6ju% zj7cmU;W|6IR!GrC%$JHRjE8#0wGmBinhy=mwfqHYUDt!vIzNmm;t8%B!s5ZF{RFLV zCIx#Z-V}^*c%~r;Wk`n@Dx}t7Sa>M0_qQhzL0S0l7FLjVv3F~PIo-{`M?EXyT@@As zDOBsj*^8J&S$Xi2jk{zSb58LXY27_OeI6SbjHydQtCwsVUc%)NGdy%KvGF?_S=v(z zp?gWW`r<1WI<( zjAWlRt;CaK?|IY~8P9}I+*4fQs8`zuQYz*Y;`XGWU%56i$pdh0MbHyo6({Bk$hD+L zTXao;H)>$AE+=1VTCFA@*An+bmt|Eo6D74+$b^@e1(_xt*elswgjSgXxnG2eM>xYF zIvaU>N|?p)FUesM3U(u7s@HaF#setvD6OLI2_fnnKCz6s?)3SAJ8Y$EWAG-aV}%Ky z^V}5Jz?2SW+va)5;V@X-1U29_x*Vn^a;*vXRBEj1)`VOYhQ}-A^o2IT)|zHM+?N`u z5yW0-fR+3nJUE%Lk7d+C<+T|2w$P#@2j6raFa7LdV(-sO!y~sk89S*t8WOhos^oX< z#j+y4vRrr&qCbW#=NjFug-vzC8p>bLaq4$HzLR1SLN66SkTY$&P!g7Zsd`l{ViIS8 zjT{rXP!4w$U^26JjmOF45v1$z8c$FkdU$-g{ZLS5C%XmtcBD+GdC$jIS>^DPhe2nZ*iaB`|1)CS&SG`6EbH)Mc$<%6GdVj zc)>0ez^`ZGHSU)ue1mQP0RyM%V7$x%ik!j5^Tb#emiypnZ61r2|q&Xze2I-QmzKSpb%nT;qHkxlpj-0CNfPGj%rBL0Np_bRXBohVm&yV9hk9?7o1AoE(s|5#TIFOcu$FtYAP#;yiie&mz@E$ z>0rWZ=d74_N^RB+`rXSjVuX`xiBPo8d2LaGhgVoFu5M5mvpOi{=m--}VDhL2UVHBF zM>BCbXF##H588PR;Zu*Q=Y4DVx3!4Qj&%YNAcSQ@W|e7crmB%=@jZ5F4rq`DARgTR zBM&pQw~`&)bI%QTS*ZIJN1Urod9FI>vz5?m3vwHycC;&$#kzN6y{On0GN#CxA>>6y zE&OggvK)Nd#)6YFp9+cGLhba2S;g<;bq|~71oAHzdO6Xt*>&ON^ywwolnDe$7>X@F z3wCw$V2xH!K_78%2Q!#7_99Mvi9Z?(z7CV!rPGnHVd_MnOD2a4{uYzCFE!co>?N!1 z70=YU0@=)co3ToObwZd38h3P`S(!o*vMs}zVT#9Ep^g)Jq6FZrRz<~nhdgSF1`Akx zRTswRP{K=MHRnm(fy@aEFg&NbdckTX$F3+~2rZ=r@7#D7x23GuP}nQMd#=KJ9&w*W zFVZNUtCoBE!in1%stpQsH+lsm8;7fMXO<2;4hUKIG!t-xZ+3&T7l>5EVKRpj8&&Pd zObtW_E9vgE4iIXLRbKu3^zg3km?)7(9M)wDrzsg`*F3LA)oTAb_Tn+Az@Jy`vxx39 z^_bAUfMKxJr`+DW1_hJ1@9+lM5+!DWS-w2VwMTP+Yc^D(#8-?-1~n6TyBV~)+y9Fy zQDPR@plrG(XjvLmiLV>E9!jXWx3Sn%qQqAWNjZDcK)cQ~D3RHR##E~+xE-fNiMt93 zR<4QK%xbv#wa-P*B0HWng@y=u&?Sp-IeY1N}5*ytQ-IZ0s3`43W?CbP3fk#EsXyuf9;-G)DOu#_nqceh>nGqiELs|l z%}LRSiw}X5d?sDZ0|ZzdEhb0GgFB6Q`>F+YyX1;s*4!}cOO8Q|peIM5y3&eUm+DaY zy^Ebw{DSlvtlJWWO*^6y8m2u%0x2#5XK9R=Q)`fu)k;x7ArdC(vHQRn%$^?(W0e)x z&x_FMI2<}AAT}--d2fCp{ca=b>ukyyS>~`}Z6uOU#tkd<+7?U0_gjSbC9mr(WrgkBGfO?SVMd1AdT;?gC$Y`^gw4M7F3U$|qZ+-r-30 z<%<^R^*p4$VGCriMa>|c%pBm>k?IO7E}jx$Hub_E=ya~_JC^`^;v`ABx%c3Btlk(& zgG-}$umRUM#0&y;Jl1X=jct3zv6E-if#*Jp*wgo!OsM?Ufrs}RQCMJc%^IJ?G`i<4 zG+@{Mv51)vM8WbRk;kg{eU58~y$^-&+wlBR6Us`gba0>$Pq|N-7J@B1$6(=-aAm4u zuyO4v!h&zN^x$=NGoEEOQ9pVVpU9{{tXLnZkZS@spX7f938lEd6Ptf_%U4os002ovPDHLkV1j&+ Bx2XUC diff --git a/packages/apps/dashboard/client/src/assets/recording.png b/packages/apps/dashboard/client/src/assets/recording.png deleted file mode 100644 index f4daa1fff7158fa8db6711cce932422e6f0dea96..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 631 zcmV--0*L*IP)6(8igv-Yj)!6~8Y$#$EcW+4X#!o%BGcvOf0Z(D0tRZ(W%8O$ldMwt%omB-y9R~|4XIF_ao z3l9Rb;X~&&UhfB|*COyv=!!XZo9>NgxT(UmtSg)POBBM= z*EvMqcUY@ss%>RbAT19t@}WD{(?*?PS?88z*3v_g8(WzaNC&>Uqxf#osVU`JA{zHv zhP;JL3TPgfo(uTM9TC~s7n+gdsc;V>nv$ti6P(Q5kt*&&9EMq)Q0T8f;~u_tLWNpp z?1Una;o>pq?N3wS1-_|fUFF7M$fHP5XB>KeL9N1!=do~2OxAkau9C?g6Y*?mT4RQE z1x9>S>mcAEq=13Dfu;7Og>t?7E;JPz3L6OFrfge@d;r;(r5kJQ#k5qs#0R!p?4q8& RNjm@l002ovPDHLkV1hoP4{m14y~$wQY2@0Jv+bOi~;^=B}?{on{{qEWOMT4{j?L(dqsN5qeF zOto$tc<|M;z1M<^W@QD)ac*DXelJWy(QHkbj{!iN7n%@Thv>0zmtFoLZK0gcTU@lp z#@ys(5`{ameo9W9IPG8D;_+%d*a@+Ap@Bp3e~qy-QKgHwCm(TLdDQfD4N4%oeujMoSz+NgdcbEwv` zGAl9R%vyB_6dVIWv+O)uJYrV7tip;`1;kpVbepX^=fCa66Exv4jU|bgmb)yf;0*8? z;P70HpsoUJ^&@X*YdeZ1LU8w@uP5m(;ejA%T(H93f@|Ct{b{f09&0aP>zau3izP9& zafUX=i`;$8p6fHGv^k-Barq&UHEgBLh~w!!o2yNz2q`@T^ii; zg-N-wLS0$QR|r-hEvo|jvKKuzH#gqDN$)WS^a0IJu{gAvpTo5jBuo&|H4~L*yT{H0 zKu;L4n=&A?-Y}zt|9Sr3&+Z9?3n-BVPhf%F1L-bEjYFsjA)-QARTU7bO%0y4K0suw ziwQ_%P*tLzm5enZ|FY1z8?xf8f&db ctBml!0RaBDLo5b7$^ZZW07*qoM6N<$f-4=zIsgCw diff --git a/packages/apps/dashboard/client/src/components/Breadcrumbs/index.ts b/packages/apps/dashboard/client/src/components/Breadcrumbs/index.ts deleted file mode 100644 index 3ff68ca589..0000000000 --- a/packages/apps/dashboard/client/src/components/Breadcrumbs/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './Breadcrumbs'; diff --git a/packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx b/packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx index 58d2196304..251f026d27 100644 --- a/packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx +++ b/packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx @@ -2,7 +2,7 @@ import { FormControlLabel, FormGroup, Typography } from '@mui/material'; import Checkbox from '@mui/material/Checkbox'; import Stack from '@mui/material/Stack'; -import { FormatNumber } from '@/components/Home/FormatNumber'; +import FormatNumber from '@/shared/ui/FormatNumber'; interface ToggleChartsProps { handleChange: (event: React.ChangeEvent) => void; diff --git a/packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx b/packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx index 7601d81cf3..95d1930eaf 100644 --- a/packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx +++ b/packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx @@ -6,7 +6,7 @@ import IconButton from '@mui/material/IconButton'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import CustomTooltip from '@/components/CustomTooltip'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; interface ClipboardProps { value: string; diff --git a/packages/apps/dashboard/client/src/components/CustomTooltip/index.tsx b/packages/apps/dashboard/client/src/components/CustomTooltip/index.tsx deleted file mode 100644 index 781ad47b0f..0000000000 --- a/packages/apps/dashboard/client/src/components/CustomTooltip/index.tsx +++ /dev/null @@ -1 +0,0 @@ -export { default } from './CustomTooltip'; diff --git a/packages/apps/dashboard/client/src/components/DataEntry/DatePicker.tsx b/packages/apps/dashboard/client/src/components/DataEntry/DatePicker.tsx index f5ac91c17d..1ec5ff700f 100644 --- a/packages/apps/dashboard/client/src/components/DataEntry/DatePicker.tsx +++ b/packages/apps/dashboard/client/src/components/DataEntry/DatePicker.tsx @@ -58,8 +58,8 @@ interface CustomDatePickerProps { props: Omit, 'open' | 'onOpen' | 'onClose'>; } -const CustomDaterPicker = ({ props }: CustomDatePickerProps) => { - const [open, setOpen] = useState(false); +const CustomDatePicker = ({ props }: CustomDatePickerProps) => { + const [open, setOpen] = useState(false); return ( { return ( - { - return ( - - ); -}; -export const FormatNumberWithDecimals = ({ - value, -}: { - value: number | string | undefined | null; -}) => { - if (value && Number(value) < 1) { - return {value}; - } - return ( - - ); -}; diff --git a/packages/apps/dashboard/client/src/components/Icons/AvalancheIcon.tsx b/packages/apps/dashboard/client/src/components/Icons/AvalancheIcon.tsx deleted file mode 100644 index 83d1eae24a..0000000000 --- a/packages/apps/dashboard/client/src/components/Icons/AvalancheIcon.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import { FC } from 'react'; - -import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; - -export const AvalancheIcon: FC = (props) => { - return ( - - - - - - - ); -}; diff --git a/packages/apps/dashboard/client/src/components/Icons/CeloIcon.tsx b/packages/apps/dashboard/client/src/components/Icons/CeloIcon.tsx deleted file mode 100644 index 19e30cba4d..0000000000 --- a/packages/apps/dashboard/client/src/components/Icons/CeloIcon.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import { FC } from 'react'; - -import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; - -export const CeloIcon: FC = (props) => { - return ( - - - - - - ); -}; - -export default CeloIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/MoonbaseAlphaIcon.tsx b/packages/apps/dashboard/client/src/components/Icons/MoonbaseAlphaIcon.tsx deleted file mode 100644 index 6e64c1fafb..0000000000 --- a/packages/apps/dashboard/client/src/components/Icons/MoonbaseAlphaIcon.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import { FC } from 'react'; - -import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; - -export const MoonbaseAlphaIcon: FC = (props) => { - return ( - - - - - - - - - - - - - - - - - - ); -}; - -export default MoonbaseAlphaIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/MoonbeamIcon.tsx b/packages/apps/dashboard/client/src/components/Icons/MoonbeamIcon.tsx deleted file mode 100644 index b2de436954..0000000000 --- a/packages/apps/dashboard/client/src/components/Icons/MoonbeamIcon.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { FC } from 'react'; - -import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; - -export const MoonbeamIcon: FC = (props) => { - return ( - - - - ); -}; - -export default MoonbeamIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/XLayerIcon.tsx b/packages/apps/dashboard/client/src/components/Icons/XLayerIcon.tsx deleted file mode 100644 index 7e9ff61b98..0000000000 --- a/packages/apps/dashboard/client/src/components/Icons/XLayerIcon.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import { FC } from 'react'; - -import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; - -export const XLayerIcon: FC = (props) => { - return ( - - - - - - - - - - - - - - - - - - ); -}; diff --git a/packages/apps/dashboard/client/src/components/NetworkIcon/index.tsx b/packages/apps/dashboard/client/src/components/NetworkIcon/index.tsx deleted file mode 100644 index 176f2c13e9..0000000000 --- a/packages/apps/dashboard/client/src/components/NetworkIcon/index.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import CeloIcon from '@/assets/icons/celo.svg'; -import { AvalancheIcon } from '@/components/Icons/AvalancheIcon'; -import BinanceSmartChainIcon from '@/components/Icons/BinanceSmartChainIcon'; -import EthereumIcon from '@/components/Icons/EthereumIcon'; -import HumanIcon from '@/components/Icons/HumanIcon'; -import MoonbaseAlphaIcon from '@/components/Icons/MoonbaseAlphaIcon'; -import MoonbeamIcon from '@/components/Icons/MoonbeamIcon'; -import PolygonIcon from '@/components/Icons/PolygonIcon'; -import { XLayerIcon } from '@/components/Icons/XLayerIcon'; - -export const NetworkIcon = ({ chainId }: { chainId: number }) => { - const icon = (() => { - switch (chainId) { - case 1: - case 4: - case 5: - case 11155111: - return ; - case 56: - case 97: - return ; - case 137: - case 80001: - case 80002: - return ; - case 1284: - return ; - case 1287: - return ; - case 42220: - case 44787: - return ; - case 195: - case 196: - return ; - case 43113: - case 43114: - return ; - default: - return ; - } - })(); - - return <>{icon}; -}; diff --git a/packages/apps/dashboard/client/src/components/NothingFound/index.ts b/packages/apps/dashboard/client/src/components/NothingFound/index.ts deleted file mode 100644 index 3a4c58b3b9..0000000000 --- a/packages/apps/dashboard/client/src/components/NothingFound/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './NothingFound'; diff --git a/packages/apps/dashboard/client/src/components/PageWrapper/index.ts b/packages/apps/dashboard/client/src/components/PageWrapper/index.ts deleted file mode 100644 index ee1a8716a0..0000000000 --- a/packages/apps/dashboard/client/src/components/PageWrapper/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './PageWrapper'; diff --git a/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx b/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx index c8f5f325e6..5e19a50c5b 100644 --- a/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx +++ b/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx @@ -17,8 +17,8 @@ import IconButton from '@mui/material/IconButton'; import clsx from 'clsx'; import { useNavigate } from 'react-router-dom'; -import CustomTooltip from '@/components/CustomTooltip'; -import { NetworkIcon } from '@/components/NetworkIcon'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; +import { NetworkIcon } from '@/shared/ui/NetworkIcon'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import { useFilteredNetworks } from '@/utils/hooks/use-filtered-networks'; import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; diff --git a/packages/apps/dashboard/client/src/components/SearchResults/TitleSectionWrapper.tsx b/packages/apps/dashboard/client/src/components/SearchResults/TitleSectionWrapper.tsx index a7c49b216a..3eacd67706 100644 --- a/packages/apps/dashboard/client/src/components/SearchResults/TitleSectionWrapper.tsx +++ b/packages/apps/dashboard/client/src/components/SearchResults/TitleSectionWrapper.tsx @@ -6,7 +6,7 @@ import Box from '@mui/material/Box'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import CustomTooltip from '@/components/CustomTooltip'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; type Props = { title: string; diff --git a/packages/apps/dashboard/client/src/components/ShadowIcon/index.ts b/packages/apps/dashboard/client/src/components/ShadowIcon/index.ts deleted file mode 100644 index fbddef1da6..0000000000 --- a/packages/apps/dashboard/client/src/components/ShadowIcon/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ShadowIcon'; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/AddressCell.tsx b/packages/apps/dashboard/client/src/features/Leaderboard/components/AddressCell.tsx index 8901834946..a57c5748c4 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/AddressCell.tsx +++ b/packages/apps/dashboard/client/src/features/Leaderboard/components/AddressCell.tsx @@ -1,6 +1,6 @@ import { Box } from '@mui/material'; -import AbbreviateClipboard from '@/components/SearchResults/AbbreviateClipboard'; +import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; export const AddressCell = ({ chainId, diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/ChainCell.tsx b/packages/apps/dashboard/client/src/features/Leaderboard/components/ChainCell.tsx index 9da3ec67f6..8751679f8d 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/ChainCell.tsx +++ b/packages/apps/dashboard/client/src/features/Leaderboard/components/ChainCell.tsx @@ -1,6 +1,6 @@ import { Typography } from '@mui/material'; -import { NetworkIcon } from '@/components/NetworkIcon'; +import { NetworkIcon } from '@/shared/ui/NetworkIcon'; import { getNetwork } from '@/utils/config/networks'; export const ChainCell = ({ chainId }: { chainId: number }) => ( diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/DataGridWrapper.tsx b/packages/apps/dashboard/client/src/features/Leaderboard/components/DataGridWrapper.tsx index 16ce2f550d..7b50c0644f 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/DataGridWrapper.tsx +++ b/packages/apps/dashboard/client/src/features/Leaderboard/components/DataGridWrapper.tsx @@ -1,9 +1,9 @@ import { Box, Typography } from '@mui/material'; import { DataGrid } from '@mui/x-data-grid'; -import Loader from '@/components/Loader'; import { LeaderBoardData } from '@/services/api/use-leaderboard-details'; import { handleErrorMessage } from '@/services/handle-error-message'; +import Loader from '@/shared/ui/Loader'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import useDataGrid from '../hooks/useDataGrid'; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/EntityIcon.tsx b/packages/apps/dashboard/client/src/features/Leaderboard/components/EntityIcon.tsx deleted file mode 100644 index 009c31990b..0000000000 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/EntityIcon.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { Role } from '@human-protocol/sdk'; - -import { ExchangeOracleIcon } from '@/components/Icons/ExchangeOracleIcon'; -import HumanIcon from '@/components/Icons/HumanIcon'; -import { JobLauncher } from '@/components/Icons/JobLauncher'; -import { RecordingOracle } from '@/components/Icons/RecordingOracle'; -import { ReputationOracle } from '@/components/Icons/ReputationOracle'; - -export const EntityIcon: React.FC<{ role: string }> = ({ role }) => { - switch (role) { - case Role.JobLauncher: - return ; - case Role.RecordingOracle: - return ; - case Role.ReputationOracle: - return ; - case Role.ExchangeOracle: - return ; - default: - return ; - } -}; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/RoleCell.tsx b/packages/apps/dashboard/client/src/features/Leaderboard/components/RoleCell.tsx index e2db9ec66b..b0c84184bf 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/RoleCell.tsx +++ b/packages/apps/dashboard/client/src/features/Leaderboard/components/RoleCell.tsx @@ -2,13 +2,10 @@ import { Launch as LaunchIcon } from '@mui/icons-material'; import { Box, Typography } from '@mui/material'; import { Link } from 'react-router-dom'; +import EntityIcon from '@/shared/ui/EntityIcon'; import { CaseConverter } from '@/utils/case-converter'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; - -import { EntityIcon } from './EntityIcon'; - - const Wrapper = ({ children, websiteUrl, diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/SelectNetwork.tsx b/packages/apps/dashboard/client/src/features/Leaderboard/components/SelectNetwork.tsx index 0ff63569cd..7dd9cb3d90 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/SelectNetwork.tsx +++ b/packages/apps/dashboard/client/src/features/Leaderboard/components/SelectNetwork.tsx @@ -7,13 +7,11 @@ import InputLabel from '@mui/material/InputLabel'; import MenuItem from '@mui/material/MenuItem'; import Select, { SelectChangeEvent } from '@mui/material/Select'; -import { NetworkIcon } from '@/components/NetworkIcon'; +import { NetworkIcon } from '@/shared/ui/NetworkIcon'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import { useFilteredNetworks } from '@/utils/hooks/use-filtered-networks'; import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; - - export const SelectNetwork = () => { const { setChainId, diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/hooks/useDataGrid.tsx b/packages/apps/dashboard/client/src/features/Leaderboard/hooks/useDataGrid.tsx index 01117644a2..583cdbab77 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/hooks/useDataGrid.tsx +++ b/packages/apps/dashboard/client/src/features/Leaderboard/hooks/useDataGrid.tsx @@ -4,8 +4,8 @@ import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; import { Box, Typography } from '@mui/material'; import { GridColDef, GridRenderCellParams } from '@mui/x-data-grid'; -import CustomTooltip from '@/components/CustomTooltip'; import { LeaderBoardData } from '@/services/api/use-leaderboard-details'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; @@ -16,7 +16,6 @@ import { RoleCell } from '../components/RoleCell'; import { SelectNetwork } from '../components/SelectNetwork'; import { TextCell } from '../components/TextCell'; - const InfoTooltip = ({ title }: { title: string }) => ( { const { revertToInitialParams } = useGraphPageChartParams(); diff --git a/packages/apps/dashboard/client/src/pages/Home/Holders.tsx b/packages/apps/dashboard/client/src/pages/Home/Holders.tsx index 0fc3d025f8..7ee767d689 100644 --- a/packages/apps/dashboard/client/src/pages/Home/Holders.tsx +++ b/packages/apps/dashboard/client/src/pages/Home/Holders.tsx @@ -1,8 +1,8 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { FormatNumber } from '@/components/Home/FormatNumber'; import { useGeneralStats } from '@/services/api/use-general-stats'; +import FormatNumber from '@/shared/ui/FormatNumber'; const Holders = () => { const { data, isSuccess, isPending, isError } = useGeneralStats(); diff --git a/packages/apps/dashboard/client/src/pages/Home/Home.tsx b/packages/apps/dashboard/client/src/pages/Home/Home.tsx index 5b60eae7b8..cd4f7ea73d 100644 --- a/packages/apps/dashboard/client/src/pages/Home/Home.tsx +++ b/packages/apps/dashboard/client/src/pages/Home/Home.tsx @@ -9,17 +9,17 @@ import Typography from '@mui/material/Typography'; import Grid from '@mui/material/Unstable_Grid2'; import { Link } from 'react-router-dom'; -import CustomTooltip from '@/components/CustomTooltip'; import GraphSwiper from '@/components/Home/GraphSwiper'; -import { LeaderboardIcon } from '@/components/Icons/LeaderboardIcon'; -import PageWrapper from '@/components/PageWrapper'; import SearchBar from '@/components/SearchBar/SearchBar'; -import ShadowIcon from '@/components/ShadowIcon'; import HMTPrice from '@/pages/Home/HMTPrice'; import Holders from '@/pages/Home/Holders'; import TotalNumberOfTasks from '@/pages/Home/TotalNumberOfTasks'; import TotalTransactions from '@/pages/Home/TotalTransactions'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; +import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; +import ShadowIcon from '@/shared/ui/ShadowIcon'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; +import PageWrapper from '@/widgets/page-wrapper'; import { Leaderboard } from './Leaderboard'; diff --git a/packages/apps/dashboard/client/src/pages/Home/TotalNumberOfTasks.tsx b/packages/apps/dashboard/client/src/pages/Home/TotalNumberOfTasks.tsx index 83783a3a35..857569c254 100644 --- a/packages/apps/dashboard/client/src/pages/Home/TotalNumberOfTasks.tsx +++ b/packages/apps/dashboard/client/src/pages/Home/TotalNumberOfTasks.tsx @@ -1,8 +1,8 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { FormatNumber } from '@/components/Home/FormatNumber'; import { useHcaptchaGeneralStats } from '@/services/api/use-hcaptcha-general-stats'; +import FormatNumber from '@/shared/ui/FormatNumber'; const TotalNumberOfTasks = () => { const { data, isError, isPending, isSuccess } = useHcaptchaGeneralStats(); diff --git a/packages/apps/dashboard/client/src/pages/Home/TotalTransactions.tsx b/packages/apps/dashboard/client/src/pages/Home/TotalTransactions.tsx index 3e2959c3ed..ed1732361d 100644 --- a/packages/apps/dashboard/client/src/pages/Home/TotalTransactions.tsx +++ b/packages/apps/dashboard/client/src/pages/Home/TotalTransactions.tsx @@ -1,8 +1,8 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { FormatNumber } from '@/components/Home/FormatNumber'; import { useGeneralStats } from '@/services/api/use-general-stats'; +import FormatNumber from '@/shared/ui/FormatNumber'; const TotalTransactions = () => { const { data, isError, isPending, isSuccess } = useGeneralStats(); diff --git a/packages/apps/dashboard/client/src/pages/Leaderboard/index.tsx b/packages/apps/dashboard/client/src/pages/Leaderboard/index.tsx index b32decf434..5009fed282 100644 --- a/packages/apps/dashboard/client/src/pages/Leaderboard/index.tsx +++ b/packages/apps/dashboard/client/src/pages/Leaderboard/index.tsx @@ -1,8 +1,8 @@ -import Breadcrumbs from '@/components/Breadcrumbs'; -import { LeaderboardIcon } from '@/components/Icons/LeaderboardIcon'; -import PageWrapper from '@/components/PageWrapper'; -import ShadowIcon from '@/components/ShadowIcon'; import { useLeaderboardDetails } from '@/services/api/use-leaderboard-details'; +import Breadcrumbs from '@/shared/ui/Breadcrumbs'; +import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; +import ShadowIcon from '@/shared/ui/ShadowIcon'; +import PageWrapper from '@/widgets/page-wrapper'; import { Leaderboard } from '../../features/Leaderboard/index'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx index 73c77b5a1f..32d91c9c6b 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx @@ -3,8 +3,8 @@ import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; import TitleSectionWrapper from '@/components/SearchResults'; -import SectionWrapper from '@/components/SectionWrapper'; import { AddressDetailsEscrowSchema } from '@/services/api/use-address-details'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; import HmtBalance from '../HmtBalance'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx index bb16776c85..d5c39210e5 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx @@ -1,4 +1,3 @@ - import Table from '@mui/material/Table'; import TableBody from '@mui/material/TableBody'; import TableCell from '@mui/material/TableCell'; @@ -7,8 +6,8 @@ import TableHead from '@mui/material/TableHead'; import TableRow from '@mui/material/TableRow'; import Typography from '@mui/material/Typography'; -import SectionWrapper from '@/components/SectionWrapper'; import useKvstoreData from '@/services/api/use-kvstore-data'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; const KVStore = () => { const { data } = useKvstoreData(); diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx index cb2d6edd12..9876587e4a 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx @@ -7,15 +7,12 @@ import ListItem from '@mui/material/ListItem'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import ExchangeOracleIcon from '@/assets/icons/exchange-oracle.svg'; -import JobLauncherIcon from '@/assets/icons/job-launcher.svg'; -import RecordingOracleIcon from '@/assets/icons/recording-oracle.svg'; -import ReputationOracleIcon from '@/assets/icons/reputation-oracle.svg'; import TitleSectionWrapper from '@/components/SearchResults/TitleSectionWrapper'; -import SectionWrapper from '@/components/SectionWrapper'; import { env } from '@/helpers/env'; import { RoleDetailsEscrowsTable } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable'; import { AddressDetailsOperator } from '@/services/api/use-address-details'; +import EntityIcon from '@/shared/ui/EntityIcon'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; import HmtBalance from '../HmtBalance'; import HmtPrice from '../HmtPrice'; @@ -29,23 +26,10 @@ interface RoleInfoProps { role: string; } -const renderRoleIcon = (role: string | null) => { - if (!role) return null; - - const roleIcons = { - [Role.ReputationOracle]: , - [Role.ExchangeOracle]: , - [Role.JobLauncher]: , - [Role.RecordingOracle]: , - }; - - return roleIcons[role]; -}; - const RoleInformation = ({ title, points, role }: RoleInfoProps) => { return ( - {renderRoleIcon(role)} + {title} diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx index 3364163f08..cd4ef79fa5 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx @@ -8,9 +8,9 @@ import TablePagination from '@mui/material/TablePagination'; import TableRow from '@mui/material/TableRow'; import Typography from '@mui/material/Typography'; -import SectionWrapper from '@/components/SectionWrapper'; import { EscrowsTableBody } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody'; import { useEscrowDetails } from '@/services/api/use-escrows-details'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; export const RoleDetailsEscrowsTable = ({ role }: { role: string | null }) => { diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx index 14ab19de83..7adbcf3555 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx @@ -4,15 +4,8 @@ import Stack from '@mui/material/Stack'; import { AxiosError } from 'axios'; import { useLocation, useParams } from 'react-router-dom'; -import Breadcrumbs from '@/components/Breadcrumbs'; import Clipboard from '@/components/Clipboard'; -import { EscrowAddressIcon } from '@/components/Icons/EscrowAddressIcon'; -import { WalletIcon } from '@/components/Icons/WalletIcon'; -import Loader from '@/components/Loader'; -import NothingFound from '@/components/NothingFound'; -import PageWrapper from '@/components/PageWrapper'; import SearchBar from '@/components/SearchBar/SearchBar'; -import ShadowIcon from '@/components/ShadowIcon'; import EscrowAddress from '@/pages/SearchResults/EscrowAddress'; import RoleDetails from '@/pages/SearchResults/RoleDetails/RoleDetails'; import WalletAddress from '@/pages/SearchResults/WalletAddress'; @@ -21,8 +14,15 @@ import { useAddressDetails, } from '@/services/api/use-address-details'; import { handleErrorMessage } from '@/services/handle-error-message'; +import Breadcrumbs from '@/shared/ui/Breadcrumbs'; +import EscrowAddressIcon from '@/shared/ui/icons/EscrowAddressIcon'; +import WalletIcon from '@/shared/ui/icons/WalletIcon'; +import Loader from '@/shared/ui/Loader'; +import NothingFound from '@/shared/ui/NothingFound'; +import ShadowIcon from '@/shared/ui/ShadowIcon'; import { getNetwork } from '@/utils/config/networks'; import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; +import PageWrapper from '@/widgets/page-wrapper'; import { WalletAddressTransactionsTable } from './WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx index 23702ac62b..268c3d2ef3 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx @@ -4,7 +4,7 @@ import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; import { NumericFormat } from 'react-number-format'; -import SectionWrapper from '@/components/SectionWrapper'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; type Props = { diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx index 7259ffea74..469a8c18cf 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx @@ -5,11 +5,11 @@ import Typography from '@mui/material/Typography'; import { NumericFormat } from 'react-number-format'; import TitleSectionWrapper from '@/components/SearchResults'; -import SectionWrapper from '@/components/SectionWrapper'; import { AddressDetailsOperator, AddressDetailsWallet, } from '@/services/api/use-address-details'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import HmtBalance from '../HmtBalance'; @@ -18,7 +18,6 @@ import KVStore from '../KVStore'; import ReputationScore from '../ReputationScore'; import StakeInfo from '../StakeInfo'; - type Props = { data: AddressDetailsWallet | AddressDetailsOperator; }; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx index 5a88d704c6..aaa39ed496 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx @@ -8,10 +8,10 @@ import TableRow from '@mui/material/TableRow'; import Typography from '@mui/material/Typography'; import SimpleBar from 'simplebar-react'; -import SectionWrapper from '@/components/SectionWrapper'; import { TransactionsTableBody } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody'; import { TransactionsTableHead } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead'; import { useTransactionDetails } from '@/services/api/use-transaction-details'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; export const WalletAddressTransactionsTable = () => { diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx index cd1c80535a..82dadb1162 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx @@ -10,12 +10,12 @@ import MuiTableBody from '@mui/material/TableBody'; import TableCell from '@mui/material/TableCell'; import TableRow from '@mui/material/TableRow'; -import AbbreviateClipboard from '@/components/SearchResults/AbbreviateClipboard'; import { TransactionTableCellMethod } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellMethod'; import { TransactionTableCellValue } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue'; import { TransactionsTableBodyContainer } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBodyContainer'; import { useTransactionDetails } from '@/services/api/use-transaction-details'; import { handleErrorMessage } from '@/services/handle-error-message'; +import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead.tsx index 1d3572a9e4..f4651fa9d9 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead.tsx @@ -4,7 +4,7 @@ import TableCell from '@mui/material/TableCell'; import TableHead from '@mui/material/TableHead'; import TableRow from '@mui/material/TableRow'; -import CustomTooltip from '@/components/CustomTooltip'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; const InfoTooltip = ({ title }: { title: string }) => ( diff --git a/packages/apps/dashboard/client/src/components/SearchResults/AbbreviateClipboard.tsx b/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx similarity index 97% rename from packages/apps/dashboard/client/src/components/SearchResults/AbbreviateClipboard.tsx rename to packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx index 599916f2a0..e69e430fa3 100644 --- a/packages/apps/dashboard/client/src/components/SearchResults/AbbreviateClipboard.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx @@ -7,8 +7,8 @@ import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; import { useNavigate } from 'react-router-dom'; -import CustomTooltip from '@/components/CustomTooltip'; import abbreviateValue from '@/helpers/abbreviateValue'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; interface AbbreviateClipboardProps { value: string; diff --git a/packages/apps/dashboard/client/src/components/Breadcrumbs/Breadcrumbs.tsx b/packages/apps/dashboard/client/src/shared/ui/Breadcrumbs/index.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/Breadcrumbs/Breadcrumbs.tsx rename to packages/apps/dashboard/client/src/shared/ui/Breadcrumbs/index.tsx diff --git a/packages/apps/dashboard/client/src/components/CustomTooltip/CustomTooltip.tsx b/packages/apps/dashboard/client/src/shared/ui/CustomTooltip/index.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/CustomTooltip/CustomTooltip.tsx rename to packages/apps/dashboard/client/src/shared/ui/CustomTooltip/index.tsx diff --git a/packages/apps/dashboard/client/src/shared/ui/EntityIcon/index.tsx b/packages/apps/dashboard/client/src/shared/ui/EntityIcon/index.tsx new file mode 100644 index 0000000000..2ae1ceb6a0 --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/ui/EntityIcon/index.tsx @@ -0,0 +1,24 @@ +import { Role } from '@human-protocol/sdk'; + +import ExchangeOracleIcon from '@/shared/ui/icons/ExchangeOracleIcon'; +import HumanIcon from '@/shared/ui/icons/HumanIcon'; +import JobLauncherIcon from '@/shared/ui/icons/JobLauncherIcon'; +import RecordingOracleIcon from '@/shared/ui/icons/RecordingOracleIcon'; +import ReputationOracleIcon from '@/shared/ui/icons/ReputationOracleIcon'; + +const EntityIcon: React.FC<{ role: string }> = ({ role }) => { + switch (role) { + case Role.JobLauncher: + return ; + case Role.RecordingOracle: + return ; + case Role.ReputationOracle: + return ; + case Role.ExchangeOracle: + return ; + default: + return ; + } +}; + +export default EntityIcon; diff --git a/packages/apps/dashboard/client/src/shared/ui/FormatNumber/index.tsx b/packages/apps/dashboard/client/src/shared/ui/FormatNumber/index.tsx new file mode 100644 index 0000000000..eb723acd74 --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/ui/FormatNumber/index.tsx @@ -0,0 +1,18 @@ +import { NumericFormat } from 'react-number-format'; + +const FormatNumber = ({ + value, +}: { + value: number | string | undefined | null; +}) => { + return ( + + ); +}; + +export default FormatNumber; diff --git a/packages/apps/dashboard/client/src/components/Loader/index.tsx b/packages/apps/dashboard/client/src/shared/ui/Loader/index.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/Loader/index.tsx rename to packages/apps/dashboard/client/src/shared/ui/Loader/index.tsx diff --git a/packages/apps/dashboard/client/src/shared/ui/NetworkIcon/index.tsx b/packages/apps/dashboard/client/src/shared/ui/NetworkIcon/index.tsx new file mode 100644 index 0000000000..5126ad866e --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/ui/NetworkIcon/index.tsx @@ -0,0 +1,26 @@ +import { ChainId } from '@human-protocol/sdk'; + +import BinanceSmartChainIcon from '@/shared/ui/icons/BinanceSmartChainIcon'; +import EthereumIcon from '@/shared/ui/icons/EthereumIcon'; +import HumanIcon from '@/shared/ui/icons/HumanIcon'; +import PolygonIcon from '@/shared/ui/icons/PolygonIcon'; + +export const NetworkIcon = ({ chainId }: { chainId: ChainId }) => { + const icon = (() => { + switch (chainId) { + case 1: + case 11155111: + return ; + case 56: + case 97: + return ; + case 137: + case 80002: + return ; + default: + return ; + } + })(); + + return <>{icon}; +}; diff --git a/packages/apps/dashboard/client/src/components/NothingFound/NothingFound.tsx b/packages/apps/dashboard/client/src/shared/ui/NothingFound/index.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/NothingFound/NothingFound.tsx rename to packages/apps/dashboard/client/src/shared/ui/NothingFound/index.tsx diff --git a/packages/apps/dashboard/client/src/components/SectionWrapper/index.tsx b/packages/apps/dashboard/client/src/shared/ui/SectionWrapper/index.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/SectionWrapper/index.tsx rename to packages/apps/dashboard/client/src/shared/ui/SectionWrapper/index.tsx diff --git a/packages/apps/dashboard/client/src/components/ShadowIcon/ShadowIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/ShadowIcon/index.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/ShadowIcon/ShadowIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/ShadowIcon/index.tsx diff --git a/packages/apps/dashboard/client/src/components/Icons/BinanceSmartChainIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/BinanceSmartChainIcon.tsx similarity index 99% rename from packages/apps/dashboard/client/src/components/Icons/BinanceSmartChainIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/BinanceSmartChainIcon.tsx index 4986041821..4e99f7ee6a 100644 --- a/packages/apps/dashboard/client/src/components/Icons/BinanceSmartChainIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/BinanceSmartChainIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const BinanceSmartChainIcon: FC = (props) => { +const BinanceSmartChainIcon: FC = (props) => { return ( = (props) => { +const DarkModeIcon: FC = (props) => { return ( = (props) => { ); }; + +export default DarkModeIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/DiscordIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/DiscordIcon.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/Icons/DiscordIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/DiscordIcon.tsx diff --git a/packages/apps/dashboard/client/src/components/Icons/EscrowAddressIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/EscrowAddressIcon.tsx similarity index 98% rename from packages/apps/dashboard/client/src/components/Icons/EscrowAddressIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/EscrowAddressIcon.tsx index 754095c5b6..fe065f746d 100644 --- a/packages/apps/dashboard/client/src/components/Icons/EscrowAddressIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/EscrowAddressIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const EscrowAddressIcon: FC = (props) => { +const EscrowAddressIcon: FC = (props) => { return ( = (props) => { ); }; + +export default EscrowAddressIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/EthereumIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/EthereumIcon.tsx similarity index 94% rename from packages/apps/dashboard/client/src/components/Icons/EthereumIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/EthereumIcon.tsx index 5166d0b871..61e39522cf 100644 --- a/packages/apps/dashboard/client/src/components/Icons/EthereumIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/EthereumIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const EthereumIcon: FC = (props) => { +const EthereumIcon: FC = (props) => { return ( diff --git a/packages/apps/dashboard/client/src/components/Icons/ExchangeOracleIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/ExchangeOracleIcon.tsx similarity index 93% rename from packages/apps/dashboard/client/src/components/Icons/ExchangeOracleIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/ExchangeOracleIcon.tsx index be1d4c4bfd..f4fd72d70d 100644 --- a/packages/apps/dashboard/client/src/components/Icons/ExchangeOracleIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/ExchangeOracleIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const ExchangeOracleIcon: FC = (props) => { +const ExchangeOracleIcon: FC = (props) => { return ( = (props) => { ); }; + +export default ExchangeOracleIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/HumanIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/HumanIcon.tsx similarity index 97% rename from packages/apps/dashboard/client/src/components/Icons/HumanIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/HumanIcon.tsx index cfcc3ab87c..90581b56c1 100644 --- a/packages/apps/dashboard/client/src/components/Icons/HumanIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/HumanIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const HumanIcon: FC = (props) => { +const HumanIcon: FC = (props) => { return ( = (props) => { +const JobLauncherIcon: FC = (props) => { return ( = (props) => { ); }; + +export default JobLauncherIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/LeaderboardIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/LeaderboardIcon.tsx similarity index 98% rename from packages/apps/dashboard/client/src/components/Icons/LeaderboardIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/LeaderboardIcon.tsx index b975b6d247..585a217543 100644 --- a/packages/apps/dashboard/client/src/components/Icons/LeaderboardIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/LeaderboardIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const LeaderboardIcon: FC = (props) => { +const LeaderboardIcon: FC = (props) => { return ( = (props) => { ); }; + +export default LeaderboardIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/LightModeIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/LightModeIcon.tsx similarity index 94% rename from packages/apps/dashboard/client/src/components/Icons/LightModeIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/LightModeIcon.tsx index eae0b2bd2e..5e8866c7f8 100644 --- a/packages/apps/dashboard/client/src/components/Icons/LightModeIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/LightModeIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const LightModeIcon: FC = (props) => { +const LightModeIcon: FC = (props) => { return ( = (props) => { ); }; + +export default LightModeIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/LogoBlockIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/LogoBlockIcon.tsx similarity index 99% rename from packages/apps/dashboard/client/src/components/Icons/LogoBlockIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/LogoBlockIcon.tsx index 82d9a19225..ea6291608a 100644 --- a/packages/apps/dashboard/client/src/components/Icons/LogoBlockIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/LogoBlockIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const LogoBlockIcon: FC = (props) => { +const LogoBlockIcon: FC = (props) => { return ( = (props) => { ); }; + +export default LogoBlockIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/LogoBlockIconMobile.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/LogoBlockIconMobile.tsx similarity index 99% rename from packages/apps/dashboard/client/src/components/Icons/LogoBlockIconMobile.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/LogoBlockIconMobile.tsx index 48f12c2a4e..1fdf5e9d2c 100644 --- a/packages/apps/dashboard/client/src/components/Icons/LogoBlockIconMobile.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/LogoBlockIconMobile.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const LogoBlockIconMobile: FC = (props) => { +const LogoBlockIconMobile: FC = (props) => { return ( = (props) => { ); }; + +export default LogoBlockIconMobile; diff --git a/packages/apps/dashboard/client/src/components/Icons/PolygonIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/PolygonIcon.tsx similarity index 97% rename from packages/apps/dashboard/client/src/components/Icons/PolygonIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/PolygonIcon.tsx index 9233ed8930..0eb1c1ef40 100644 --- a/packages/apps/dashboard/client/src/components/Icons/PolygonIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/PolygonIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const PolygonIcon: FC = (props) => { +const PolygonIcon: FC = (props) => { return ( = (props) => { +const RecordingOracleIcon: FC = (props) => { return ( = (props) => { ); }; + +export default RecordingOracleIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/ReputationOracle.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/ReputationOracleIcon.tsx similarity index 95% rename from packages/apps/dashboard/client/src/components/Icons/ReputationOracle.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/ReputationOracleIcon.tsx index 6a0bfee79c..67639b7fca 100644 --- a/packages/apps/dashboard/client/src/components/Icons/ReputationOracle.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/ReputationOracleIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const ReputationOracle: FC = (props) => { +const ReputationOracleIcon: FC = (props) => { return ( = (props) => { ); }; + +export default ReputationOracleIcon; diff --git a/packages/apps/dashboard/client/src/components/Icons/WalletIcon.tsx b/packages/apps/dashboard/client/src/shared/ui/icons/WalletIcon.tsx similarity index 99% rename from packages/apps/dashboard/client/src/components/Icons/WalletIcon.tsx rename to packages/apps/dashboard/client/src/shared/ui/icons/WalletIcon.tsx index 00a4435de9..d8f159c4fa 100644 --- a/packages/apps/dashboard/client/src/components/Icons/WalletIcon.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/icons/WalletIcon.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import SvgIcon, { SvgIconProps } from '@mui/material/SvgIcon'; -export const WalletIcon: FC = (props) => { +const WalletIcon: FC = (props) => { return ( = (props) => { ); }; + +export default WalletIcon; diff --git a/packages/apps/dashboard/client/src/theme.tsx b/packages/apps/dashboard/client/src/shared/ui/theme/index.tsx similarity index 71% rename from packages/apps/dashboard/client/src/theme.tsx rename to packages/apps/dashboard/client/src/shared/ui/theme/index.tsx index 55d021e695..56307ab400 100644 --- a/packages/apps/dashboard/client/src/theme.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/theme/index.tsx @@ -7,6 +7,8 @@ import { PaletteColor, } from '@mui/material/styles/createPalette'; +import { lightPalette, darkPalette } from './palette'; + declare module '@mui/material/Typography' { interface TypographyPropsVariantOverrides { tooltip: true; @@ -97,145 +99,7 @@ export const createAppTheme = (mode: 'light' | 'dark') => { return createTheme({ palette: { mode, - ...(mode === 'light' - ? { - primary: { - main: '#320a8d', - light: '#320a8d', - }, - secondary: { - main: '#6309ff', - light: '#1406B280', - dark: '#14062b', - }, - text: { - primary: '#320a8d', - secondary: '#858ec6', - }, - info: { - main: '#eeeeee', - light: '#f5f5f5', - dark: '#bdbdbd', - }, - sky: { - main: '#858ec6', - light: '#858ec6', - dark: '#dadef0cc', - contrastText: '#858ec6', - }, - white: { - main: '#ffffff', - light: '#f6f5fc', - dark: '#f6f7fe', - contrastText: '#f9faff', - }, - success: { - main: '#0ad397', - light: '#2e7d3280', - }, - warning: { - main: '#ffb300', - light: '#ffd54f', - }, - error: { - main: '#ffb300', - light: '#f20d5f', - }, - orange: { - main: '#ed6c02', - light: '#ed6c0280', - }, - ocean: { - main: '#304ffe', - light: '#8c9eff', - dark: '#03a9f4', - }, - fog: { - main: '#858ec6', - light: '#cbcfe6', - dark: '#e5e7f3', - }, - link: { - main: '#0000ee', - hover: '#1406b2', - visited: '#551a8b', - }, - table: { - main: '#ffffff01', - selected: '#1406b21f', - secondary: '#1406b20a', - }, - overlay: '#1406b20a', - } - : { - primary: { - main: '#320a8d', - light: '#320a8d', - }, - secondary: { - main: '#6309ff', - light: '#1406B280', - dark: '#14062b', - }, - text: { - primary: '#320a8d', - secondary: '#858ec6', - }, - info: { - main: '#eeeeee', - light: '#f5f5f5', - dark: '#bdbdbd', - }, - sky: { - main: '#858ec6', - light: '#858ec6', - dark: '#dadef0cc', - contrastText: '#858ec6', - }, - white: { - main: '#ffffff', - light: '#f6f5fc', - dark: '#f6f7fe', - contrastText: '#f9faff', - }, - success: { - main: '#0ad397', - light: '#2e7d3280', - }, - warning: { - main: '#ffb300', - light: '#ffd54f', - }, - error: { - main: '#ffb300', - light: '#f20d5f', - }, - orange: { - main: '#ed6c02', - light: '#ed6c0280', - }, - ocean: { - main: '#304ffe', - light: '#8c9eff', - dark: '#03a9f4', - }, - fog: { - main: '#858ec6', - light: '#cbcfe6', - dark: '#e5e7f3', - }, - link: { - main: '#0000ee', - hover: '#1406b2', - visited: '#551a8b', - }, - table: { - main: '#ffffff01', - selected: '#1406b21f', - secondary: '#1406b20a', - }, - overlay: '#1406b20a', - }), + ...(mode === 'light' ? lightPalette : darkPalette), }, typography: { fontFamily: 'Inter, Arial, sans-serif', diff --git a/packages/apps/dashboard/client/src/shared/ui/theme/palette.ts b/packages/apps/dashboard/client/src/shared/ui/theme/palette.ts new file mode 100644 index 0000000000..7790326b36 --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/ui/theme/palette.ts @@ -0,0 +1,139 @@ +export const lightPalette = { + primary: { + main: '#320a8d', + light: '#320a8d', + }, + secondary: { + main: '#6309ff', + light: '#1406B280', + dark: '#14062b', + }, + text: { + primary: '#320a8d', + secondary: '#858ec6', + }, + info: { + main: '#eeeeee', + light: '#f5f5f5', + dark: '#bdbdbd', + }, + sky: { + main: '#858ec6', + light: '#858ec6', + dark: '#dadef0cc', + contrastText: '#858ec6', + }, + white: { + main: '#ffffff', + light: '#f6f5fc', + dark: '#f6f7fe', + contrastText: '#f9faff', + }, + success: { + main: '#0ad397', + light: '#2e7d3280', + }, + warning: { + main: '#ffb300', + light: '#ffd54f', + }, + error: { + main: '#ffb300', + light: '#f20d5f', + }, + orange: { + main: '#ed6c02', + light: '#ed6c0280', + }, + ocean: { + main: '#304ffe', + light: '#8c9eff', + dark: '#03a9f4', + }, + fog: { + main: '#858ec6', + light: '#cbcfe6', + dark: '#e5e7f3', + }, + link: { + main: '#0000ee', + hover: '#1406b2', + visited: '#551a8b', + }, + table: { + main: '#ffffff01', + selected: '#1406b21f', + secondary: '#1406b20a', + }, + overlay: '#1406b20a', +}; + +export const darkPalette = { + primary: { + main: '#320a8d', + light: '#320a8d', + }, + secondary: { + main: '#6309ff', + light: '#1406B280', + dark: '#14062b', + }, + text: { + primary: '#320a8d', + secondary: '#858ec6', + }, + info: { + main: '#eeeeee', + light: '#f5f5f5', + dark: '#bdbdbd', + }, + sky: { + main: '#858ec6', + light: '#858ec6', + dark: '#dadef0cc', + contrastText: '#858ec6', + }, + white: { + main: '#ffffff', + light: '#f6f5fc', + dark: '#f6f7fe', + contrastText: '#f9faff', + }, + success: { + main: '#0ad397', + light: '#2e7d3280', + }, + warning: { + main: '#ffb300', + light: '#ffd54f', + }, + error: { + main: '#ffb300', + light: '#f20d5f', + }, + orange: { + main: '#ed6c02', + light: '#ed6c0280', + }, + ocean: { + main: '#304ffe', + light: '#8c9eff', + dark: '#03a9f4', + }, + fog: { + main: '#858ec6', + light: '#cbcfe6', + dark: '#e5e7f3', + }, + link: { + main: '#0000ee', + hover: '#1406b2', + visited: '#551a8b', + }, + table: { + main: '#ffffff01', + selected: '#1406b21f', + secondary: '#1406b20a', + }, + overlay: '#1406b20a', +}; diff --git a/packages/apps/dashboard/client/src/widgets/footer/index.ts b/packages/apps/dashboard/client/src/widgets/footer/index.ts new file mode 100644 index 0000000000..95b6a1947f --- /dev/null +++ b/packages/apps/dashboard/client/src/widgets/footer/index.ts @@ -0,0 +1 @@ +export { default } from './ui/Footer'; diff --git a/packages/apps/dashboard/client/src/components/Footer/Footer.tsx b/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx similarity index 98% rename from packages/apps/dashboard/client/src/components/Footer/Footer.tsx rename to packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx index a649b59936..292f263203 100644 --- a/packages/apps/dashboard/client/src/components/Footer/Footer.tsx +++ b/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx @@ -9,8 +9,8 @@ import Box from '@mui/material/Box'; import Link from '@mui/material/Link'; import Typography from '@mui/material/Typography'; -import DiscordIcon from '@/components/Icons/DiscordIcon'; import { env } from '@/helpers/env'; +import DiscordIcon from '@/shared/ui/icons/DiscordIcon'; const StyledLink = styled(Link)(({ theme }) => ({ textDecoration: 'none', diff --git a/packages/apps/dashboard/client/src/widgets/header/index.ts b/packages/apps/dashboard/client/src/widgets/header/index.ts new file mode 100644 index 0000000000..529d6ba12a --- /dev/null +++ b/packages/apps/dashboard/client/src/widgets/header/index.ts @@ -0,0 +1 @@ +export { default } from './ui/Header'; diff --git a/packages/apps/dashboard/client/src/components/Header/Header.tsx b/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx similarity index 96% rename from packages/apps/dashboard/client/src/components/Header/Header.tsx rename to packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx index 1d0197b81f..2024d30557 100644 --- a/packages/apps/dashboard/client/src/components/Header/Header.tsx +++ b/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx @@ -12,9 +12,9 @@ import styled from '@mui/material/styles/styled'; import Toolbar from '@mui/material/Toolbar'; import { Link } from 'react-router-dom'; -import { LogoBlockIcon } from '@/components/Icons/LogoBlockIcon'; -import { LogoBlockIconMobile } from '@/components/Icons/LogoBlockIconMobile'; import { env } from '@/helpers/env'; +import LogoBlockIcon from '@/shared/ui/icons/LogoBlockIcon'; +import LogoBlockIconMobile from '@/shared/ui/icons/LogoBlockIconMobile'; const NavLink = styled(MuiLink)(({ theme }) => ({ color: theme.palette.primary.main, diff --git a/packages/apps/dashboard/client/src/components/ThemeModeSwitch/index.tsx b/packages/apps/dashboard/client/src/widgets/header/ui/ThemeModeSwitch.tsx similarity index 72% rename from packages/apps/dashboard/client/src/components/ThemeModeSwitch/index.tsx rename to packages/apps/dashboard/client/src/widgets/header/ui/ThemeModeSwitch.tsx index ebcaaab1f0..7be9bd599c 100644 --- a/packages/apps/dashboard/client/src/components/ThemeModeSwitch/index.tsx +++ b/packages/apps/dashboard/client/src/widgets/header/ui/ThemeModeSwitch.tsx @@ -2,8 +2,8 @@ import { FC } from 'react'; import { IconButton, useTheme } from '@mui/material'; -import { DarkModeIcon } from '@/components/Icons/DarkModeIcon'; -import { LightModeIcon } from '@/components/Icons/LightModeIcon'; +import DarkModeIcon from '@/shared/ui/icons/DarkModeIcon'; +import LightModeIcon from '@/shared/ui/icons/LightModeIcon'; const ThemeModeSwitch: FC = () => { const { isDarkMode, toggleColorMode } = useTheme(); diff --git a/packages/apps/dashboard/client/src/widgets/page-wrapper/index.ts b/packages/apps/dashboard/client/src/widgets/page-wrapper/index.ts new file mode 100644 index 0000000000..e80355c905 --- /dev/null +++ b/packages/apps/dashboard/client/src/widgets/page-wrapper/index.ts @@ -0,0 +1 @@ +export { default } from './ui/PageWrapper'; diff --git a/packages/apps/dashboard/client/src/components/PageWrapper/PageWrapper.tsx b/packages/apps/dashboard/client/src/widgets/page-wrapper/ui/PageWrapper.tsx similarity index 86% rename from packages/apps/dashboard/client/src/components/PageWrapper/PageWrapper.tsx rename to packages/apps/dashboard/client/src/widgets/page-wrapper/ui/PageWrapper.tsx index d5061f2ad1..e4096036c4 100644 --- a/packages/apps/dashboard/client/src/components/PageWrapper/PageWrapper.tsx +++ b/packages/apps/dashboard/client/src/widgets/page-wrapper/ui/PageWrapper.tsx @@ -2,8 +2,8 @@ import { FC, PropsWithChildren } from 'react'; import clsx from 'clsx'; -import Footer from '@/components/Footer'; -import Header from '@/components/Header'; +import Footer from '@/widgets/footer'; +import Header from '@/widgets/header'; const PageWrapper: FC< PropsWithChildren<{ diff --git a/packages/apps/dashboard/client/vite.config.ts b/packages/apps/dashboard/client/vite.config.ts index 7ff2b356c4..1d90c510e5 100644 --- a/packages/apps/dashboard/client/vite.config.ts +++ b/packages/apps/dashboard/client/vite.config.ts @@ -3,16 +3,11 @@ import * as path from 'path'; import react from '@vitejs/plugin-react'; import { defineConfig } from 'vite'; import { nodePolyfills } from 'vite-plugin-node-polyfills'; -import svgr from 'vite-plugin-svgr'; // https://vitejs.dev/config/ export default defineConfig({ plugins: [ react(), - svgr({ - include: '**/*.svg', - exclude: 'src/assets/icons/excluded/**/*.svg', - }), nodePolyfills({ protocolImports: true, }), From 5be4a80ade0b53f353d07270538edca70f0e4445 Mon Sep 17 00:00:00 2001 From: kirill Date: Fri, 13 Jun 2025 13:50:00 +0300 Subject: [PATCH 02/27] remove svgr --- yarn.lock | 1 - 1 file changed, 1 deletion(-) diff --git a/yarn.lock b/yarn.lock index e092f6ed77..e663727004 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3941,7 +3941,6 @@ __metadata: use-debounce: "npm:^10.0.2" vite: "npm:^6.2.4" vite-plugin-node-polyfills: "npm:^0.23.0" - vite-plugin-svgr: "npm:^4.2.0" zod: "npm:^3.23.8" zustand: "npm:^4.5.4" languageName: unknown From 0f9d59f0818afdc6312a51361103a40c05bdf027 Mon Sep 17 00:00:00 2001 From: kirill Date: Mon, 16 Jun 2025 15:18:55 +0300 Subject: [PATCH 03/27] fix: typography in Abbreviate Clipboard --- .../dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx b/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx index e69e430fa3..dd96919cb2 100644 --- a/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx @@ -20,6 +20,7 @@ const AbbreviateClipboard = ({ value, link }: AbbreviateClipboardProps) => { return ( Date: Tue, 17 Jun 2025 17:41:06 +0300 Subject: [PATCH 04/27] feat: implement pages and features for Leaderboard and Home functionalities --- .../dashboard/client/src/app/AppRoutes.tsx | 2 +- .../src/features/home/api/useGeneralStats.ts | 22 +++++ .../home/api/useHcaptchaGeneralStats.ts} | 22 ++--- .../src/features/home/model/generalStats.ts | 8 ++ .../home/model/hcaptchaGeneralStats.ts | 9 +++ .../home/ui/HmtPrice.tsx} | 6 +- .../Home => features/home/ui}/Holders.tsx | 3 +- .../home/ui}/TotalNumberOfTasks.tsx | 3 +- .../home/ui}/TotalTransactions.tsx | 3 +- .../leaderboard/api/useLeaderboardDetails.ts | 33 ++++++++ .../client/src/features/leaderboard/index.ts | 1 + .../leaderboard/model/leaderboardSchema.ts | 48 +++++++++++ .../ui}/AddressCell.tsx | 16 ++-- .../ui}/CategoryCell.tsx | 30 ++++--- .../ui}/ChainCell.tsx | 11 ++- .../ui}/DataGridWrapper.tsx | 20 ++--- .../ui/Leaderboard.tsx} | 22 +++-- .../ui}/RoleCell.tsx | 33 ++++---- .../ui}/SelectNetwork.tsx | 2 +- .../ui}/TextCell.tsx | 10 ++- .../hooks => leaderboard/ui}/useDataGrid.tsx | 17 ++-- .../dashboard/client/src/pages/Graph/index.ts | 2 +- .../Graph/{Graph.tsx => ui/GraphPage.tsx} | 4 +- .../client/src/pages/Home/Leaderboard.tsx | 16 ---- .../dashboard/client/src/pages/Home/index.ts | 2 +- .../pages/Home/{Home.tsx => ui/HomePage.tsx} | 19 +++-- .../client/src/pages/leaderboard/index.ts | 1 + .../ui/LeaderboardPage.tsx} | 12 +-- .../src/services/api/use-address-details.tsx | 2 +- .../src/services/api/use-general-stats.tsx | 30 ------- .../services/api/use-leaderboard-details.tsx | 81 ------------------- 31 files changed, 251 insertions(+), 239 deletions(-) create mode 100644 packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts rename packages/apps/dashboard/client/src/{services/api/use-hcaptcha-general-stats.tsx => features/home/api/useHcaptchaGeneralStats.ts} (51%) create mode 100644 packages/apps/dashboard/client/src/features/home/model/generalStats.ts create mode 100644 packages/apps/dashboard/client/src/features/home/model/hcaptchaGeneralStats.ts rename packages/apps/dashboard/client/src/{pages/Home/HMTPrice.tsx => features/home/ui/HmtPrice.tsx} (80%) rename packages/apps/dashboard/client/src/{pages/Home => features/home/ui}/Holders.tsx (89%) rename packages/apps/dashboard/client/src/{pages/Home => features/home/ui}/TotalNumberOfTasks.tsx (88%) rename packages/apps/dashboard/client/src/{pages/Home => features/home/ui}/TotalTransactions.tsx (90%) create mode 100644 packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts create mode 100644 packages/apps/dashboard/client/src/features/leaderboard/index.ts create mode 100644 packages/apps/dashboard/client/src/features/leaderboard/model/leaderboardSchema.ts rename packages/apps/dashboard/client/src/features/{Leaderboard/components => leaderboard/ui}/AddressCell.tsx (59%) rename packages/apps/dashboard/client/src/features/{Leaderboard/components => leaderboard/ui}/CategoryCell.tsx (83%) rename packages/apps/dashboard/client/src/features/{Leaderboard/components => leaderboard/ui}/ChainCell.tsx (69%) rename packages/apps/dashboard/client/src/features/{Leaderboard/components => leaderboard/ui}/DataGridWrapper.tsx (91%) rename packages/apps/dashboard/client/src/features/{Leaderboard/index.tsx => leaderboard/ui/Leaderboard.tsx} (69%) rename packages/apps/dashboard/client/src/features/{Leaderboard/components => leaderboard/ui}/RoleCell.tsx (87%) rename packages/apps/dashboard/client/src/features/{Leaderboard/components => leaderboard/ui}/SelectNetwork.tsx (98%) rename packages/apps/dashboard/client/src/features/{Leaderboard/components => leaderboard/ui}/TextCell.tsx (64%) rename packages/apps/dashboard/client/src/features/{Leaderboard/hooks => leaderboard/ui}/useDataGrid.tsx (90%) rename packages/apps/dashboard/client/src/pages/Graph/{Graph.tsx => ui/GraphPage.tsx} (91%) delete mode 100644 packages/apps/dashboard/client/src/pages/Home/Leaderboard.tsx rename packages/apps/dashboard/client/src/pages/Home/{Home.tsx => ui/HomePage.tsx} (90%) create mode 100644 packages/apps/dashboard/client/src/pages/leaderboard/index.ts rename packages/apps/dashboard/client/src/pages/{Leaderboard/index.tsx => leaderboard/ui/LeaderboardPage.tsx} (59%) delete mode 100644 packages/apps/dashboard/client/src/services/api/use-general-stats.tsx delete mode 100644 packages/apps/dashboard/client/src/services/api/use-leaderboard-details.tsx diff --git a/packages/apps/dashboard/client/src/app/AppRoutes.tsx b/packages/apps/dashboard/client/src/app/AppRoutes.tsx index 57fdd09f65..70c7731371 100644 --- a/packages/apps/dashboard/client/src/app/AppRoutes.tsx +++ b/packages/apps/dashboard/client/src/app/AppRoutes.tsx @@ -4,7 +4,7 @@ import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; import GraphPage from '@/pages/Graph'; import HomePage from '@/pages/Home'; -import LeaderboardPage from '@/pages/Leaderboard'; +import LeaderboardPage from '@/pages/leaderboard'; import SearchResultsPage from '@/pages/SearchResults'; import { ROUTES } from './config/routes'; diff --git a/packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts b/packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts new file mode 100644 index 0000000000..c305298b7c --- /dev/null +++ b/packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts @@ -0,0 +1,22 @@ +import { useQuery } from '@tanstack/react-query'; + +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; +import { validateResponse } from '@/services/validate-response'; + +import { generalStatsResponseSchema } from '../model/generalStats'; + +const useGeneralStats = () => { + return useQuery({ + queryFn: async () => { + const { data } = await httpService.get(apiPaths.generalStats.path); + + const validResponse = validateResponse(data, generalStatsResponseSchema); + + return validResponse; + }, + queryKey: ['useGeneralStats'], + }); +}; + +export default useGeneralStats; diff --git a/packages/apps/dashboard/client/src/services/api/use-hcaptcha-general-stats.tsx b/packages/apps/dashboard/client/src/features/home/api/useHcaptchaGeneralStats.ts similarity index 51% rename from packages/apps/dashboard/client/src/services/api/use-hcaptcha-general-stats.tsx rename to packages/apps/dashboard/client/src/features/home/api/useHcaptchaGeneralStats.ts index e6256c24fe..8df830be1b 100644 --- a/packages/apps/dashboard/client/src/services/api/use-hcaptcha-general-stats.tsx +++ b/packages/apps/dashboard/client/src/features/home/api/useHcaptchaGeneralStats.ts @@ -1,20 +1,12 @@ import { useQuery } from '@tanstack/react-query'; -import { z } from 'zod'; +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; import { validateResponse } from '@/services/validate-response'; -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; +import { hcaptchaGeneralStatsResponseSchema } from '../model/hcaptchaGeneralStats'; -const successHcaptchaGeneralStatsResponseSchema = z.object({ - solved: z.number(), -}); - -export type HcaptchaGeneralStats = z.infer< - typeof successHcaptchaGeneralStatsResponseSchema ->; - -export function useHcaptchaGeneralStats() { +const useHcaptchaGeneralStats = () => { return useQuery({ queryFn: async () => { const { data } = await httpService.get( @@ -23,11 +15,13 @@ export function useHcaptchaGeneralStats() { const validResponse = validateResponse( data, - successHcaptchaGeneralStatsResponseSchema + hcaptchaGeneralStatsResponseSchema ); return validResponse; }, queryKey: ['useHcaptchaGeneralStats'], }); -} +}; + +export default useHcaptchaGeneralStats; diff --git a/packages/apps/dashboard/client/src/features/home/model/generalStats.ts b/packages/apps/dashboard/client/src/features/home/model/generalStats.ts new file mode 100644 index 0000000000..367015e609 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/home/model/generalStats.ts @@ -0,0 +1,8 @@ +import { z } from 'zod'; + +export const generalStatsResponseSchema = z.object({ + totalHolders: z.number(), + totalTransactions: z.number(), +}); + +export type GeneralStats = z.infer; diff --git a/packages/apps/dashboard/client/src/features/home/model/hcaptchaGeneralStats.ts b/packages/apps/dashboard/client/src/features/home/model/hcaptchaGeneralStats.ts new file mode 100644 index 0000000000..28e0722769 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/home/model/hcaptchaGeneralStats.ts @@ -0,0 +1,9 @@ +import { z } from 'zod'; + +export const hcaptchaGeneralStatsResponseSchema = z.object({ + solved: z.number(), +}); + +export type HcaptchaGeneralStats = z.infer< + typeof hcaptchaGeneralStatsResponseSchema +>; diff --git a/packages/apps/dashboard/client/src/pages/Home/HMTPrice.tsx b/packages/apps/dashboard/client/src/features/home/ui/HmtPrice.tsx similarity index 80% rename from packages/apps/dashboard/client/src/pages/Home/HMTPrice.tsx rename to packages/apps/dashboard/client/src/features/home/ui/HmtPrice.tsx index 0d7236c038..f25361c054 100644 --- a/packages/apps/dashboard/client/src/pages/Home/HMTPrice.tsx +++ b/packages/apps/dashboard/client/src/features/home/ui/HmtPrice.tsx @@ -1,9 +1,9 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { useHMTPrice } from '../../services/api/use-hmt-price'; +import { useHMTPrice } from '@/services/api/use-hmt-price'; -const HMTPrice = () => { +const HmtPrice = () => { const { data, isError, isPending, isSuccess } = useHMTPrice(); return ( @@ -18,4 +18,4 @@ const HMTPrice = () => { ); }; -export default HMTPrice; +export default HmtPrice; diff --git a/packages/apps/dashboard/client/src/pages/Home/Holders.tsx b/packages/apps/dashboard/client/src/features/home/ui/Holders.tsx similarity index 89% rename from packages/apps/dashboard/client/src/pages/Home/Holders.tsx rename to packages/apps/dashboard/client/src/features/home/ui/Holders.tsx index 7ee767d689..94cf69d623 100644 --- a/packages/apps/dashboard/client/src/pages/Home/Holders.tsx +++ b/packages/apps/dashboard/client/src/features/home/ui/Holders.tsx @@ -1,9 +1,10 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { useGeneralStats } from '@/services/api/use-general-stats'; import FormatNumber from '@/shared/ui/FormatNumber'; +import useGeneralStats from '../api/useGeneralStats'; + const Holders = () => { const { data, isSuccess, isPending, isError } = useGeneralStats(); diff --git a/packages/apps/dashboard/client/src/pages/Home/TotalNumberOfTasks.tsx b/packages/apps/dashboard/client/src/features/home/ui/TotalNumberOfTasks.tsx similarity index 88% rename from packages/apps/dashboard/client/src/pages/Home/TotalNumberOfTasks.tsx rename to packages/apps/dashboard/client/src/features/home/ui/TotalNumberOfTasks.tsx index 857569c254..9fa09f8bfa 100644 --- a/packages/apps/dashboard/client/src/pages/Home/TotalNumberOfTasks.tsx +++ b/packages/apps/dashboard/client/src/features/home/ui/TotalNumberOfTasks.tsx @@ -1,9 +1,10 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { useHcaptchaGeneralStats } from '@/services/api/use-hcaptcha-general-stats'; import FormatNumber from '@/shared/ui/FormatNumber'; +import useHcaptchaGeneralStats from '../api/useHcaptchaGeneralStats'; + const TotalNumberOfTasks = () => { const { data, isError, isPending, isSuccess } = useHcaptchaGeneralStats(); diff --git a/packages/apps/dashboard/client/src/pages/Home/TotalTransactions.tsx b/packages/apps/dashboard/client/src/features/home/ui/TotalTransactions.tsx similarity index 90% rename from packages/apps/dashboard/client/src/pages/Home/TotalTransactions.tsx rename to packages/apps/dashboard/client/src/features/home/ui/TotalTransactions.tsx index ed1732361d..52a9b06ded 100644 --- a/packages/apps/dashboard/client/src/pages/Home/TotalTransactions.tsx +++ b/packages/apps/dashboard/client/src/features/home/ui/TotalTransactions.tsx @@ -1,9 +1,10 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { useGeneralStats } from '@/services/api/use-general-stats'; import FormatNumber from '@/shared/ui/FormatNumber'; +import useGeneralStats from '../api/useGeneralStats'; + const TotalTransactions = () => { const { data, isError, isPending, isSuccess } = useGeneralStats(); diff --git a/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts b/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts new file mode 100644 index 0000000000..faa9ba636a --- /dev/null +++ b/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts @@ -0,0 +1,33 @@ +import { useQuery } from '@tanstack/react-query'; + +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; +import { validateResponse } from '@/services/validate-response'; +import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; + +import { leaderboardResponseSchema } from '../model/leaderboardSchema'; + +const useLeaderboardDetails = (first?: number) => { + const { + filterParams: { chainId }, + } = useLeaderboardSearch(); + + return useQuery({ + queryFn: async () => { + if (chainId === -1) { + return []; + } + + const { data } = await httpService.get(apiPaths.leaderboardDetails.path, { + params: { chainId, first }, + }); + + const validResponse = validateResponse(data, leaderboardResponseSchema); + + return validResponse; + }, + queryKey: ['useLeaderboardDetails', chainId, first], + }); +}; + +export default useLeaderboardDetails; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/index.ts b/packages/apps/dashboard/client/src/features/leaderboard/index.ts new file mode 100644 index 0000000000..9959a98e9f --- /dev/null +++ b/packages/apps/dashboard/client/src/features/leaderboard/index.ts @@ -0,0 +1 @@ +export { default } from './ui/Leaderboard'; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/model/leaderboardSchema.ts b/packages/apps/dashboard/client/src/features/leaderboard/model/leaderboardSchema.ts new file mode 100644 index 0000000000..03bb6609f7 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/leaderboard/model/leaderboardSchema.ts @@ -0,0 +1,48 @@ +import { z } from 'zod'; + +export const reputationSchema = z.unknown().transform((value) => { + try { + const knownReputation = z + .union([z.literal('Low'), z.literal('Medium'), z.literal('High')]) + .parse(value); + + return knownReputation; + } catch (error) { + console.error(error); + return 'Unknown'; + } +}); + +export type Reputation = z.infer; + +const leaderboardEntity = z.object({ + address: z.string(), + role: z.string(), + amountStaked: z + .string() + .transform((value, ctx) => { + const valueAsNumber = Number(value); + + if (Number.isNaN(valueAsNumber)) { + ctx.addIssue({ + path: ['amountStaked'], + code: z.ZodIssueCode.custom, + }); + } + + return valueAsNumber / 10 ** 18; + }) + .nullable(), + reputation: reputationSchema, + fee: z.number().nullable(), + jobTypes: z.array(z.string()).nullable(), + url: z.string().nullable(), + website: z.string().nullable(), + chainId: z.number(), + name: z.string().nullable(), + category: z.string().nullable(), +}); + +export const leaderboardResponseSchema = z.array(leaderboardEntity); +export type LeaderboardEntity = z.infer; +export type LeaderboardData = z.infer; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/AddressCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/AddressCell.tsx similarity index 59% rename from packages/apps/dashboard/client/src/features/Leaderboard/components/AddressCell.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/AddressCell.tsx index a57c5748c4..5a0455dce9 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/AddressCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/AddressCell.tsx @@ -1,14 +1,16 @@ +import { FC } from 'react'; + +import { ChainId } from '@human-protocol/sdk'; import { Box } from '@mui/material'; import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; -export const AddressCell = ({ - chainId, - address, -}: { - chainId: string; +type Props = { + chainId: ChainId; address: string; -}) => ( +}; + +const AddressCell: FC = ({ chainId, address }) => ( ); + +export default AddressCell; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/CategoryCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/CategoryCell.tsx similarity index 83% rename from packages/apps/dashboard/client/src/features/Leaderboard/components/CategoryCell.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/CategoryCell.tsx index 92392ed41f..2747630c8f 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/CategoryCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/CategoryCell.tsx @@ -1,19 +1,10 @@ +import { FC } from 'react'; + import { Chip, Box } from '@mui/material'; -interface CategoryCellProps { +type CategoryCellProps = { value?: string; -} - -export const CategoryCell = ({ value }: CategoryCellProps) => - value?.length ? ( - - - - ) : null; +}; const getCategoryLabel = (category: string) => { switch (category) { @@ -36,3 +27,16 @@ const getCategoryColor = (category: string) => { return 'default'; } }; + +const CategoryCell: FC = ({ value }) => + value?.length ? ( + + + + ) : null; + +export default CategoryCell; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/ChainCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx similarity index 69% rename from packages/apps/dashboard/client/src/features/Leaderboard/components/ChainCell.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx index 8751679f8d..4176dcd2d0 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/ChainCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx @@ -1,9 +1,16 @@ +import { FC } from 'react'; + +import { ChainId } from '@human-protocol/sdk'; import { Typography } from '@mui/material'; import { NetworkIcon } from '@/shared/ui/NetworkIcon'; import { getNetwork } from '@/utils/config/networks'; -export const ChainCell = ({ chainId }: { chainId: number }) => ( +type Props = { + chainId: ChainId; +}; + +const ChainCell: FC = ({ chainId }) => ( ( {getNetwork(chainId)?.name} ); + +export default ChainCell; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/DataGridWrapper.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx similarity index 91% rename from packages/apps/dashboard/client/src/features/Leaderboard/components/DataGridWrapper.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx index 7b50c0644f..388ef0ee1d 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/DataGridWrapper.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx @@ -1,22 +1,22 @@ +import { FC } from 'react'; + import { Box, Typography } from '@mui/material'; import { DataGrid } from '@mui/x-data-grid'; -import { LeaderBoardData } from '@/services/api/use-leaderboard-details'; import { handleErrorMessage } from '@/services/handle-error-message'; import Loader from '@/shared/ui/Loader'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; -import useDataGrid from '../hooks/useDataGrid'; +import { LeaderboardData } from '../model/leaderboardSchema'; +import useDataGrid from '../ui/useDataGrid'; -export const DataGridWrapper = ({ - data = [], - status, - error, -}: { - data: LeaderBoardData | undefined; +type Props = { + data: LeaderboardData | undefined; status: 'success' | 'error' | 'pending'; error: unknown; -}) => { +}; + +const DataGridWrapper: FC = ({ data = [], status, error }) => { const { columns, rows } = useDataGrid(data); const isMobile = useIsMobile(); @@ -117,3 +117,5 @@ export const DataGridWrapper = ({ ); }; + +export default DataGridWrapper; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/index.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/Leaderboard.tsx similarity index 69% rename from packages/apps/dashboard/client/src/features/Leaderboard/index.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/Leaderboard.tsx index 75e42c0460..d5896a0700 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/index.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/Leaderboard.tsx @@ -4,25 +4,20 @@ import Box from '@mui/material/Box'; import Button from '@mui/material/Button'; import { useNavigate } from 'react-router-dom'; -import { LeaderBoardData } from '@/services/api/use-leaderboard-details'; +import useLeaderboardDetails from '../api/useLeaderboardDetails'; -import { DataGridWrapper } from './components/DataGridWrapper'; -import { SelectNetwork } from './components/SelectNetwork'; +import DataGridWrapper from './DataGridWrapper'; +import SelectNetwork from './SelectNetwork'; type Props = { - data: LeaderBoardData | undefined; - status: 'success' | 'error' | 'pending'; - error: unknown; viewAllBanner?: boolean; + first?: number; }; -export const Leaderboard: FC = ({ - data, - status, - error, - viewAllBanner, -}) => { +const Leaderboard: FC = ({ viewAllBanner, first }) => { const navigate = useNavigate(); + const { data, status, error } = useLeaderboardDetails(first); + return ( = ({ fullWidth sx={{ borderColor: 'primary.main', - cursor: 'pointer', }} onClick={() => navigate('/leaderboard')} > @@ -58,3 +52,5 @@ export const Leaderboard: FC = ({ ); }; + +export default Leaderboard; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/RoleCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx similarity index 87% rename from packages/apps/dashboard/client/src/features/Leaderboard/components/RoleCell.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx index b0c84184bf..e64d2e1b4a 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/RoleCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx @@ -1,3 +1,5 @@ +import { FC, PropsWithChildren } from 'react'; + import { Launch as LaunchIcon } from '@mui/icons-material'; import { Box, Typography } from '@mui/material'; import { Link } from 'react-router-dom'; @@ -6,10 +8,21 @@ import EntityIcon from '@/shared/ui/EntityIcon'; import { CaseConverter } from '@/utils/case-converter'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; -const Wrapper = ({ - children, +type WrapperProps = { + websiteUrl?: string; +}; + +type Props = { + rank: number; + role: string; + websiteUrl?: string; + name?: string; +}; + +const Wrapper: FC> = ({ websiteUrl, -}: React.PropsWithChildren<{ websiteUrl?: string }>) => { + children, +}) => { return websiteUrl ? ( { +const RoleCell: FC = ({ rank, role, websiteUrl, name }) => { const isMobile = useIsMobile(); const humanReadableRole = CaseConverter.convertSnakeToHumanReadable(role); const formattedName = name ? name.split(' ')[0] : null; @@ -71,3 +74,5 @@ export const RoleCell = ({ ); }; + +export default RoleCell; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/SelectNetwork.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/SelectNetwork.tsx similarity index 98% rename from packages/apps/dashboard/client/src/features/Leaderboard/components/SelectNetwork.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/SelectNetwork.tsx index 7dd9cb3d90..176bbc7031 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/SelectNetwork.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/SelectNetwork.tsx @@ -12,7 +12,7 @@ import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import { useFilteredNetworks } from '@/utils/hooks/use-filtered-networks'; import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; -export const SelectNetwork = () => { +const SelectNetwork = () => { const { setChainId, filterParams: { chainId }, diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/components/TextCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/TextCell.tsx similarity index 64% rename from packages/apps/dashboard/client/src/features/Leaderboard/components/TextCell.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/TextCell.tsx index 0daad03b1a..fffa20128f 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/components/TextCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/TextCell.tsx @@ -1,10 +1,12 @@ +import { FC } from 'react'; + import { Typography } from '@mui/material'; -interface TextCellProps { +type TextCellProps = { value: string; -} +}; -export const TextCell = ({ value }: TextCellProps) => ( +const TextCell: FC = ({ value }) => ( ( {value} ); + +export default TextCell; diff --git a/packages/apps/dashboard/client/src/features/Leaderboard/hooks/useDataGrid.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx similarity index 90% rename from packages/apps/dashboard/client/src/features/Leaderboard/hooks/useDataGrid.tsx rename to packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx index 583cdbab77..643606c985 100644 --- a/packages/apps/dashboard/client/src/features/Leaderboard/hooks/useDataGrid.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx @@ -4,17 +4,18 @@ import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; import { Box, Typography } from '@mui/material'; import { GridColDef, GridRenderCellParams } from '@mui/x-data-grid'; -import { LeaderBoardData } from '@/services/api/use-leaderboard-details'; import CustomTooltip from '@/shared/ui/CustomTooltip'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; -import { AddressCell } from '../components/AddressCell'; -import { CategoryCell } from '../components/CategoryCell'; -import { ChainCell } from '../components/ChainCell'; -import { RoleCell } from '../components/RoleCell'; -import { SelectNetwork } from '../components/SelectNetwork'; -import { TextCell } from '../components/TextCell'; +import { LeaderboardData } from '../model/leaderboardSchema'; + +import AddressCell from './AddressCell'; +import CategoryCell from './CategoryCell'; +import ChainCell from './ChainCell'; +import RoleCell from './RoleCell'; +import SelectNetwork from './SelectNetwork'; +import TextCell from './TextCell'; const InfoTooltip = ({ title }: { title: string }) => ( @@ -26,7 +27,7 @@ const InfoTooltip = ({ title }: { title: string }) => ( ); -const useDataGrid = (data: LeaderBoardData) => { +const useDataGrid = (data: LeaderboardData) => { const { filterParams: { chainId }, } = useLeaderboardSearch(); diff --git a/packages/apps/dashboard/client/src/pages/Graph/index.ts b/packages/apps/dashboard/client/src/pages/Graph/index.ts index 8c491e7e8c..375e4a10e9 100644 --- a/packages/apps/dashboard/client/src/pages/Graph/index.ts +++ b/packages/apps/dashboard/client/src/pages/Graph/index.ts @@ -1 +1 @@ -export { default } from './Graph'; +export { default } from './ui/GraphPage'; diff --git a/packages/apps/dashboard/client/src/pages/Graph/Graph.tsx b/packages/apps/dashboard/client/src/pages/Graph/ui/GraphPage.tsx similarity index 91% rename from packages/apps/dashboard/client/src/pages/Graph/Graph.tsx rename to packages/apps/dashboard/client/src/pages/Graph/ui/GraphPage.tsx index f2e006d8a3..b15d842fa8 100644 --- a/packages/apps/dashboard/client/src/pages/Graph/Graph.tsx +++ b/packages/apps/dashboard/client/src/pages/Graph/ui/GraphPage.tsx @@ -5,7 +5,7 @@ import Breadcrumbs from '@/shared/ui/Breadcrumbs'; import { useGraphPageChartParams } from '@/utils/hooks/use-graph-page-chart-params'; import PageWrapper from '@/widgets/page-wrapper'; -const Graph = () => { +const GraphPage = () => { const { revertToInitialParams } = useGraphPageChartParams(); useEffect(() => { @@ -20,4 +20,4 @@ const Graph = () => { ); }; -export default Graph; +export default GraphPage; diff --git a/packages/apps/dashboard/client/src/pages/Home/Leaderboard.tsx b/packages/apps/dashboard/client/src/pages/Home/Leaderboard.tsx deleted file mode 100644 index 8666c6bbdd..0000000000 --- a/packages/apps/dashboard/client/src/pages/Home/Leaderboard.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { useLeaderboardDetails } from '@/services/api/use-leaderboard-details'; - -import { Leaderboard as LeaderboardFeature } from '../../features/Leaderboard'; - -export const Leaderboard = () => { - const { data, status, error } = useLeaderboardDetails(4); - - return ( - - ); -}; diff --git a/packages/apps/dashboard/client/src/pages/Home/index.ts b/packages/apps/dashboard/client/src/pages/Home/index.ts index 41e08eefd0..6648d3e441 100644 --- a/packages/apps/dashboard/client/src/pages/Home/index.ts +++ b/packages/apps/dashboard/client/src/pages/Home/index.ts @@ -1 +1 @@ -export { default } from './Home'; +export { default } from './ui/HomePage'; diff --git a/packages/apps/dashboard/client/src/pages/Home/Home.tsx b/packages/apps/dashboard/client/src/pages/Home/ui/HomePage.tsx similarity index 90% rename from packages/apps/dashboard/client/src/pages/Home/Home.tsx rename to packages/apps/dashboard/client/src/pages/Home/ui/HomePage.tsx index cd4f7ea73d..945e52098c 100644 --- a/packages/apps/dashboard/client/src/pages/Home/Home.tsx +++ b/packages/apps/dashboard/client/src/pages/Home/ui/HomePage.tsx @@ -11,18 +11,17 @@ import { Link } from 'react-router-dom'; import GraphSwiper from '@/components/Home/GraphSwiper'; import SearchBar from '@/components/SearchBar/SearchBar'; -import HMTPrice from '@/pages/Home/HMTPrice'; -import Holders from '@/pages/Home/Holders'; -import TotalNumberOfTasks from '@/pages/Home/TotalNumberOfTasks'; -import TotalTransactions from '@/pages/Home/TotalTransactions'; +import HmtPrice from '@/features/home/ui/HmtPrice'; +import Holders from '@/features/home/ui/Holders'; +import TotalNumberOfTasks from '@/features/home/ui/TotalNumberOfTasks'; +import TotalTransactions from '@/features/home/ui/TotalTransactions'; +import Leaderboard from '@/features/leaderboard'; import CustomTooltip from '@/shared/ui/CustomTooltip'; import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; import ShadowIcon from '@/shared/ui/ShadowIcon'; import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import PageWrapper from '@/widgets/page-wrapper'; -import { Leaderboard } from './Leaderboard'; - const CardWrapper = styled(Grid)(({ theme }) => ({ display: 'flex', background: theme.palette.white.main, @@ -62,7 +61,7 @@ const renderViewChartsButton = (show: boolean) => { } }; -const Home: FC = () => { +const HomePage: FC = () => { const isMobile = useIsMobile(); return ( @@ -77,7 +76,7 @@ const Home: FC = () => { Token - + @@ -127,9 +126,9 @@ const Home: FC = () => { title="Leaderboard" img={} /> - + ); }; -export default Home; +export default HomePage; diff --git a/packages/apps/dashboard/client/src/pages/leaderboard/index.ts b/packages/apps/dashboard/client/src/pages/leaderboard/index.ts new file mode 100644 index 0000000000..1ffb7778d2 --- /dev/null +++ b/packages/apps/dashboard/client/src/pages/leaderboard/index.ts @@ -0,0 +1 @@ +export { default } from './ui/LeaderboardPage'; diff --git a/packages/apps/dashboard/client/src/pages/Leaderboard/index.tsx b/packages/apps/dashboard/client/src/pages/leaderboard/ui/LeaderboardPage.tsx similarity index 59% rename from packages/apps/dashboard/client/src/pages/Leaderboard/index.tsx rename to packages/apps/dashboard/client/src/pages/leaderboard/ui/LeaderboardPage.tsx index 5009fed282..c50eb67e7f 100644 --- a/packages/apps/dashboard/client/src/pages/Leaderboard/index.tsx +++ b/packages/apps/dashboard/client/src/pages/leaderboard/ui/LeaderboardPage.tsx @@ -1,14 +1,10 @@ -import { useLeaderboardDetails } from '@/services/api/use-leaderboard-details'; +import Leaderboard from '@/features/leaderboard'; import Breadcrumbs from '@/shared/ui/Breadcrumbs'; import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; import ShadowIcon from '@/shared/ui/ShadowIcon'; import PageWrapper from '@/widgets/page-wrapper'; -import { Leaderboard } from '../../features/Leaderboard/index'; - -const LeaderBoard = () => { - const { data, status, error } = useLeaderboardDetails(); - +const LeaderboardPage = () => { return ( @@ -17,9 +13,9 @@ const LeaderBoard = () => { title="Leaderboard" img={} /> - + ); }; -export default LeaderBoard; +export default LeaderboardPage; diff --git a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx b/packages/apps/dashboard/client/src/services/api/use-address-details.tsx index 179bfd2641..becd813da7 100644 --- a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx +++ b/packages/apps/dashboard/client/src/services/api/use-address-details.tsx @@ -2,7 +2,7 @@ import { Role } from '@human-protocol/sdk'; import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; -import { reputationSchema } from '@/services/api/use-leaderboard-details'; +import { reputationSchema } from '@/features/leaderboard/model/leaderboardSchema'; import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; import { apiPaths } from '../api-paths'; diff --git a/packages/apps/dashboard/client/src/services/api/use-general-stats.tsx b/packages/apps/dashboard/client/src/services/api/use-general-stats.tsx deleted file mode 100644 index e087a7a97e..0000000000 --- a/packages/apps/dashboard/client/src/services/api/use-general-stats.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { useQuery } from '@tanstack/react-query'; -import { z } from 'zod'; - -import { validateResponse } from '@/services/validate-response'; - -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; - -const successGeneralStatsResponseSchema = z.object({ - totalHolders: z.number(), - totalTransactions: z.number(), -}); - -export type GeneralStats = z.infer; - -export function useGeneralStats() { - return useQuery({ - queryFn: async () => { - const { data } = await httpService.get(apiPaths.generalStats.path); - - const validResponse = validateResponse( - data, - successGeneralStatsResponseSchema - ); - - return validResponse; - }, - queryKey: ['useGeneralStats'], - }); -} diff --git a/packages/apps/dashboard/client/src/services/api/use-leaderboard-details.tsx b/packages/apps/dashboard/client/src/services/api/use-leaderboard-details.tsx deleted file mode 100644 index 37919661ba..0000000000 --- a/packages/apps/dashboard/client/src/services/api/use-leaderboard-details.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import { useQuery } from '@tanstack/react-query'; -import { z } from 'zod'; - -import { validateResponse } from '@/services/validate-response'; -import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; - -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; - -export const reputationSchema = z.unknown().transform((value) => { - try { - const knownReputation = z - .union([z.literal('Low'), z.literal('Medium'), z.literal('High')]) - .parse(value); - - return knownReputation; - } catch (error) { - console.error(error); - return 'Unknown'; - } -}); - -export type Reputation = z.infer; - -const leaderBoardEntity = z.object({ - address: z.string(), - role: z.string(), - amountStaked: z - .string() - .transform((value, ctx) => { - const valueAsNumber = Number(value); - - if (Number.isNaN(valueAsNumber)) { - ctx.addIssue({ - path: ['amountStaked'], - code: z.ZodIssueCode.custom, - }); - } - - return valueAsNumber / 10 ** 18; - }) - .nullable(), - reputation: reputationSchema, - fee: z.number().nullable(), - jobTypes: z.array(z.string()).nullable(), - url: z.string().nullable(), - website: z.string().nullable(), - chainId: z.number(), - name: z.string().nullable(), - category: z.string().nullable(), -}); - -export const leaderBoardSuccessResponseSchema = z.array(leaderBoardEntity); -export type LeaderBoardEntity = z.infer; -export type LeaderBoardData = z.infer; - -export function useLeaderboardDetails(first?: number) { - const { - filterParams: { chainId }, - } = useLeaderboardSearch(); - - return useQuery({ - queryFn: async () => { - if (chainId === -1) { - return []; - } - - const { data } = await httpService.get(apiPaths.leaderboardDetails.path, { - params: { chainId, first }, - }); - - const validResponse = validateResponse( - data, - leaderBoardSuccessResponseSchema - ); - - return validResponse; - }, - queryKey: ['useLeaderboardDetails', chainId, first], - }); -} From 6f765060781c02a26ab38185e734f951ee9b917b Mon Sep 17 00:00:00 2001 From: kirill Date: Tue, 17 Jun 2025 17:43:32 +0300 Subject: [PATCH 05/27] fix: casing --- packages/apps/dashboard/client/src/app/AppRoutes.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/apps/dashboard/client/src/app/AppRoutes.tsx b/packages/apps/dashboard/client/src/app/AppRoutes.tsx index 70c7731371..a5f31e0999 100644 --- a/packages/apps/dashboard/client/src/app/AppRoutes.tsx +++ b/packages/apps/dashboard/client/src/app/AppRoutes.tsx @@ -2,8 +2,8 @@ import { FC } from 'react'; import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; -import GraphPage from '@/pages/Graph'; -import HomePage from '@/pages/Home'; +import GraphPage from '@/pages/graph'; +import HomePage from '@/pages/home'; import LeaderboardPage from '@/pages/leaderboard'; import SearchResultsPage from '@/pages/SearchResults'; From 14abd8a1d9256f03c8fc0d79483167738527c9d2 Mon Sep 17 00:00:00 2001 From: kirill Date: Tue, 17 Jun 2025 18:27:10 +0300 Subject: [PATCH 06/27] test: remove graph and home page folders --- .../dashboard/client/src/app/AppRoutes.tsx | 8 +- .../dashboard/client/src/pages/Graph/index.ts | 1 - .../client/src/pages/Graph/ui/GraphPage.tsx | 23 --- .../dashboard/client/src/pages/Home/index.ts | 1 - .../client/src/pages/Home/ui/HomePage.tsx | 134 ------------------ 5 files changed, 4 insertions(+), 163 deletions(-) delete mode 100644 packages/apps/dashboard/client/src/pages/Graph/index.ts delete mode 100644 packages/apps/dashboard/client/src/pages/Graph/ui/GraphPage.tsx delete mode 100644 packages/apps/dashboard/client/src/pages/Home/index.ts delete mode 100644 packages/apps/dashboard/client/src/pages/Home/ui/HomePage.tsx diff --git a/packages/apps/dashboard/client/src/app/AppRoutes.tsx b/packages/apps/dashboard/client/src/app/AppRoutes.tsx index a5f31e0999..a28d2bbe81 100644 --- a/packages/apps/dashboard/client/src/app/AppRoutes.tsx +++ b/packages/apps/dashboard/client/src/app/AppRoutes.tsx @@ -2,8 +2,8 @@ import { FC } from 'react'; import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; -import GraphPage from '@/pages/graph'; -import HomePage from '@/pages/home'; +// import GraphPage from '@/pages/graph'; +// import HomePage from '@/pages/home'; import LeaderboardPage from '@/pages/leaderboard'; import SearchResultsPage from '@/pages/SearchResults'; @@ -13,9 +13,9 @@ const AppRoutes: FC = () => { return ( - } /> + {/* } /> */} } /> - } /> + {/* } /> */} } /> Not found} /> diff --git a/packages/apps/dashboard/client/src/pages/Graph/index.ts b/packages/apps/dashboard/client/src/pages/Graph/index.ts deleted file mode 100644 index 375e4a10e9..0000000000 --- a/packages/apps/dashboard/client/src/pages/Graph/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ui/GraphPage'; diff --git a/packages/apps/dashboard/client/src/pages/Graph/ui/GraphPage.tsx b/packages/apps/dashboard/client/src/pages/Graph/ui/GraphPage.tsx deleted file mode 100644 index b15d842fa8..0000000000 --- a/packages/apps/dashboard/client/src/pages/Graph/ui/GraphPage.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import { useEffect } from 'react'; - -import { AreaChart } from '@/components/Charts'; -import Breadcrumbs from '@/shared/ui/Breadcrumbs'; -import { useGraphPageChartParams } from '@/utils/hooks/use-graph-page-chart-params'; -import PageWrapper from '@/widgets/page-wrapper'; - -const GraphPage = () => { - const { revertToInitialParams } = useGraphPageChartParams(); - - useEffect(() => { - revertToInitialParams(); - }, [revertToInitialParams]); - - return ( - - - - - ); -}; - -export default GraphPage; diff --git a/packages/apps/dashboard/client/src/pages/Home/index.ts b/packages/apps/dashboard/client/src/pages/Home/index.ts deleted file mode 100644 index 6648d3e441..0000000000 --- a/packages/apps/dashboard/client/src/pages/Home/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ui/HomePage'; diff --git a/packages/apps/dashboard/client/src/pages/Home/ui/HomePage.tsx b/packages/apps/dashboard/client/src/pages/Home/ui/HomePage.tsx deleted file mode 100644 index 945e52098c..0000000000 --- a/packages/apps/dashboard/client/src/pages/Home/ui/HomePage.tsx +++ /dev/null @@ -1,134 +0,0 @@ -import { FC } from 'react'; - -import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; -import Box from '@mui/material/Box'; -import Button from '@mui/material/Button'; -import Divider from '@mui/material/Divider'; -import styled from '@mui/material/styles/styled'; -import Typography from '@mui/material/Typography'; -import Grid from '@mui/material/Unstable_Grid2'; -import { Link } from 'react-router-dom'; - -import GraphSwiper from '@/components/Home/GraphSwiper'; -import SearchBar from '@/components/SearchBar/SearchBar'; -import HmtPrice from '@/features/home/ui/HmtPrice'; -import Holders from '@/features/home/ui/Holders'; -import TotalNumberOfTasks from '@/features/home/ui/TotalNumberOfTasks'; -import TotalTransactions from '@/features/home/ui/TotalTransactions'; -import Leaderboard from '@/features/leaderboard'; -import CustomTooltip from '@/shared/ui/CustomTooltip'; -import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; -import ShadowIcon from '@/shared/ui/ShadowIcon'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; -import PageWrapper from '@/widgets/page-wrapper'; - -const CardWrapper = styled(Grid)(({ theme }) => ({ - display: 'flex', - background: theme.palette.white.main, - borderRadius: '16px', - padding: '24px 32px', - [theme.breakpoints.up('md')]: { - height: 300, - }, - [theme.breakpoints.down('md')]: { - height: 'auto', - }, -})); - -const InfoTooltip = ({ title }: { title: string }) => ( - - - -); - -const renderViewChartsButton = (show: boolean) => { - if (show) { - return ( - - ); - } else { - return null; - } -}; - -const HomePage: FC = () => { - const isMobile = useIsMobile(); - - return ( - - - All HUMAN activity. In one place. - - - - - - Token - - - - - - - - - - - - - - - - - Data Overview (All networks) - - {renderViewChartsButton(!isMobile)} - - - - - - - - - - - - - - - - {renderViewChartsButton(isMobile)} - - - - } - /> - - - ); -}; - -export default HomePage; From 21e70a931d51b28950c76f983d2700439b36b645 Mon Sep 17 00:00:00 2001 From: kirill Date: Tue, 17 Jun 2025 18:35:27 +0300 Subject: [PATCH 07/27] test: getting things back --- .../dashboard/client/src/app/AppRoutes.tsx | 8 +- .../dashboard/client/src/pages/graph/index.ts | 1 + .../client/src/pages/graph/ui/GraphPage.tsx | 23 +++ .../dashboard/client/src/pages/home/index.ts | 1 + .../client/src/pages/home/ui/HomePage.tsx | 134 ++++++++++++++++++ 5 files changed, 163 insertions(+), 4 deletions(-) create mode 100644 packages/apps/dashboard/client/src/pages/graph/index.ts create mode 100644 packages/apps/dashboard/client/src/pages/graph/ui/GraphPage.tsx create mode 100644 packages/apps/dashboard/client/src/pages/home/index.ts create mode 100644 packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx diff --git a/packages/apps/dashboard/client/src/app/AppRoutes.tsx b/packages/apps/dashboard/client/src/app/AppRoutes.tsx index a28d2bbe81..a5f31e0999 100644 --- a/packages/apps/dashboard/client/src/app/AppRoutes.tsx +++ b/packages/apps/dashboard/client/src/app/AppRoutes.tsx @@ -2,8 +2,8 @@ import { FC } from 'react'; import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; -// import GraphPage from '@/pages/graph'; -// import HomePage from '@/pages/home'; +import GraphPage from '@/pages/graph'; +import HomePage from '@/pages/home'; import LeaderboardPage from '@/pages/leaderboard'; import SearchResultsPage from '@/pages/SearchResults'; @@ -13,9 +13,9 @@ const AppRoutes: FC = () => { return ( - {/* } /> */} + } /> } /> - {/* } /> */} + } /> } /> Not found} /> diff --git a/packages/apps/dashboard/client/src/pages/graph/index.ts b/packages/apps/dashboard/client/src/pages/graph/index.ts new file mode 100644 index 0000000000..375e4a10e9 --- /dev/null +++ b/packages/apps/dashboard/client/src/pages/graph/index.ts @@ -0,0 +1 @@ +export { default } from './ui/GraphPage'; diff --git a/packages/apps/dashboard/client/src/pages/graph/ui/GraphPage.tsx b/packages/apps/dashboard/client/src/pages/graph/ui/GraphPage.tsx new file mode 100644 index 0000000000..f2e006d8a3 --- /dev/null +++ b/packages/apps/dashboard/client/src/pages/graph/ui/GraphPage.tsx @@ -0,0 +1,23 @@ +import { useEffect } from 'react'; + +import { AreaChart } from '@/components/Charts'; +import Breadcrumbs from '@/shared/ui/Breadcrumbs'; +import { useGraphPageChartParams } from '@/utils/hooks/use-graph-page-chart-params'; +import PageWrapper from '@/widgets/page-wrapper'; + +const Graph = () => { + const { revertToInitialParams } = useGraphPageChartParams(); + + useEffect(() => { + revertToInitialParams(); + }, [revertToInitialParams]); + + return ( + + + + + ); +}; + +export default Graph; diff --git a/packages/apps/dashboard/client/src/pages/home/index.ts b/packages/apps/dashboard/client/src/pages/home/index.ts new file mode 100644 index 0000000000..6648d3e441 --- /dev/null +++ b/packages/apps/dashboard/client/src/pages/home/index.ts @@ -0,0 +1 @@ +export { default } from './ui/HomePage'; diff --git a/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx new file mode 100644 index 0000000000..945e52098c --- /dev/null +++ b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx @@ -0,0 +1,134 @@ +import { FC } from 'react'; + +import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; +import Box from '@mui/material/Box'; +import Button from '@mui/material/Button'; +import Divider from '@mui/material/Divider'; +import styled from '@mui/material/styles/styled'; +import Typography from '@mui/material/Typography'; +import Grid from '@mui/material/Unstable_Grid2'; +import { Link } from 'react-router-dom'; + +import GraphSwiper from '@/components/Home/GraphSwiper'; +import SearchBar from '@/components/SearchBar/SearchBar'; +import HmtPrice from '@/features/home/ui/HmtPrice'; +import Holders from '@/features/home/ui/Holders'; +import TotalNumberOfTasks from '@/features/home/ui/TotalNumberOfTasks'; +import TotalTransactions from '@/features/home/ui/TotalTransactions'; +import Leaderboard from '@/features/leaderboard'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; +import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; +import ShadowIcon from '@/shared/ui/ShadowIcon'; +import { useIsMobile } from '@/utils/hooks/use-breakpoints'; +import PageWrapper from '@/widgets/page-wrapper'; + +const CardWrapper = styled(Grid)(({ theme }) => ({ + display: 'flex', + background: theme.palette.white.main, + borderRadius: '16px', + padding: '24px 32px', + [theme.breakpoints.up('md')]: { + height: 300, + }, + [theme.breakpoints.down('md')]: { + height: 'auto', + }, +})); + +const InfoTooltip = ({ title }: { title: string }) => ( + + + +); + +const renderViewChartsButton = (show: boolean) => { + if (show) { + return ( + + ); + } else { + return null; + } +}; + +const HomePage: FC = () => { + const isMobile = useIsMobile(); + + return ( + + + All HUMAN activity. In one place. + + + + + + Token + + + + + + + + + + + + + + + + + Data Overview (All networks) + + {renderViewChartsButton(!isMobile)} + + + + + + + + + + + + + + + + {renderViewChartsButton(isMobile)} + + + + } + /> + + + ); +}; + +export default HomePage; From a5db096e5c4df292e427cc2924f58cd14d932e48 Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 13:31:43 +0300 Subject: [PATCH 08/27] refactor: stop using selector inside query hook, simplify escrow table body --- .../tableComponents/EscrowsTableBody.tsx | 43 ++++++------------- .../src/pages/SearchResults/SearchResults.tsx | 5 ++- .../src/services/api/use-address-details.tsx | 11 ++--- 3 files changed, 20 insertions(+), 39 deletions(-) diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx index 2fb9f4a4f8..8fd83bf5fd 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx @@ -1,26 +1,22 @@ -import { useEffect } from 'react'; +import { FC, useEffect } from 'react'; -import { Stack, TableRow } from '@mui/material'; +import { TableRow } from '@mui/material'; import CircularProgress from '@mui/material/CircularProgress'; import Link from '@mui/material/Link'; import MuiTableBody from '@mui/material/TableBody'; import TableCell from '@mui/material/TableCell'; -import { useNavigate } from 'react-router-dom'; import { EscrowsTableBodyContainer } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBodyContainer'; -import { AddressDetailsOperator } from '@/services/api/use-address-details'; import { useEscrowDetails } from '@/services/api/use-escrows-details'; import { handleErrorMessage } from '@/services/handle-error-message'; import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; +type Props = { + role: string; +}; -export const EscrowsTableBody = ({ - role, -}: { - role: AddressDetailsOperator['role']; -}) => { - const navigate = useNavigate(); +export const EscrowsTableBody: FC = ({ role }) => { const { filterParams } = useWalletSearch(); const { data, isPending, isError, error } = useEscrowDetails({ role }); const { @@ -73,28 +69,13 @@ export const EscrowsTableBody = ({ padding: '0 0 24px 0', }} > - { - e.stopPropagation(); - e.preventDefault(); - navigate(`/search/${filterParams.chainId}/${elem.address}`); - }} + - - {elem.address} - - + {elem.address} + ))} diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx index 7adbcf3555..efe6777f05 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx @@ -76,8 +76,11 @@ const ResultError = ({ error }: { error: unknown }) => { }; const Results = () => { - const { data, status, error } = useAddressDetails(); const { filterParams } = useWalletSearch(); + const { data, status, error } = useAddressDetails( + filterParams.chainId, + filterParams.address + ); if (status === 'pending' && !data) { return ; diff --git a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx b/packages/apps/dashboard/client/src/services/api/use-address-details.tsx index becd813da7..613cd1b66f 100644 --- a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx +++ b/packages/apps/dashboard/client/src/services/api/use-address-details.tsx @@ -3,7 +3,6 @@ import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; import { reputationSchema } from '@/features/leaderboard/model/leaderboardSchema'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; import { apiPaths } from '../api-paths'; import { httpService } from '../http-service'; @@ -109,15 +108,12 @@ const addressDetailsResponseSchema = z.object({ export type AddressDetails = z.infer; -export function useAddressDetails() { - const { filterParams } = useWalletSearch(); - +export function useAddressDetails(chainId: number, address: string) { return useQuery({ queryFn: async () => { - const address = filterParams.address || '0x0'; const { data } = await httpService.get( `${apiPaths.addressDetails.path}/${address}`, - { params: { chainId: filterParams.chainId || -1 } } + { params: { chainId: chainId || -1 } } ); const validResponse = validateResponse( @@ -127,6 +123,7 @@ export function useAddressDetails() { return validResponse; }, - queryKey: ['useAddressDetails', filterParams.address, filterParams.chainId], + queryKey: ['useAddressDetails', address, chainId], + enabled: !!chainId && !!address, }); } From f6c6ce957d970b73da26bd655ed754642984cebf Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 13:35:42 +0300 Subject: [PATCH 09/27] fix import after merging --- .../cells/TransactionTableCellValue.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx index ee8a5ecc2f..d96d5f15e7 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx @@ -1,9 +1,9 @@ import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; import Typography from '@mui/material/Typography'; -import CustomTooltip from '@/components/CustomTooltip'; import { formatHMTDecimals } from '@/helpers/formatHMTDecimals'; import { useHMTPrice } from '@/services/api/use-hmt-price'; +import CustomTooltip from '@/shared/ui/CustomTooltip'; const InfoTooltip = ({ title }: { title: string }) => ( From 224dbaf529b59fd80f8ef2e4bde510c761a994a8 Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 14:04:17 +0300 Subject: [PATCH 10/27] specify type --- .../RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx index 8fd83bf5fd..13b58ee6c9 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx @@ -13,7 +13,7 @@ import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; type Props = { - role: string; + role: string | null; }; export const EscrowsTableBody: FC = ({ role }) => { From af5fc1bdc68346ac03a089480c659bfb706609ea Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 18:27:10 +0300 Subject: [PATCH 11/27] refactor: put some hooks in to the shared or to the appropriate feature's internals; improve tsconfig a bit; change pre-commit hook to check tsc as well --- .husky/pre-commit | 2 +- .../client/src/components/Home/SmallGraph.tsx | 2 +- .../src/components/SearchBar/SearchBar.tsx | 41 ++++++++----------- .../client/src/features/home/ui/HmtPrice.tsx | 4 +- .../leaderboard/api/useLeaderboardDetails.ts | 7 +--- .../store/useLeaderboardFiltersStore.ts | 15 +++++++ .../leaderboard/ui/DataGridWrapper.tsx | 2 +- .../features/leaderboard/ui/Leaderboard.tsx | 4 +- .../src/features/leaderboard/ui/RoleCell.tsx | 2 +- .../features/leaderboard/ui/SelectNetwork.tsx | 16 +++----- .../features/leaderboard/ui/useDataGrid.tsx | 9 ++-- .../pages/SearchResults/HmtBalance/index.tsx | 6 +-- .../pages/SearchResults/HmtPrice/index.tsx | 4 +- .../src/pages/SearchResults/KVStore/index.tsx | 4 +- .../RoleDetailsEscrowsTable.tsx | 4 +- .../tableComponents/EscrowsTableBody.tsx | 14 ++++--- .../src/pages/SearchResults/SearchResults.tsx | 18 +++----- .../pages/SearchResults/StakeInfo/index.tsx | 2 +- .../WalletAddress/WalletAddress.tsx | 2 +- .../WalletAddressTransactionsTable.tsx | 4 +- .../cells/TransactionTableCellValue.tsx | 4 +- .../tableComponents/TransactionsTableBody.tsx | 11 +++-- .../client/src/pages/home/ui/HomePage.tsx | 2 +- .../src/services/api/use-escrows-details.tsx | 23 +++++------ .../client/src/services/api/use-hmt-price.tsx | 29 ------------- .../src/services/api/use-kvstore-data.tsx | 12 +++--- .../services/api/use-transaction-details.tsx | 14 +++---- .../api/useFilteredNetworks.ts} | 4 +- .../client/src/shared/api/useHmtPrice.ts | 27 ++++++++++++ .../hooks/useBreakpoints.tsx} | 0 .../src/shared/store/useGlobalFiltersStore.ts | 21 ++++++++++ .../src/utils/hooks/use-leaderboard-search.ts | 22 ---------- .../src/utils/hooks/use-wallet-search.ts | 33 --------------- packages/apps/dashboard/client/tsconfig.json | 4 +- 34 files changed, 167 insertions(+), 201 deletions(-) create mode 100644 packages/apps/dashboard/client/src/features/leaderboard/store/useLeaderboardFiltersStore.ts delete mode 100644 packages/apps/dashboard/client/src/services/api/use-hmt-price.tsx rename packages/apps/dashboard/client/src/{utils/hooks/use-filtered-networks.ts => shared/api/useFilteredNetworks.ts} (92%) create mode 100644 packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts rename packages/apps/dashboard/client/src/{utils/hooks/use-breakpoints.tsx => shared/hooks/useBreakpoints.tsx} (100%) create mode 100644 packages/apps/dashboard/client/src/shared/store/useGlobalFiltersStore.ts delete mode 100644 packages/apps/dashboard/client/src/utils/hooks/use-leaderboard-search.ts delete mode 100644 packages/apps/dashboard/client/src/utils/hooks/use-wallet-search.ts diff --git a/.husky/pre-commit b/.husky/pre-commit index b1dd4d8a8e..631b0a10c1 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1,4 @@ -yarn dlx lint-staged +yarn dlx lint-staged & yarn dlx tsc-files $(git diff --cached --name-only --diff-filter=ACM | grep '\.tsx?$') # Format python file changes cd packages/sdk/python/human-protocol-sdk diff --git a/packages/apps/dashboard/client/src/components/Home/SmallGraph.tsx b/packages/apps/dashboard/client/src/components/Home/SmallGraph.tsx index ba5b9cd44e..284aeda325 100644 --- a/packages/apps/dashboard/client/src/components/Home/SmallGraph.tsx +++ b/packages/apps/dashboard/client/src/components/Home/SmallGraph.tsx @@ -19,7 +19,7 @@ import { import ToggleButtons from '@/components/DataEntry/ToggleButtons'; import { formatDate } from '@/helpers/formatDate'; import { formatNumber } from '@/helpers/formatNumber'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; const CustomSmallChartTooltip = ({ payload, diff --git a/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx b/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx index 5e19a50c5b..6b3ee7f759 100644 --- a/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx +++ b/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx @@ -17,11 +17,11 @@ import IconButton from '@mui/material/IconButton'; import clsx from 'clsx'; import { useNavigate } from 'react-router-dom'; +import useFilteredNetworks from '@/shared/api/useFilteredNetworks'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import CustomTooltip from '@/shared/ui/CustomTooltip'; import { NetworkIcon } from '@/shared/ui/NetworkIcon'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; -import { useFilteredNetworks } from '@/utils/hooks/use-filtered-networks'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; import { isValidEVMAddress } from '../../helpers/isValidEVMAddress'; @@ -46,7 +46,7 @@ const SearchBar: FC = ({ }) => { const isMobile = useIsMobile(); const { filteredNetworks, isLoading } = useFilteredNetworks(); - const { filterParams, setChainId, setAddress } = useWalletSearch(); + const { address, chainId, setChainId, setAddress } = useGlobalFiltersStore(); const navigate = useNavigate(); const [inputValue, setInputValue] = useState(initialInputValue); const [error, setError] = useState(null); @@ -54,18 +54,14 @@ const SearchBar: FC = ({ const theme = useTheme(); useEffect(() => { - setInputValue(filterParams.address); - }, [filterParams.address]); + setInputValue(address); + }, [address]); useEffect(() => { - if ( - !isLoading && - filteredNetworks.length > 0 && - filterParams.chainId === -1 - ) { + if (!isLoading && filteredNetworks.length > 0 && chainId === -1) { setChainId(filteredNetworks[0].id); } - }, [filteredNetworks, isLoading, filterParams.chainId, setChainId]); + }, [filteredNetworks, isLoading, chainId, setChainId]); const navigateToAddress = useCallback(() => { if (!isValidEVMAddress(inputValue)) { @@ -74,8 +70,8 @@ const SearchBar: FC = ({ } setAddress(inputValue); - navigate(`/search/${filterParams.chainId}/${inputValue}`); - }, [inputValue, filterParams.chainId, navigate, setAddress]); + navigate(`/search/${chainId}/${inputValue}`); + }, [inputValue, chainId, navigate, setAddress]); const handleInputChange = (event: React.ChangeEvent) => { const value = event.target.value; @@ -115,15 +111,12 @@ const SearchBar: FC = ({ const renderSelectedValue = ( n.id === filterParams.chainId)?.id || -1 - } + chainId={filteredNetworks.find((n) => n.id === chainId)?.id || -1} />
- {isMobile || filterParams.chainId === -1 + {isMobile || chainId === -1 ? null - : filteredNetworks.find((n) => n.id === filterParams.chainId)?.name || - ''} + : filteredNetworks.find((n) => n.id === chainId)?.name || ''}
); @@ -152,21 +145,19 @@ const SearchBar: FC = ({ sx={startAdornmentInputAdornmentSx(theme)} > - value={filterParams.chainId} + value={chainId} displayEmpty sx={muiSelectSx(theme)} onChange={handleSelectChange} renderValue={() => - filterParams.chainId === -1 - ? renderEmptyValue - : renderSelectedValue + chainId === -1 ? renderEmptyValue : renderSelectedValue } > {filteredNetworks.map((network) => ( diff --git a/packages/apps/dashboard/client/src/features/home/ui/HmtPrice.tsx b/packages/apps/dashboard/client/src/features/home/ui/HmtPrice.tsx index f25361c054..5adbc00b5f 100644 --- a/packages/apps/dashboard/client/src/features/home/ui/HmtPrice.tsx +++ b/packages/apps/dashboard/client/src/features/home/ui/HmtPrice.tsx @@ -1,10 +1,10 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import { useHMTPrice } from '@/services/api/use-hmt-price'; +import useHmtPrice from '@/shared/api/useHmtPrice'; const HmtPrice = () => { - const { data, isError, isPending, isSuccess } = useHMTPrice(); + const { data, isError, isPending, isSuccess } = useHmtPrice(); return ( diff --git a/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts b/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts index faa9ba636a..041cfd5680 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts +++ b/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts @@ -3,15 +3,10 @@ import { useQuery } from '@tanstack/react-query'; import { apiPaths } from '@/services/api-paths'; import { httpService } from '@/services/http-service'; import { validateResponse } from '@/services/validate-response'; -import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; import { leaderboardResponseSchema } from '../model/leaderboardSchema'; -const useLeaderboardDetails = (first?: number) => { - const { - filterParams: { chainId }, - } = useLeaderboardSearch(); - +const useLeaderboardDetails = (chainId: number, first?: number) => { return useQuery({ queryFn: async () => { if (chainId === -1) { diff --git a/packages/apps/dashboard/client/src/features/leaderboard/store/useLeaderboardFiltersStore.ts b/packages/apps/dashboard/client/src/features/leaderboard/store/useLeaderboardFiltersStore.ts new file mode 100644 index 0000000000..7b8d2b28c5 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/leaderboard/store/useLeaderboardFiltersStore.ts @@ -0,0 +1,15 @@ +import { create } from 'zustand'; + +type LeaderboardFiltersStore = { + chainId: number; + setChainId: (chainId: number) => void; +}; + +const useLeaderboardFiltersStore = create((set) => ({ + chainId: -1, + setChainId: (chainId) => { + set({ chainId }); + }, +})); + +export default useLeaderboardFiltersStore; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx index 388ef0ee1d..1bbfade008 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx @@ -4,8 +4,8 @@ import { Box, Typography } from '@mui/material'; import { DataGrid } from '@mui/x-data-grid'; import { handleErrorMessage } from '@/services/handle-error-message'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import Loader from '@/shared/ui/Loader'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import { LeaderboardData } from '../model/leaderboardSchema'; import useDataGrid from '../ui/useDataGrid'; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/Leaderboard.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/Leaderboard.tsx index d5896a0700..baea7f9a8b 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/Leaderboard.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/Leaderboard.tsx @@ -5,6 +5,7 @@ import Button from '@mui/material/Button'; import { useNavigate } from 'react-router-dom'; import useLeaderboardDetails from '../api/useLeaderboardDetails'; +import useLeaderboardFiltersStore from '../store/useLeaderboardFiltersStore'; import DataGridWrapper from './DataGridWrapper'; import SelectNetwork from './SelectNetwork'; @@ -16,7 +17,8 @@ type Props = { const Leaderboard: FC = ({ viewAllBanner, first }) => { const navigate = useNavigate(); - const { data, status, error } = useLeaderboardDetails(first); + const { chainId } = useLeaderboardFiltersStore(); + const { data, status, error } = useLeaderboardDetails(chainId, first); return ( { - const { - setChainId, - filterParams: { chainId }, - } = useLeaderboardSearch(); +import useLeaderboardFiltersStore from '../store/useLeaderboardFiltersStore'; +const SelectNetwork = () => { + const { chainId, setChainId } = useLeaderboardFiltersStore(); const { filteredNetworks, isLoading } = useFilteredNetworks(); + const isMobile = useIsMobile(); useEffect(() => { if (chainId === -1 && filteredNetworks.length > 0) { @@ -26,8 +24,6 @@ const SelectNetwork = () => { } }, [chainId, filteredNetworks, setChainId]); - const isMobile = useIsMobile(); - const handleChange = (event: SelectChangeEvent) => { const value = Number(event.target.value); setChainId(value); diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx index 643606c985..535e292f17 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx @@ -4,11 +4,11 @@ import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; import { Box, Typography } from '@mui/material'; import { GridColDef, GridRenderCellParams } from '@mui/x-data-grid'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import CustomTooltip from '@/shared/ui/CustomTooltip'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; -import { useLeaderboardSearch } from '@/utils/hooks/use-leaderboard-search'; import { LeaderboardData } from '../model/leaderboardSchema'; +import useLeaderboardFiltersStore from '../store/useLeaderboardFiltersStore'; import AddressCell from './AddressCell'; import CategoryCell from './CategoryCell'; @@ -28,10 +28,7 @@ const InfoTooltip = ({ title }: { title: string }) => ( ); const useDataGrid = (data: LeaderboardData) => { - const { - filterParams: { chainId }, - } = useLeaderboardSearch(); - + const { chainId } = useLeaderboardFiltersStore(); const isMobile = useIsMobile(); const formattedData = useMemo(() => { diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/HmtBalance/index.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/HmtBalance/index.tsx index 00c25526e7..abcb587b2a 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/HmtBalance/index.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/HmtBalance/index.tsx @@ -4,15 +4,15 @@ import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; import { NumericFormat } from 'react-number-format'; -import { useHMTPrice } from '@/services/api/use-hmt-price'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; +import useHmtPrice from '@/shared/api/useHmtPrice'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; type Props = { balance?: number | null; }; const HmtBalance: FC = ({ balance }) => { - const { data, isError, isPending } = useHMTPrice(); + const { data, isError, isPending } = useHmtPrice(); const isMobile = useIsMobile(); if (isError) { diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/HmtPrice/index.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/HmtPrice/index.tsx index f32c458493..be07a28276 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/HmtPrice/index.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/HmtPrice/index.tsx @@ -1,9 +1,9 @@ import { Typography, Stack } from '@mui/material'; -import { useHMTPrice } from '@/services/api/use-hmt-price'; +import useHmtPrice from '@/shared/api/useHmtPrice'; const HmtPrice = () => { - const { data, isError, isPending, isSuccess } = useHMTPrice(); + const { data, isError, isPending, isSuccess } = useHmtPrice(); return ( diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx index d5c39210e5..2dfd630720 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx @@ -7,10 +7,12 @@ import TableRow from '@mui/material/TableRow'; import Typography from '@mui/material/Typography'; import useKvstoreData from '@/services/api/use-kvstore-data'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import SectionWrapper from '@/shared/ui/SectionWrapper'; const KVStore = () => { - const { data } = useKvstoreData(); + const { chainId, address } = useGlobalFiltersStore(); + const { data } = useKvstoreData(chainId, address); if (data?.length === 0) { return null; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx index cd4ef79fa5..9c2ae5af72 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx @@ -10,11 +10,13 @@ import Typography from '@mui/material/Typography'; import { EscrowsTableBody } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody'; import { useEscrowDetails } from '@/services/api/use-escrows-details'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import SectionWrapper from '@/shared/ui/SectionWrapper'; import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; export const RoleDetailsEscrowsTable = ({ role }: { role: string | null }) => { - const { data } = useEscrowDetails({ role }); + const { chainId, address } = useGlobalFiltersStore(); + const { data } = useEscrowDetails(role, chainId, address); const { pagination: { page, pageSize, lastPageIndex }, setPageSize, diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx index 13b58ee6c9..eb68bdc0e8 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx @@ -9,16 +9,20 @@ import TableCell from '@mui/material/TableCell'; import { EscrowsTableBodyContainer } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBodyContainer'; import { useEscrowDetails } from '@/services/api/use-escrows-details'; import { handleErrorMessage } from '@/services/handle-error-message'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; type Props = { role: string | null; }; export const EscrowsTableBody: FC = ({ role }) => { - const { filterParams } = useWalletSearch(); - const { data, isPending, isError, error } = useEscrowDetails({ role }); + const { chainId, address } = useGlobalFiltersStore(); + const { data, isPending, isError, error } = useEscrowDetails( + role, + chainId, + address + ); const { setLastPageIndex, setPrevPage, @@ -34,7 +38,7 @@ export const EscrowsTableBody: FC = ({ role }) => { useEffect(() => { setLastPageIndex(undefined); - }, [filterParams.address, filterParams.chainId, setLastPageIndex]); + }, [address, chainId, setLastPageIndex]); if (isPending) { return ( @@ -71,7 +75,7 @@ export const EscrowsTableBody: FC = ({ role }) => { > {elem.address} diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx index efe6777f05..a59f7080e3 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx @@ -14,6 +14,7 @@ import { useAddressDetails, } from '@/services/api/use-address-details'; import { handleErrorMessage } from '@/services/handle-error-message'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import Breadcrumbs from '@/shared/ui/Breadcrumbs'; import EscrowAddressIcon from '@/shared/ui/icons/EscrowAddressIcon'; import WalletIcon from '@/shared/ui/icons/WalletIcon'; @@ -21,7 +22,6 @@ import Loader from '@/shared/ui/Loader'; import NothingFound from '@/shared/ui/NothingFound'; import ShadowIcon from '@/shared/ui/ShadowIcon'; import { getNetwork } from '@/utils/config/networks'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; import PageWrapper from '@/widgets/page-wrapper'; import { WalletAddressTransactionsTable } from './WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable'; @@ -76,11 +76,9 @@ const ResultError = ({ error }: { error: unknown }) => { }; const Results = () => { - const { filterParams } = useWalletSearch(); - const { data, status, error } = useAddressDetails( - filterParams.chainId, - filterParams.address - ); + const { address, chainId } = useGlobalFiltersStore(); + + const { data, status, error } = useAddressDetails(chainId, address); if (status === 'pending' && !data) { return ; @@ -105,7 +103,7 @@ const Results = () => { gap={{ xs: 1, md: 3 }} alignItems={{ xs: 'stretch', md: 'center' }} > - {renderCurrentResultType(data, filterParams.address)} + {renderCurrentResultType(data, address)} {data.operator && data.operator.role ? ( @@ -127,11 +125,7 @@ enum ParamsStatus { const SearchResults = () => { const location = useLocation(); const { chainId: urlChainId, address: urlAddress } = useParams(); - const { - setAddress, - setChainId, - filterParams: { chainId, address }, - } = useWalletSearch(); + const { chainId, address, setAddress, setChainId } = useGlobalFiltersStore(); const [paramsStatus, setParamsStatus] = useState( ParamsStatus.LOADING diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx index 268c3d2ef3..299e753836 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx @@ -4,8 +4,8 @@ import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; import { NumericFormat } from 'react-number-format'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import SectionWrapper from '@/shared/ui/SectionWrapper'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; type Props = { amountStaked?: number | null; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx index 9e3891a9de..433fe2eb98 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx @@ -9,8 +9,8 @@ import { AddressDetailsOperator, AddressDetailsWallet, } from '@/services/api/use-address-details'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import SectionWrapper from '@/shared/ui/SectionWrapper'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import HmtBalance from '../HmtBalance'; import HmtPrice from '../HmtPrice'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx index aaa39ed496..bc3b20a273 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx @@ -11,11 +11,13 @@ import SimpleBar from 'simplebar-react'; import { TransactionsTableBody } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody'; import { TransactionsTableHead } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead'; import { useTransactionDetails } from '@/services/api/use-transaction-details'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import SectionWrapper from '@/shared/ui/SectionWrapper'; import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; export const WalletAddressTransactionsTable = () => { - const { data } = useTransactionDetails(); + const { chainId, address } = useGlobalFiltersStore(); + const { data } = useTransactionDetails(chainId, address); const { pagination: { page, pageSize, lastPageIndex }, setPageSize, diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx index d96d5f15e7..f7b3df9364 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx @@ -2,7 +2,7 @@ import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; import Typography from '@mui/material/Typography'; import { formatHMTDecimals } from '@/helpers/formatHMTDecimals'; -import { useHMTPrice } from '@/services/api/use-hmt-price'; +import useHmtPrice from '@/shared/api/useHmtPrice'; import CustomTooltip from '@/shared/ui/CustomTooltip'; const InfoTooltip = ({ title }: { title: string }) => ( @@ -23,7 +23,7 @@ export const TransactionTableCellValue = ({ value: string; method: string; }) => { - const { isError, isPending } = useHMTPrice(); + const { isError, isPending } = useHmtPrice(); if (isError) { return N/A; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx index 97918458a6..8e8df53e3d 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx @@ -15,13 +15,16 @@ import { TransactionTableCellValue } from '@/pages/SearchResults/WalletAddress/W import { TransactionsTableBodyContainer } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBodyContainer'; import { useTransactionDetails } from '@/services/api/use-transaction-details'; import { handleErrorMessage } from '@/services/handle-error-message'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; export const TransactionsTableBody: React.FC = () => { - const { data, isPending, isError, error } = useTransactionDetails(); - const { filterParams } = useWalletSearch(); + const { chainId, address } = useGlobalFiltersStore(); + const { data, isPending, isError, error } = useTransactionDetails( + chainId, + address + ); const { setLastPageIndex, setPrevPage, @@ -37,7 +40,7 @@ export const TransactionsTableBody: React.FC = () => { useEffect(() => { setLastPageIndex(undefined); - }, [filterParams.address, filterParams.chainId, setLastPageIndex]); + }, [address, chainId, setLastPageIndex]); const [expandedRows, setExpandedRows] = useState>({}); diff --git a/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx index 945e52098c..3d0b3b1fa6 100644 --- a/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx +++ b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx @@ -16,10 +16,10 @@ import Holders from '@/features/home/ui/Holders'; import TotalNumberOfTasks from '@/features/home/ui/TotalNumberOfTasks'; import TotalTransactions from '@/features/home/ui/TotalTransactions'; import Leaderboard from '@/features/leaderboard'; +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import CustomTooltip from '@/shared/ui/CustomTooltip'; import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; import ShadowIcon from '@/shared/ui/ShadowIcon'; -import { useIsMobile } from '@/utils/hooks/use-breakpoints'; import PageWrapper from '@/widgets/page-wrapper'; const CardWrapper = styled(Grid)(({ theme }) => ({ diff --git a/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx b/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx index 8a0ac01e07..30e4e31c4e 100644 --- a/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx +++ b/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx @@ -4,7 +4,6 @@ import { z } from 'zod'; import { AddressDetailsOperator } from '@/services/api/use-address-details'; import { validateResponse } from '@/services/validate-response'; import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; import { apiPaths } from '../api-paths'; import { httpService } from '../http-service'; @@ -38,12 +37,11 @@ export interface PaginatedEscrowsDetailsDto { role: AddressDetailsOperator['role']; } -export function useEscrowDetails({ - role, -}: { - role: AddressDetailsOperator['role']; -}) { - const { filterParams } = useWalletSearch(); +export function useEscrowDetails( + role: string | null, + chainId: number, + address: string +) { const { setLastPageIndex, pagination: { page, lastPageIndex }, @@ -51,16 +49,16 @@ export function useEscrowDetails({ } = useEscrowDetailsDto(); const dto: PaginatedEscrowsDetailsDto = { - chainId: filterParams.chainId, + chainId, + role, skip: params.skip, first: params.first, - role, }; return useQuery({ queryFn: async () => { const { data } = await httpService.get( - `${apiPaths.escrowDetails.path}/${filterParams.address}`, + `${apiPaths.escrowDetails.path}/${address}`, { params: dto, } @@ -74,7 +72,7 @@ export function useEscrowDetails({ // check if last page if (lastPageIndex === undefined) { const { data: lastPageCheckData } = await httpService.get( - `${apiPaths.escrowDetails.path}/${filterParams.address}`, + `${apiPaths.escrowDetails.path}/${address}`, { params: { ...dto, @@ -95,6 +93,7 @@ export function useEscrowDetails({ return validResponse; }, - queryKey: ['useEscrowDetails', filterParams.address, dto], + queryKey: ['useEscrowDetails', address, dto], + enabled: !!chainId && !!address, }); } diff --git a/packages/apps/dashboard/client/src/services/api/use-hmt-price.tsx b/packages/apps/dashboard/client/src/services/api/use-hmt-price.tsx deleted file mode 100644 index c3427cdeeb..0000000000 --- a/packages/apps/dashboard/client/src/services/api/use-hmt-price.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import { useQuery } from '@tanstack/react-query'; -import { z } from 'zod'; - -import { validateResponse } from '@/services/validate-response'; - -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; - -const successHMTPriceResponseSchema = z.object({ - hmtPrice: z.number(), -}); - -export type HMTPrice = z.infer; - -export function useHMTPrice() { - return useQuery({ - queryFn: async () => { - const { data } = await httpService.get(apiPaths.statsHmtPrice.path); - - const validResponse = validateResponse( - data, - successHMTPriceResponseSchema - ); - - return validResponse.hmtPrice; - }, - queryKey: ['useHMTPrice'], - }); -} diff --git a/packages/apps/dashboard/client/src/services/api/use-kvstore-data.tsx b/packages/apps/dashboard/client/src/services/api/use-kvstore-data.tsx index bbc26e77f0..f9989b50ac 100644 --- a/packages/apps/dashboard/client/src/services/api/use-kvstore-data.tsx +++ b/packages/apps/dashboard/client/src/services/api/use-kvstore-data.tsx @@ -4,7 +4,6 @@ import { z } from 'zod'; import { apiPaths } from '@/services/api-paths'; import { httpService } from '@/services/http-service'; import { validateResponse } from '@/services/validate-response'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; const kvstoreDataSchema = z.array( z.object({ @@ -15,21 +14,20 @@ const kvstoreDataSchema = z.array( export type KvstoreData = z.infer; -const useKvstoreData = () => { - const { filterParams } = useWalletSearch(); - +const useKvstoreData = (chainId: number, address: string) => { return useQuery({ - queryKey: ['kvstoreData', filterParams.address], + queryKey: ['kvstoreData', address], queryFn: async () => { const { data } = await httpService.get( - `${apiPaths.kvstore.path}/${filterParams.address}`, - { params: { chain_id: filterParams.chainId || -1 } } + `${apiPaths.kvstore.path}/${address}`, + { params: { chain_id: chainId || -1 } } ); const validResponse = validateResponse(data, kvstoreDataSchema); return validResponse; }, + enabled: !!chainId && !!address, }); }; diff --git a/packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx b/packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx index b4f2fe453c..9a9aabb205 100644 --- a/packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx +++ b/packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx @@ -3,7 +3,6 @@ import { z } from 'zod'; import { validateResponse } from '@/services/validate-response'; import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; -import { useWalletSearch } from '@/utils/hooks/use-wallet-search'; import { apiPaths } from '../api-paths'; import { httpService } from '../http-service'; @@ -17,6 +16,7 @@ const internalTransactionSchema = z.object({ escrow: z.string().nullable(), token: z.string().nullable(), }); + const transactionDetailsSuccessResponseSchema = z.object({ txHash: z.string(), method: z.string(), @@ -50,8 +50,7 @@ export interface PaginatedTransactionDetailsDto { chainId: number; } -export function useTransactionDetails() { - const { filterParams } = useWalletSearch(); +export function useTransactionDetails(chainId: number, address: string) { const { params, pagination: { lastPageIndex, page }, @@ -59,7 +58,7 @@ export function useTransactionDetails() { } = useTransactionDetailsDto(); const dto: PaginatedTransactionDetailsDto = { - chainId: filterParams.chainId, + chainId, skip: params.skip, first: params.first, }; @@ -67,7 +66,7 @@ export function useTransactionDetails() { return useQuery({ queryFn: async () => { const { data } = await httpService.get( - `${apiPaths.transactionDetails.path}/${filterParams.address}`, + `${apiPaths.transactionDetails.path}/${address}`, { params: dto, } @@ -81,7 +80,7 @@ export function useTransactionDetails() { // check if last page if (lastPageIndex === undefined) { const { data: lastPageCheckData } = await httpService.get( - `${apiPaths.transactionDetails.path}/${filterParams.address}`, + `${apiPaths.transactionDetails.path}/${address}`, { params: { ...dto, @@ -102,6 +101,7 @@ export function useTransactionDetails() { return validResponse; }, - queryKey: ['useTransactionDetails', filterParams.address, dto], + queryKey: ['useTransactionDetails', address, dto], + enabled: !!chainId && !!address, }); } diff --git a/packages/apps/dashboard/client/src/utils/hooks/use-filtered-networks.ts b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts similarity index 92% rename from packages/apps/dashboard/client/src/utils/hooks/use-filtered-networks.ts rename to packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts index 3cc624434e..118c66727b 100644 --- a/packages/apps/dashboard/client/src/utils/hooks/use-filtered-networks.ts +++ b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts @@ -9,7 +9,7 @@ import { networks as allNetworks } from '@/utils/config/networks'; const enabledChainsSchema = z.array(z.number()); -export const useFilteredNetworks = () => { +const useFilteredNetworks = () => { const { data: enabledChains, isLoading, @@ -30,3 +30,5 @@ export const useFilteredNetworks = () => { return { filteredNetworks, isLoading, error }; }; + +export default useFilteredNetworks; diff --git a/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts b/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts new file mode 100644 index 0000000000..29c4779a08 --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts @@ -0,0 +1,27 @@ +import { useQuery } from '@tanstack/react-query'; +import { z } from 'zod'; + +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; +import { validateResponse } from '@/services/validate-response'; + +const hmtPriceResponseSchema = z.object({ + hmtPrice: z.number(), +}); + +export type HmtPrice = z.infer; + +const useHmtPrice = () => { + return useQuery({ + queryFn: async () => { + const { data } = await httpService.get(apiPaths.statsHmtPrice.path); + + const validResponse = validateResponse(data, hmtPriceResponseSchema); + + return validResponse.hmtPrice; + }, + queryKey: ['useHmtPrice'], + }); +}; + +export default useHmtPrice; diff --git a/packages/apps/dashboard/client/src/utils/hooks/use-breakpoints.tsx b/packages/apps/dashboard/client/src/shared/hooks/useBreakpoints.tsx similarity index 100% rename from packages/apps/dashboard/client/src/utils/hooks/use-breakpoints.tsx rename to packages/apps/dashboard/client/src/shared/hooks/useBreakpoints.tsx diff --git a/packages/apps/dashboard/client/src/shared/store/useGlobalFiltersStore.ts b/packages/apps/dashboard/client/src/shared/store/useGlobalFiltersStore.ts new file mode 100644 index 0000000000..0bfeef257c --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/store/useGlobalFiltersStore.ts @@ -0,0 +1,21 @@ +import { create } from 'zustand'; + +type GlobalFiltersStore = { + address: string; + chainId: number; + setAddress: (address: string) => void; + setChainId: (chainId: number) => void; +}; + +const useGlobalFiltersStore = create((set) => ({ + address: '', + chainId: -1, + setAddress: (address) => { + set({ address }); + }, + setChainId: (chainId) => { + set({ chainId }); + }, +})); + +export default useGlobalFiltersStore; diff --git a/packages/apps/dashboard/client/src/utils/hooks/use-leaderboard-search.ts b/packages/apps/dashboard/client/src/utils/hooks/use-leaderboard-search.ts deleted file mode 100644 index f470ac22b9..0000000000 --- a/packages/apps/dashboard/client/src/utils/hooks/use-leaderboard-search.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { create } from 'zustand'; - -export interface LeaderboardSearchStore { - filterParams: { - chainId: number; - }; - setChainId: (chainId: number) => void; -} - -export const useLeaderboardSearch = create((set) => ({ - filterParams: { - chainId: -1, - }, - setChainId: (chainId) => { - set((state) => ({ - filterParams: { - ...state.filterParams, - chainId, - }, - })); - }, -})); diff --git a/packages/apps/dashboard/client/src/utils/hooks/use-wallet-search.ts b/packages/apps/dashboard/client/src/utils/hooks/use-wallet-search.ts deleted file mode 100644 index 6ff0ec5092..0000000000 --- a/packages/apps/dashboard/client/src/utils/hooks/use-wallet-search.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { create } from 'zustand'; - -export interface WalletSearchStore { - filterParams: { - address: string; - chainId: number; - }; - setAddress: (address: string) => void; - setChainId: (chainId: number) => void; -} - -export const useWalletSearch = create((set) => ({ - filterParams: { - address: '', - chainId: -1, - }, - setAddress: (address) => { - set((state) => ({ - filterParams: { - ...state.filterParams, - address, - }, - })); - }, - setChainId: (chainId) => { - set((state) => ({ - filterParams: { - ...state.filterParams, - chainId, - }, - })); - }, -})); diff --git a/packages/apps/dashboard/client/tsconfig.json b/packages/apps/dashboard/client/tsconfig.json index e3e56d6ef4..6b867f9387 100644 --- a/packages/apps/dashboard/client/tsconfig.json +++ b/packages/apps/dashboard/client/tsconfig.json @@ -3,7 +3,7 @@ "target": "ES2022", "useDefineForClassFields": true, "lib": ["ES2022", "DOM", "DOM.Iterable"], - "module": "ESNext", + "module": "ES2022", "skipLibCheck": true, /* Bundler mode */ @@ -12,7 +12,7 @@ "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, - "jsx": "react-jsx", + "jsx": "preserve", /* Linting */ "strict": true, From ef0cb5083173277702b986049eb8835e97d93943 Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 18:29:40 +0300 Subject: [PATCH 12/27] revert pre-commit change --- .husky/pre-commit | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.husky/pre-commit b/.husky/pre-commit index 631b0a10c1..b1dd4d8a8e 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1,4 @@ -yarn dlx lint-staged & yarn dlx tsc-files $(git diff --cached --name-only --diff-filter=ACM | grep '\.tsx?$') +yarn dlx lint-staged # Format python file changes cd packages/sdk/python/human-protocol-sdk From e0d940f7eff0a41fa54f200523f18efb87f1385b Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 18:50:17 +0300 Subject: [PATCH 13/27] test: add tsc to lint-staged --- packages/apps/dashboard/client/package.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/apps/dashboard/client/package.json b/packages/apps/dashboard/client/package.json index 0e7b7392cd..c383170611 100644 --- a/packages/apps/dashboard/client/package.json +++ b/packages/apps/dashboard/client/package.json @@ -13,7 +13,8 @@ "lint:fix": "eslint . --fix", "preview": "vite preview", "vercel-build": "yarn workspace human-protocol build:libs && yarn build", - "test": "exit 0" + "test": "exit 0", + "tsc": "tsc --noEmit" }, "dependencies": { "@emotion/react": "^11.11.4", @@ -66,6 +67,7 @@ }, "lint-staged": { "*.{ts,tsx}": [ + "tsc --project tsconfig.json", "prettier --write", "eslint --fix" ] From e43cb4a41e5367da07fbd674dc28364777bbecd9 Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 19:11:01 +0300 Subject: [PATCH 14/27] test on changed files --- .husky/pre-commit | 2 +- packages/apps/dashboard/client/package.json | 1 - .../client/src/pages/SearchResults/SearchResults.tsx | 4 +--- .../client/src/services/api/use-address-details.tsx | 6 ++++-- 4 files changed, 6 insertions(+), 7 deletions(-) diff --git a/.husky/pre-commit b/.husky/pre-commit index b1dd4d8a8e..649b880b80 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1,4 @@ -yarn dlx lint-staged +yarn dlx lint-staged & yarn workspace @human-protocol/dashboard-client tsc --noEmit --skipLibCheck # Format python file changes cd packages/sdk/python/human-protocol-sdk diff --git a/packages/apps/dashboard/client/package.json b/packages/apps/dashboard/client/package.json index c383170611..e6e4a9915d 100644 --- a/packages/apps/dashboard/client/package.json +++ b/packages/apps/dashboard/client/package.json @@ -67,7 +67,6 @@ }, "lint-staged": { "*.{ts,tsx}": [ - "tsc --project tsconfig.json", "prettier --write", "eslint --fix" ] diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx index a59f7080e3..94b2e313be 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx @@ -9,9 +9,8 @@ import SearchBar from '@/components/SearchBar/SearchBar'; import EscrowAddress from '@/pages/SearchResults/EscrowAddress'; import RoleDetails from '@/pages/SearchResults/RoleDetails/RoleDetails'; import WalletAddress from '@/pages/SearchResults/WalletAddress'; -import { +import useAddressDetails, { AddressDetails, - useAddressDetails, } from '@/services/api/use-address-details'; import { handleErrorMessage } from '@/services/handle-error-message'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; @@ -77,7 +76,6 @@ const ResultError = ({ error }: { error: unknown }) => { const Results = () => { const { address, chainId } = useGlobalFiltersStore(); - const { data, status, error } = useAddressDetails(chainId, address); if (status === 'pending' && !data) { diff --git a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx b/packages/apps/dashboard/client/src/services/api/use-address-details.tsx index 613cd1b66f..92201043a4 100644 --- a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx +++ b/packages/apps/dashboard/client/src/services/api/use-address-details.tsx @@ -108,7 +108,7 @@ const addressDetailsResponseSchema = z.object({ export type AddressDetails = z.infer; -export function useAddressDetails(chainId: number, address: string) { +const useAddressDetails = (chainId: number, address: string) => { return useQuery({ queryFn: async () => { const { data } = await httpService.get( @@ -126,4 +126,6 @@ export function useAddressDetails(chainId: number, address: string) { queryKey: ['useAddressDetails', address, chainId], enabled: !!chainId && !!address, }); -} +}; + +export default useAddressDetails; From 670bf0a6415531e5ac4ae16782e4a3d3f4218900 Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 19:36:27 +0300 Subject: [PATCH 15/27] testing without pre-commit, but with lintstagedrc --- .husky/pre-commit | 2 +- packages/apps/dashboard/client/.lintstagedrc.js | 7 +++++++ packages/apps/dashboard/client/package.json | 6 ------ 3 files changed, 8 insertions(+), 7 deletions(-) create mode 100644 packages/apps/dashboard/client/.lintstagedrc.js diff --git a/.husky/pre-commit b/.husky/pre-commit index 649b880b80..b1dd4d8a8e 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1,4 @@ -yarn dlx lint-staged & yarn workspace @human-protocol/dashboard-client tsc --noEmit --skipLibCheck +yarn dlx lint-staged # Format python file changes cd packages/sdk/python/human-protocol-sdk diff --git a/packages/apps/dashboard/client/.lintstagedrc.js b/packages/apps/dashboard/client/.lintstagedrc.js new file mode 100644 index 0000000000..9d97e5d6f0 --- /dev/null +++ b/packages/apps/dashboard/client/.lintstagedrc.js @@ -0,0 +1,7 @@ +export default { + "*.{ts,tsx}": [ + () => "tsc --skipLibCheck --noEmit", + "prettier --write", + "eslint --cache --fix", + ], +}; \ No newline at end of file diff --git a/packages/apps/dashboard/client/package.json b/packages/apps/dashboard/client/package.json index e6e4a9915d..1f6a5c5702 100644 --- a/packages/apps/dashboard/client/package.json +++ b/packages/apps/dashboard/client/package.json @@ -64,11 +64,5 @@ "typescript": "^5.6.3", "typescript-eslint": "^8.33.0", "vite": "^6.2.4" - }, - "lint-staged": { - "*.{ts,tsx}": [ - "prettier --write", - "eslint --fix" - ] } } From 461bceba3fe724e0a99139bdbe0f667a9292d49b Mon Sep 17 00:00:00 2001 From: kirill Date: Wed, 18 Jun 2025 19:39:00 +0300 Subject: [PATCH 16/27] feat: add tsc check to the lint script --- packages/apps/dashboard/client/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/apps/dashboard/client/package.json b/packages/apps/dashboard/client/package.json index 1f6a5c5702..860fa97a01 100644 --- a/packages/apps/dashboard/client/package.json +++ b/packages/apps/dashboard/client/package.json @@ -9,7 +9,7 @@ "clean": "tsc --build --clean && rm -rf dist", "start": "vite", "build": "tsc --build && vite build", - "lint": "eslint . --report-unused-disable-directives --max-warnings 0", + "lint": "tsc --noEmit --skipLibCheck && eslint . --report-unused-disable-directives --max-warnings 0", "lint:fix": "eslint . --fix", "preview": "vite preview", "vercel-build": "yarn workspace human-protocol build:libs && yarn build", From 80ad94f392fffdd5ff8c670c4161f01c76a26405 Mon Sep 17 00:00:00 2001 From: kirill Date: Thu, 19 Jun 2025 13:45:03 +0300 Subject: [PATCH 17/27] refactor: search results and its ui dumb components and api --- .../client/src/components/Clipboard/index.ts | 1 - .../src/components/SearchResults/index.ts | 1 - .../searchResults/api/useAddressDetails.ts | 29 +++ .../searchResults/api/useKvStoreData.ts} | 10 +- .../src/features/searchResults/index.ts | 1 + .../model/addressDetailsSchema.ts} | 29 +-- .../searchResults/model/kvStoreDataSchema.ts | 10 + .../searchResults/ui}/Clipboard.tsx | 8 +- .../searchResults/ui/HmtBalance.tsx} | 0 .../searchResults/ui/HmtPrice.tsx} | 0 .../searchResults/ui/KvStore.tsx} | 3 +- .../searchResults/ui/NothingFound.tsx} | 4 +- .../searchResults/ui/ReputationScore.tsx} | 2 +- .../searchResults/ui/SearchResults.tsx | 170 +++++++++++++++++ .../searchResults/ui/StakeInfo.tsx} | 0 .../searchResults/ui}/TitleSectionWrapper.tsx | 0 .../EscrowAddress/EscrowAddress.tsx | 20 +- .../SearchResults/RoleDetails/RoleDetails.tsx | 23 +-- .../src/pages/SearchResults/SearchResults.tsx | 179 +----------------- .../WalletAddress/WalletAddress.tsx | 15 +- .../client/src/pages/home/ui/HomePage.tsx | 2 +- .../src/services/api/use-escrows-details.tsx | 2 +- .../ui/SearchBar/index.tsx} | 9 +- .../ui/SearchBar/styles.ts} | 0 24 files changed, 261 insertions(+), 257 deletions(-) delete mode 100644 packages/apps/dashboard/client/src/components/Clipboard/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/SearchResults/index.ts create mode 100644 packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts rename packages/apps/dashboard/client/src/{services/api/use-kvstore-data.tsx => features/searchResults/api/useKvStoreData.ts} (79%) create mode 100644 packages/apps/dashboard/client/src/features/searchResults/index.ts rename packages/apps/dashboard/client/src/{services/api/use-address-details.tsx => features/searchResults/model/addressDetailsSchema.ts} (79%) create mode 100644 packages/apps/dashboard/client/src/features/searchResults/model/kvStoreDataSchema.ts rename packages/apps/dashboard/client/src/{components/Clipboard => features/searchResults/ui}/Clipboard.tsx (92%) rename packages/apps/dashboard/client/src/{pages/SearchResults/HmtBalance/index.tsx => features/searchResults/ui/HmtBalance.tsx} (100%) rename packages/apps/dashboard/client/src/{pages/SearchResults/HmtPrice/index.tsx => features/searchResults/ui/HmtPrice.tsx} (100%) rename packages/apps/dashboard/client/src/{pages/SearchResults/KVStore/index.tsx => features/searchResults/ui/KvStore.tsx} (96%) rename packages/apps/dashboard/client/src/{shared/ui/NothingFound/index.tsx => features/searchResults/ui/NothingFound.tsx} (90%) rename packages/apps/dashboard/client/src/{pages/SearchResults/ReputationScore/index.tsx => features/searchResults/ui/ReputationScore.tsx} (95%) create mode 100644 packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx rename packages/apps/dashboard/client/src/{pages/SearchResults/StakeInfo/index.tsx => features/searchResults/ui/StakeInfo.tsx} (100%) rename packages/apps/dashboard/client/src/{components/SearchResults => features/searchResults/ui}/TitleSectionWrapper.tsx (100%) rename packages/apps/dashboard/client/src/{components/SearchBar/SearchBar.tsx => shared/ui/SearchBar/index.tsx} (97%) rename packages/apps/dashboard/client/src/{components/SearchBar/SearchBar.styles.ts => shared/ui/SearchBar/styles.ts} (100%) diff --git a/packages/apps/dashboard/client/src/components/Clipboard/index.ts b/packages/apps/dashboard/client/src/components/Clipboard/index.ts deleted file mode 100644 index cea243dcd0..0000000000 --- a/packages/apps/dashboard/client/src/components/Clipboard/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './Clipboard'; diff --git a/packages/apps/dashboard/client/src/components/SearchResults/index.ts b/packages/apps/dashboard/client/src/components/SearchResults/index.ts deleted file mode 100644 index 46e0669dbc..0000000000 --- a/packages/apps/dashboard/client/src/components/SearchResults/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './TitleSectionWrapper'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts b/packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts new file mode 100644 index 0000000000..6ef23f3745 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts @@ -0,0 +1,29 @@ +import { useQuery } from '@tanstack/react-query'; + +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; +import { validateResponse } from '@/services/validate-response'; + +import { addressDetailsResponseSchema } from '../model/addressDetailsSchema'; + +const useAddressDetails = (chainId: number, address: string) => { + return useQuery({ + queryFn: async () => { + const { data } = await httpService.get( + `${apiPaths.addressDetails.path}/${address}`, + { params: { chainId: chainId || -1 } } + ); + + const validResponse = validateResponse( + data, + addressDetailsResponseSchema + ); + + return validResponse; + }, + queryKey: ['useAddressDetails', address, chainId], + enabled: !!chainId && !!address, + }); +}; + +export default useAddressDetails; diff --git a/packages/apps/dashboard/client/src/services/api/use-kvstore-data.tsx b/packages/apps/dashboard/client/src/features/searchResults/api/useKvStoreData.ts similarity index 79% rename from packages/apps/dashboard/client/src/services/api/use-kvstore-data.tsx rename to packages/apps/dashboard/client/src/features/searchResults/api/useKvStoreData.ts index f9989b50ac..73a769bd92 100644 --- a/packages/apps/dashboard/client/src/services/api/use-kvstore-data.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useKvStoreData.ts @@ -1,18 +1,10 @@ import { useQuery } from '@tanstack/react-query'; -import { z } from 'zod'; import { apiPaths } from '@/services/api-paths'; import { httpService } from '@/services/http-service'; import { validateResponse } from '@/services/validate-response'; -const kvstoreDataSchema = z.array( - z.object({ - key: z.string(), - value: z.string(), - }) -); - -export type KvstoreData = z.infer; +import { kvstoreDataSchema } from '../model/kvStoreDataSchema'; const useKvstoreData = (chainId: number, address: string) => { return useQuery({ diff --git a/packages/apps/dashboard/client/src/features/searchResults/index.ts b/packages/apps/dashboard/client/src/features/searchResults/index.ts new file mode 100644 index 0000000000..5d2cfb86b4 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/index.ts @@ -0,0 +1 @@ +export { default } from './ui/SearchResults'; diff --git a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx b/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts similarity index 79% rename from packages/apps/dashboard/client/src/services/api/use-address-details.tsx rename to packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts index 92201043a4..7a88b9b81e 100644 --- a/packages/apps/dashboard/client/src/services/api/use-address-details.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts @@ -1,13 +1,8 @@ import { Role } from '@human-protocol/sdk'; -import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; import { reputationSchema } from '@/features/leaderboard/model/leaderboardSchema'; -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; -import { validateResponse } from '../validate-response'; - const transformOptionalTokenAmount = ( value: string | undefined | null, ctx: z.RefinementCtx @@ -100,32 +95,10 @@ const operatorSchema = z.object({ export type AddressDetailsOperator = z.infer; -const addressDetailsResponseSchema = z.object({ +export const addressDetailsResponseSchema = z.object({ wallet: z.optional(walletSchema), escrow: z.optional(escrowSchema), operator: z.optional(operatorSchema), }); export type AddressDetails = z.infer; - -const useAddressDetails = (chainId: number, address: string) => { - return useQuery({ - queryFn: async () => { - const { data } = await httpService.get( - `${apiPaths.addressDetails.path}/${address}`, - { params: { chainId: chainId || -1 } } - ); - - const validResponse = validateResponse( - data, - addressDetailsResponseSchema - ); - - return validResponse; - }, - queryKey: ['useAddressDetails', address, chainId], - enabled: !!chainId && !!address, - }); -}; - -export default useAddressDetails; diff --git a/packages/apps/dashboard/client/src/features/searchResults/model/kvStoreDataSchema.ts b/packages/apps/dashboard/client/src/features/searchResults/model/kvStoreDataSchema.ts new file mode 100644 index 0000000000..35c8f60378 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/model/kvStoreDataSchema.ts @@ -0,0 +1,10 @@ +import { z } from 'zod'; + +export const kvstoreDataSchema = z.array( + z.object({ + key: z.string(), + value: z.string(), + }) +); + +export type KvstoreData = z.infer; diff --git a/packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/Clipboard.tsx similarity index 92% rename from packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/Clipboard.tsx index 95d1930eaf..7d4c256570 100644 --- a/packages/apps/dashboard/client/src/components/Clipboard/Clipboard.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/Clipboard.tsx @@ -1,4 +1,4 @@ -import { useState } from 'react'; +import { FC, useState } from 'react'; import ContentCopyIcon from '@mui/icons-material/ContentCopy'; import Card from '@mui/material/Card'; @@ -8,11 +8,11 @@ import Typography from '@mui/material/Typography'; import CustomTooltip from '@/shared/ui/CustomTooltip'; -interface ClipboardProps { +type ClipboardProps = { value: string; -} +}; -const Clipboard = ({ value }: ClipboardProps) => { +const Clipboard: FC = ({ value }) => { const [tooltipOpen, setTooltipOpen] = useState(false); return ( diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/HmtBalance/index.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/HmtBalance.tsx similarity index 100% rename from packages/apps/dashboard/client/src/pages/SearchResults/HmtBalance/index.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/HmtBalance.tsx diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/HmtPrice/index.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/HmtPrice.tsx similarity index 100% rename from packages/apps/dashboard/client/src/pages/SearchResults/HmtPrice/index.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/HmtPrice.tsx diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/KvStore.tsx similarity index 96% rename from packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/KvStore.tsx index 2dfd630720..ea51fc7548 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/KVStore/index.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/KvStore.tsx @@ -6,10 +6,11 @@ import TableHead from '@mui/material/TableHead'; import TableRow from '@mui/material/TableRow'; import Typography from '@mui/material/Typography'; -import useKvstoreData from '@/services/api/use-kvstore-data'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import SectionWrapper from '@/shared/ui/SectionWrapper'; +import useKvstoreData from '../api/useKvStoreData'; + const KVStore = () => { const { chainId, address } = useGlobalFiltersStore(); const { data } = useKvstoreData(chainId, address); diff --git a/packages/apps/dashboard/client/src/shared/ui/NothingFound/index.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/NothingFound.tsx similarity index 90% rename from packages/apps/dashboard/client/src/shared/ui/NothingFound/index.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/NothingFound.tsx index 724fe89541..0eb637f207 100644 --- a/packages/apps/dashboard/client/src/shared/ui/NothingFound/index.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/NothingFound.tsx @@ -1,9 +1,7 @@ -import { FC } from 'react'; - import Link from '@mui/material/Link'; import Typography from '@mui/material/Typography'; -const NothingFound: FC = () => { +const NothingFound = () => { return ( <> Nothing found :( diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/ReputationScore/index.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/ReputationScore.tsx similarity index 95% rename from packages/apps/dashboard/client/src/pages/SearchResults/ReputationScore/index.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/ReputationScore.tsx index 2f2c6f0b8b..6dc9a20c09 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/ReputationScore/index.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/ReputationScore.tsx @@ -11,7 +11,7 @@ type ReputationAttributes = { colors: { title: string; border: string }; }; -export const ReputationScore = ({ reputation }: Props) => { +const ReputationScore = ({ reputation }: Props) => { const theme = useTheme(); const reputationAttributes: Record = { diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx new file mode 100644 index 0000000000..875964a3bc --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx @@ -0,0 +1,170 @@ +import { useEffect, useState } from 'react'; + +import { Stack } from '@mui/material'; +import { AxiosError } from 'axios'; +import { useLocation, useParams } from 'react-router-dom'; + +import EscrowAddress from '@/pages/SearchResults/EscrowAddress'; +import RoleDetails from '@/pages/SearchResults/RoleDetails/RoleDetails'; +import WalletAddress from '@/pages/SearchResults/WalletAddress'; +import { WalletAddressTransactionsTable } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable'; +import { handleErrorMessage } from '@/services/handle-error-message'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; +import EscrowAddressIcon from '@/shared/ui/icons/EscrowAddressIcon'; +import WalletIcon from '@/shared/ui/icons/WalletIcon'; +import Loader from '@/shared/ui/Loader'; +import ShadowIcon from '@/shared/ui/ShadowIcon'; +import { getNetwork } from '@/utils/config/networks'; + +import useAddressDetails from '../api/useAddressDetails'; +import { AddressDetails } from '../model/addressDetailsSchema'; + +import Clipboard from './Clipboard'; +import NothingFound from './NothingFound'; + +enum ParamsStatus { + LOADING = 'loading', + ERROR = 'error', + SUCCESS = 'success', +} + +const renderCurrentResultType = ( + addressDetails: AddressDetails, + tokenId: string | undefined +) => { + const type = Object.keys(addressDetails)[0] as + | keyof AddressDetails + | undefined; + + const renderType: Record< + keyof AddressDetails, + { title: string; icon: JSX.Element } + > = { + operator: { + title: 'Wallet Address', + icon: , + }, + escrow: { + title: 'Escrow Address', + icon: , + }, + wallet: { + title: 'Wallet Address', + icon: , + }, + }; + + if (type == null) { + return null; + } + + return ( + <> + + + + ); +}; + +const ResultError = ({ error }: { error: unknown }) => { + if (error instanceof AxiosError && error.response?.status === 400) { + return ( + + + + ); + } + return {handleErrorMessage(error)}; +}; + +const SearchResults = () => { + const [paramsStatus, setParamsStatus] = useState( + ParamsStatus.LOADING + ); + const location = useLocation(); + const { chainId: urlChainId, address: urlAddress } = useParams(); + const { address, chainId, setAddress, setChainId } = useGlobalFiltersStore(); + const { data, status, error } = useAddressDetails(chainId, address); + + useEffect(() => { + setParamsStatus(ParamsStatus.LOADING); + }, [location]); + + useEffect(() => { + if (paramsStatus === ParamsStatus.SUCCESS) return; + if (urlAddress) { + setAddress(urlAddress); + } else { + setParamsStatus(ParamsStatus.ERROR); + return; + } + const chainIdFromUrl = Number(urlChainId); + if ( + !Number.isNaN(chainIdFromUrl) && + chainIdFromUrl && + getNetwork(chainIdFromUrl) + ) { + setChainId(chainIdFromUrl); + } else { + setParamsStatus(ParamsStatus.ERROR); + } + }, [ + address, + chainId, + paramsStatus, + setAddress, + setChainId, + urlAddress, + urlChainId, + ]); + + useEffect(() => { + if (address && chainId && paramsStatus !== ParamsStatus.SUCCESS) { + setParamsStatus(ParamsStatus.SUCCESS); + } + }, [address, chainId, paramsStatus]); + + if ( + paramsStatus === ParamsStatus.LOADING || + (status === 'pending' && !data) + ) { + return ; + } + + if (paramsStatus === ParamsStatus.ERROR) { + return Something went wrong; + } + + if (status === 'error') { + return ; + } + + const showTransactions = !!data.wallet || !!data.operator; + + const walletData = + data.wallet || + (data.operator && data.operator.role === null ? data.operator : undefined); + + return ( + <> + + {renderCurrentResultType(data, address)} + + + {data.operator && data.operator.role ? ( + + ) : null} + {walletData ? : null} + {data.escrow && } + {showTransactions && } + + ); +}; + +export default SearchResults; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/StakeInfo.tsx similarity index 100% rename from packages/apps/dashboard/client/src/pages/SearchResults/StakeInfo/index.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/StakeInfo.tsx diff --git a/packages/apps/dashboard/client/src/components/SearchResults/TitleSectionWrapper.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/TitleSectionWrapper.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/SearchResults/TitleSectionWrapper.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/TitleSectionWrapper.tsx diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx index 32d91c9c6b..7b204fcbef 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx @@ -1,15 +1,20 @@ +import { FC } from 'react'; + import Chip from '@mui/material/Chip'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import TitleSectionWrapper from '@/components/SearchResults'; -import { AddressDetailsEscrowSchema } from '@/services/api/use-address-details'; +import { AddressDetailsEscrowSchema } from '@/features/searchResults/model/addressDetailsSchema'; +import HmtBalance from '@/features/searchResults/ui/HmtBalance'; +import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; import SectionWrapper from '@/shared/ui/SectionWrapper'; -import HmtBalance from '../HmtBalance'; +type Props = { + data: AddressDetailsEscrowSchema; +}; -const EscrowAddress = ({ - data: { +const EscrowAddress: FC = ({ data }) => { + const { token, balance, factoryAddress, @@ -20,10 +25,7 @@ const EscrowAddress = ({ exchangeOracle, recordingOracle, reputationOracle, - }, -}: { - data: AddressDetailsEscrowSchema; -}) => { + } = data; return ( diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx index 9876587e4a..d393857bf7 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx @@ -1,3 +1,5 @@ +import { FC } from 'react'; + import { Role } from '@human-protocol/sdk'; import Box from '@mui/material/Box'; import Chip from '@mui/material/Chip'; @@ -7,26 +9,25 @@ import ListItem from '@mui/material/ListItem'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import TitleSectionWrapper from '@/components/SearchResults/TitleSectionWrapper'; +import { AddressDetailsOperator } from '@/features/searchResults/model/addressDetailsSchema'; +import HmtBalance from '@/features/searchResults/ui/HmtBalance'; +import HmtPrice from '@/features/searchResults/ui/HmtPrice'; +import KVStore from '@/features/searchResults/ui/KvStore'; +import ReputationScore from '@/features/searchResults/ui/ReputationScore'; +import StakeInfo from '@/features/searchResults/ui/StakeInfo'; +import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; import { env } from '@/helpers/env'; import { RoleDetailsEscrowsTable } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable'; -import { AddressDetailsOperator } from '@/services/api/use-address-details'; import EntityIcon from '@/shared/ui/EntityIcon'; import SectionWrapper from '@/shared/ui/SectionWrapper'; -import HmtBalance from '../HmtBalance'; -import HmtPrice from '../HmtPrice'; -import KVStore from '../KVStore'; -import ReputationScore from '../ReputationScore'; -import StakeInfo from '../StakeInfo'; - -interface RoleInfoProps { +type RoleInfoProps = { title: string; points: string[]; role: string; -} +}; -const RoleInformation = ({ title, points, role }: RoleInfoProps) => { +const RoleInformation: FC = ({ title, points, role }) => { return ( diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx index 94b2e313be..52ca68ece8 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx @@ -1,185 +1,16 @@ -import { useEffect, useState } from 'react'; - -import Stack from '@mui/material/Stack'; -import { AxiosError } from 'axios'; -import { useLocation, useParams } from 'react-router-dom'; - -import Clipboard from '@/components/Clipboard'; -import SearchBar from '@/components/SearchBar/SearchBar'; -import EscrowAddress from '@/pages/SearchResults/EscrowAddress'; -import RoleDetails from '@/pages/SearchResults/RoleDetails/RoleDetails'; -import WalletAddress from '@/pages/SearchResults/WalletAddress'; -import useAddressDetails, { - AddressDetails, -} from '@/services/api/use-address-details'; -import { handleErrorMessage } from '@/services/handle-error-message'; -import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; +import SearchResults from '@/features/searchResults'; import Breadcrumbs from '@/shared/ui/Breadcrumbs'; -import EscrowAddressIcon from '@/shared/ui/icons/EscrowAddressIcon'; -import WalletIcon from '@/shared/ui/icons/WalletIcon'; -import Loader from '@/shared/ui/Loader'; -import NothingFound from '@/shared/ui/NothingFound'; -import ShadowIcon from '@/shared/ui/ShadowIcon'; -import { getNetwork } from '@/utils/config/networks'; +import SearchBar from '@/shared/ui/SearchBar'; import PageWrapper from '@/widgets/page-wrapper'; -import { WalletAddressTransactionsTable } from './WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable'; - -const renderCurrentResultType = ( - addressDetails: AddressDetails, - tokenId: string | undefined -) => { - const type = Object.keys(addressDetails)[0] as - | keyof AddressDetails - | undefined; - - const renderType: Record< - keyof AddressDetails, - { title: string; icon: JSX.Element } - > = { - operator: { - title: 'Wallet Address', - icon: , - }, - escrow: { - title: 'Escrow Address', - icon: , - }, - wallet: { - title: 'Wallet Address', - icon: , - }, - }; - - if (type == null) { - return null; - } - - return ( - <> - - - - ); -}; - -const ResultError = ({ error }: { error: unknown }) => { - if (error instanceof AxiosError && error.response?.status === 400) { - return ( - - - - ); - } - return {handleErrorMessage(error)}; -}; - -const Results = () => { - const { address, chainId } = useGlobalFiltersStore(); - const { data, status, error } = useAddressDetails(chainId, address); - - if (status === 'pending' && !data) { - return ; - } - - if (status === 'error') { - return ; - } - - const showTransactions = !!data.wallet || !!data.operator; - - const walletData = - data.wallet || - (data.operator && data.operator.role === null ? data.operator : undefined); - - return ( - <> - - {renderCurrentResultType(data, address)} - - - {data.operator && data.operator.role ? ( - - ) : null} - {walletData ? : null} - {data.escrow && } - {showTransactions && } - - ); -}; - -enum ParamsStatus { - LOADING = 'loading', - ERROR = 'error', - SUCCESS = 'success', -} - -const SearchResults = () => { - const location = useLocation(); - const { chainId: urlChainId, address: urlAddress } = useParams(); - const { chainId, address, setAddress, setChainId } = useGlobalFiltersStore(); - - const [paramsStatus, setParamsStatus] = useState( - ParamsStatus.LOADING - ); - - useEffect(() => { - setParamsStatus(ParamsStatus.LOADING); - }, [location]); - - useEffect(() => { - if (paramsStatus === ParamsStatus.SUCCESS) return; - if (urlAddress) { - setAddress(urlAddress); - } else { - setParamsStatus(ParamsStatus.ERROR); - return; - } - const chainIdFromUrl = Number(urlChainId); - if ( - !Number.isNaN(chainIdFromUrl) && - chainIdFromUrl && - getNetwork(chainIdFromUrl) - ) { - setChainId(chainIdFromUrl); - } else { - setParamsStatus(ParamsStatus.ERROR); - } - }, [ - address, - chainId, - paramsStatus, - setAddress, - setChainId, - urlAddress, - urlChainId, - ]); - - useEffect(() => { - if (address && chainId && paramsStatus !== ParamsStatus.SUCCESS) { - setParamsStatus(ParamsStatus.SUCCESS); - } - }, [address, chainId, paramsStatus]); - +const SearchResultsPage = () => { return ( - {paramsStatus === ParamsStatus.LOADING && ( - - )} - {paramsStatus === ParamsStatus.ERROR && ( - Something went wrong - )} - {paramsStatus === ParamsStatus.SUCCESS && } + ); }; -export default SearchResults; +export default SearchResultsPage; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx index 433fe2eb98..4f80e41b47 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx +++ b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx @@ -4,20 +4,19 @@ import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; import { NumericFormat } from 'react-number-format'; -import TitleSectionWrapper from '@/components/SearchResults'; import { AddressDetailsOperator, AddressDetailsWallet, -} from '@/services/api/use-address-details'; +} from '@/features/searchResults/model/addressDetailsSchema'; +import HmtBalance from '@/features/searchResults/ui/HmtBalance'; +import HmtPrice from '@/features/searchResults/ui/HmtPrice'; +import KVStore from '@/features/searchResults/ui/KvStore'; +import ReputationScore from '@/features/searchResults/ui/ReputationScore'; +import StakeInfo from '@/features/searchResults/ui/StakeInfo'; +import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import SectionWrapper from '@/shared/ui/SectionWrapper'; -import HmtBalance from '../HmtBalance'; -import HmtPrice from '../HmtPrice'; -import KVStore from '../KVStore'; -import ReputationScore from '../ReputationScore'; -import StakeInfo from '../StakeInfo'; - type Props = { data: AddressDetailsWallet | AddressDetailsOperator; }; diff --git a/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx index 3d0b3b1fa6..752a3ab64d 100644 --- a/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx +++ b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx @@ -10,7 +10,6 @@ import Grid from '@mui/material/Unstable_Grid2'; import { Link } from 'react-router-dom'; import GraphSwiper from '@/components/Home/GraphSwiper'; -import SearchBar from '@/components/SearchBar/SearchBar'; import HmtPrice from '@/features/home/ui/HmtPrice'; import Holders from '@/features/home/ui/Holders'; import TotalNumberOfTasks from '@/features/home/ui/TotalNumberOfTasks'; @@ -19,6 +18,7 @@ import Leaderboard from '@/features/leaderboard'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import CustomTooltip from '@/shared/ui/CustomTooltip'; import LeaderboardIcon from '@/shared/ui/icons/LeaderboardIcon'; +import SearchBar from '@/shared/ui/SearchBar'; import ShadowIcon from '@/shared/ui/ShadowIcon'; import PageWrapper from '@/widgets/page-wrapper'; diff --git a/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx b/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx index 30e4e31c4e..8946138815 100644 --- a/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx +++ b/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx @@ -1,7 +1,7 @@ import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; -import { AddressDetailsOperator } from '@/services/api/use-address-details'; +import { AddressDetailsOperator } from '@/features/searchResults/model/addressDetailsSchema'; import { validateResponse } from '@/services/validate-response'; import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; diff --git a/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx b/packages/apps/dashboard/client/src/shared/ui/SearchBar/index.tsx similarity index 97% rename from packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx rename to packages/apps/dashboard/client/src/shared/ui/SearchBar/index.tsx index 6b3ee7f759..a81c2f0282 100644 --- a/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/SearchBar/index.tsx @@ -17,14 +17,13 @@ import IconButton from '@mui/material/IconButton'; import clsx from 'clsx'; import { useNavigate } from 'react-router-dom'; +import { isValidEVMAddress } from '@/helpers/isValidEVMAddress'; import useFilteredNetworks from '@/shared/api/useFilteredNetworks'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import CustomTooltip from '@/shared/ui/CustomTooltip'; import { NetworkIcon } from '@/shared/ui/NetworkIcon'; -import { isValidEVMAddress } from '../../helpers/isValidEVMAddress'; - import { endAdornmentInputAdornmentSx, startAdornmentInputAdornmentSx, @@ -33,12 +32,12 @@ import { muiTextFieldInputPropsSx, muiTextFieldSx, gridSx, -} from './SearchBar.styles'; +} from './styles'; -interface SearchBarProps { +type SearchBarProps = { className?: string; initialInputValue?: string; -} +}; const SearchBar: FC = ({ className = '', diff --git a/packages/apps/dashboard/client/src/components/SearchBar/SearchBar.styles.ts b/packages/apps/dashboard/client/src/shared/ui/SearchBar/styles.ts similarity index 100% rename from packages/apps/dashboard/client/src/components/SearchBar/SearchBar.styles.ts rename to packages/apps/dashboard/client/src/shared/ui/SearchBar/styles.ts From f873e1532f6ab1fbeba0071bf8711dc7663f0bab Mon Sep 17 00:00:00 2001 From: kirill Date: Thu, 19 Jun 2025 18:33:19 +0300 Subject: [PATCH 18/27] refactor: accomplished SearchResults refactoring (with page's naming problem) --- packages/apps/dashboard/client/.eslintcache | 1 + .../dashboard/client/src/app/AppRoutes.tsx | 2 +- .../searchResults/api/useEscrowDetails.ts | 79 +++++++++++++ .../api/useTransactionDetails.ts | 78 +++++++++++++ .../searchResults/hooks/usePagination.ts | 66 +++++++++++ .../model/addressDetailsSchema.ts | 2 +- .../model/escrowDetailsSchema.ts | 21 ++++ .../model/transactionDetailsSchema.ts | 36 ++++++ .../searchResults/ui}/EscrowAddress.tsx | 4 +- .../searchResults/ui/OperatorAddress.tsx} | 9 +- .../ui/OperatorEscrows/EscrowsTable.tsx | 81 +++++++++++++ .../ui/OperatorEscrows}/EscrowsTableBody.tsx | 45 +++----- .../EscrowsTableBodyContainer.tsx | 10 +- .../searchResults/ui/SearchResults.tsx | 12 +- .../searchResults/ui/TablePagination.tsx | 92 +++++++++++++++ .../searchResults/ui}/WalletAddress.tsx | 0 .../TransactionsTableBody.tsx | 55 ++++----- .../TransactionsTableBodyContainer.tsx | 8 +- .../TransactionsTableCellMethod.tsx} | 4 +- .../TransactionsTableCellValue.tsx} | 4 +- .../TransactionsTableHead.tsx | 4 +- .../ui/WalletTransactionsTable.tsx | 89 +++++++++++++++ .../SearchResults/EscrowAddress/index.ts | 1 - .../RoleDetailsEscrowsTable.tsx | 93 --------------- .../pages/SearchResults/RoleDetails/index.ts | 1 - .../WalletAddressTransactionsTable.tsx | 106 ----------------- .../SearchResults/WalletAddress/index.ts | 1 - .../client/src/pages/SearchResults/index.ts | 1 - .../client/src/pages/_searchResults/index.ts | 1 + .../ui/SearchResultsPage.tsx} | 1 - .../src/services/api/use-escrows-details.tsx | 99 ---------------- .../services/api/use-transaction-details.tsx | 107 ------------------ .../utils/hooks/use-escrows-details-dto.ts | 97 ---------------- .../hooks/use-transactions-details-dto.ts | 99 ---------------- 34 files changed, 612 insertions(+), 697 deletions(-) create mode 100644 packages/apps/dashboard/client/.eslintcache create mode 100644 packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts create mode 100644 packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts create mode 100644 packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts create mode 100644 packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts create mode 100644 packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts rename packages/apps/dashboard/client/src/{pages/SearchResults/EscrowAddress => features/searchResults/ui}/EscrowAddress.tsx (96%) rename packages/apps/dashboard/client/src/{pages/SearchResults/RoleDetails/RoleDetails.tsx => features/searchResults/ui/OperatorAddress.tsx} (96%) create mode 100644 packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx rename packages/apps/dashboard/client/src/{pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents => features/searchResults/ui/OperatorEscrows}/EscrowsTableBody.tsx (56%) rename packages/apps/dashboard/client/src/{pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents => features/searchResults/ui/OperatorEscrows}/EscrowsTableBodyContainer.tsx (75%) create mode 100644 packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx rename packages/apps/dashboard/client/src/{pages/SearchResults/WalletAddress => features/searchResults/ui}/WalletAddress.tsx (100%) rename packages/apps/dashboard/client/src/{pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents => features/searchResults/ui/WalletTransactions}/TransactionsTableBody.tsx (73%) rename packages/apps/dashboard/client/src/{pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents => features/searchResults/ui/WalletTransactions}/TransactionsTableBodyContainer.tsx (76%) rename packages/apps/dashboard/client/src/{pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellMethod.tsx => features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx} (93%) rename packages/apps/dashboard/client/src/{pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx => features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx} (92%) rename packages/apps/dashboard/client/src/{pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents => features/searchResults/ui/WalletTransactions}/TransactionsTableHead.tsx (95%) create mode 100644 packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx delete mode 100644 packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/index.ts delete mode 100644 packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx delete mode 100644 packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/index.ts delete mode 100644 packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx delete mode 100644 packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/index.ts delete mode 100644 packages/apps/dashboard/client/src/pages/SearchResults/index.ts create mode 100644 packages/apps/dashboard/client/src/pages/_searchResults/index.ts rename packages/apps/dashboard/client/src/pages/{SearchResults/SearchResults.tsx => _searchResults/ui/SearchResultsPage.tsx} (99%) delete mode 100644 packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx delete mode 100644 packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx delete mode 100644 packages/apps/dashboard/client/src/utils/hooks/use-escrows-details-dto.ts delete mode 100644 packages/apps/dashboard/client/src/utils/hooks/use-transactions-details-dto.ts diff --git a/packages/apps/dashboard/client/.eslintcache b/packages/apps/dashboard/client/.eslintcache new file mode 100644 index 0000000000..c56720bb02 --- /dev/null +++ b/packages/apps/dashboard/client/.eslintcache @@ -0,0 +1 @@ +[{"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/app/AppRoutes.tsx":"1","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts":"2","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts":"3","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts":"4","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts":"5","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts":"6","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts":"7","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx":"8","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx":"9","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx":"10","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx":"11","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBodyContainer.tsx":"12","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx":"13","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx":"14","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx":"15","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx":"16","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx":"17","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx":"18","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx":"19","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableHead.tsx":"20","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx":"21","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/index.ts":"22","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/ui/SearchResultsPage.tsx":"23"},{"size":790,"mtime":1750346752701,"results":"24","hashOfConfig":"25"},{"size":1847,"mtime":1750346752701,"results":"26","hashOfConfig":"25"},{"size":1870,"mtime":1750347051950,"results":"27","hashOfConfig":"25"},{"size":1466,"mtime":1750347051959,"results":"28","hashOfConfig":"25"},{"size":3198,"mtime":1750346752701,"results":"29","hashOfConfig":"25"},{"size":479,"mtime":1750347051982,"results":"30","hashOfConfig":"25"},{"size":896,"mtime":1750347051987,"results":"31","hashOfConfig":"25"},{"size":4037,"mtime":1750346752702,"results":"32","hashOfConfig":"25"},{"size":6784,"mtime":1750346752702,"results":"33","hashOfConfig":"25"},{"size":2310,"mtime":1750346752702,"results":"34","hashOfConfig":"25"},{"size":1809,"mtime":1750346752702,"results":"35","hashOfConfig":"25"},{"size":680,"mtime":1750346752702,"results":"36","hashOfConfig":"25"},{"size":4533,"mtime":1750346752703,"results":"37","hashOfConfig":"25"},{"size":2242,"mtime":1750347052040,"results":"38","hashOfConfig":"25"},{"size":2751,"mtime":1750346752703,"results":"39","hashOfConfig":"25"},{"size":5339,"mtime":1750346752703,"results":"40","hashOfConfig":"25"},{"size":693,"mtime":1750347052058,"results":"41","hashOfConfig":"25"},{"size":1953,"mtime":1750347052062,"results":"42","hashOfConfig":"25"},{"size":1151,"mtime":1750346752704,"results":"43","hashOfConfig":"25"},{"size":1833,"mtime":1750346752704,"results":"44","hashOfConfig":"25"},{"size":2657,"mtime":1750347052071,"results":"45","hashOfConfig":"25"},{"size":50,"mtime":1750347052073,"results":"46","hashOfConfig":"25"},{"size":448,"mtime":1750347052076,"results":"47","hashOfConfig":"25"},{"filePath":"48","messages":"49","suppressedMessages":"50","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"g1vefj",{"filePath":"51","messages":"52","suppressedMessages":"53","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"54","messages":"55","suppressedMessages":"56","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"57","messages":"58","suppressedMessages":"59","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","suppressedMessages":"62","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","suppressedMessages":"65","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","suppressedMessages":"68","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"69","messages":"70","suppressedMessages":"71","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"72","messages":"73","suppressedMessages":"74","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"75","messages":"76","suppressedMessages":"77","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"78","messages":"79","suppressedMessages":"80","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"81","messages":"82","suppressedMessages":"83","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"84","messages":"85","suppressedMessages":"86","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"87","messages":"88","suppressedMessages":"89","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"90","messages":"91","suppressedMessages":"92","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"93","messages":"94","suppressedMessages":"95","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"96","messages":"97","suppressedMessages":"98","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"99","messages":"100","suppressedMessages":"101","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"102","messages":"103","suppressedMessages":"104","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"105","messages":"106","suppressedMessages":"107","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"108","messages":"109","suppressedMessages":"110","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"111","messages":"112","suppressedMessages":"113","errorCount":1,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"114","messages":"115","suppressedMessages":"116","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/app/AppRoutes.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBodyContainer.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableHead.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/index.ts",["117"],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/ui/SearchResultsPage.tsx",[],[],{"ruleId":"118","severity":2,"message":"119","line":1,"column":25,"nodeType":"120","endLine":1,"endColumn":49},"import/no-unresolved","Casing of ./ui/SearchResultsPage does not match the underlying filesystem.","Literal"] \ No newline at end of file diff --git a/packages/apps/dashboard/client/src/app/AppRoutes.tsx b/packages/apps/dashboard/client/src/app/AppRoutes.tsx index a5f31e0999..8d3099c836 100644 --- a/packages/apps/dashboard/client/src/app/AppRoutes.tsx +++ b/packages/apps/dashboard/client/src/app/AppRoutes.tsx @@ -2,10 +2,10 @@ import { FC } from 'react'; import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; +import SearchResultsPage from '@/pages/_searchResults'; import GraphPage from '@/pages/graph'; import HomePage from '@/pages/home'; import LeaderboardPage from '@/pages/leaderboard'; -import SearchResultsPage from '@/pages/SearchResults'; import { ROUTES } from './config/routes'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts b/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts new file mode 100644 index 0000000000..e285847431 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts @@ -0,0 +1,79 @@ +import { useQuery } from '@tanstack/react-query'; + +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; +import { validateResponse } from '@/services/validate-response'; + +import { paginatedEscrowDetailsSchema } from '../model/escrowDetailsSchema'; + +type Props = { + role: string | null; + chainId: number; + address: string; + page: number; + lastPageIndex: number | undefined; + setLastPageIndex: (lastPageIndex: number | undefined) => void; + params: { + skip: number; + first: number; + }; +}; + +const useEscrowDetails = ({ + role, + chainId, + address, + page, + lastPageIndex, + setLastPageIndex, + params, +}: Props) => { + const dto = { + chainId, + role, + skip: params.skip, + first: params.first, + }; + + return useQuery({ + queryFn: async () => { + const { data } = await httpService.get( + `${apiPaths.escrowDetails.path}/${address}`, + { params: dto } + ); + + const validResponse = validateResponse( + data, + paginatedEscrowDetailsSchema + ); + + // check if last page + if (lastPageIndex === undefined) { + const { data: lastPageCheckData } = await httpService.get( + `${apiPaths.escrowDetails.path}/${address}`, + { + params: { + ...dto, + skip: dto.skip + validResponse.results.length, + first: 1, + }, + } + ); + const validLastPageCheckData = validateResponse( + lastPageCheckData, + paginatedEscrowDetailsSchema + ); + + if (validLastPageCheckData.results.length === 0) { + setLastPageIndex(page + 1); + } + } + + return validResponse; + }, + queryKey: ['useEscrowDetails', address, dto], + enabled: !!chainId && !!address, + }); +}; + +export default useEscrowDetails; diff --git a/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts b/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts new file mode 100644 index 0000000000..ba7bc2c277 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts @@ -0,0 +1,78 @@ +import { useQuery } from '@tanstack/react-query'; + +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; +import { validateResponse } from '@/services/validate-response'; + +import { paginatedTransactionDetailsSchema } from '../model/transactionDetailsSchema'; + +type Props = { + chainId: number; + address: string; + page: number; + lastPageIndex: number | undefined; + setLastPageIndex: (lastPageIndex: number | undefined) => void; + params: { + skip: number; + first: number; + }; +}; + +const useTransactionDetails = ({ + chainId, + address, + page, + lastPageIndex, + setLastPageIndex, + params, +}: Props) => { + const dto = { + chainId, + skip: params.skip, + first: params.first, + }; + + return useQuery({ + queryFn: async () => { + const { data } = await httpService.get( + `${apiPaths.transactionDetails.path}/${address}`, + { + params: dto, + } + ); + + const validResponse = validateResponse( + data, + paginatedTransactionDetailsSchema + ); + + // check if last page + if (lastPageIndex === undefined) { + const { data: lastPageCheckData } = await httpService.get( + `${apiPaths.transactionDetails.path}/${address}`, + { + params: { + ...dto, + skip: dto.skip + validResponse.results.length, + first: 1, + }, + } + ); + const validLastPageCheckData = validateResponse( + lastPageCheckData, + paginatedTransactionDetailsSchema + ); + + if (validLastPageCheckData.results.length === 0) { + setLastPageIndex(page + 1); + } + } + + return validResponse; + }, + queryKey: ['useTransactionDetails', address, dto], + enabled: !!chainId && !!address, + }); +}; + +export default useTransactionDetails; diff --git a/packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts b/packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts new file mode 100644 index 0000000000..342dc03695 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts @@ -0,0 +1,66 @@ +import { useCallback, useState } from 'react'; + +type PaginationState = { + params: { + first: number; + skip: number; + }; + pagination: { + page: number; + pageSize: number; + lastPageIndex?: number; + }; + setNextPage: () => void; + setPrevPage: () => void; + setPageSize: (pageSize: number) => void; + setLastPageIndex: (lastPageIndex: number | undefined) => void; +}; + +const INITIAL_PAGE_SIZE = 10; + +const usePagination = (): PaginationState => { + const [page, setPage] = useState(0); + const [pageSize, setPageSize] = useState(INITIAL_PAGE_SIZE); + const [lastPageIndex, setLastPageIndex] = useState(); + + const skip = page * pageSize; + + const setNextPage = useCallback(() => { + setPage((prev) => prev + 1); + }, []); + + const setPrevPage = useCallback(() => { + setPage((prev) => Math.max(0, prev - 1)); + }, []); + + const handleSetPageSize = useCallback((newPageSize: number) => { + setPageSize(newPageSize); + setPage(0); + setLastPageIndex(undefined); + }, []); + + const handleSetLastPageIndex = useCallback( + (newLastPageIndex: number | undefined) => { + setLastPageIndex(newLastPageIndex); + }, + [] + ); + + return { + params: { + first: pageSize, + skip, + }, + pagination: { + page, + pageSize, + lastPageIndex, + }, + setNextPage, + setPrevPage, + setPageSize: handleSetPageSize, + setLastPageIndex: handleSetLastPageIndex, + }; +}; + +export default usePagination; diff --git a/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts b/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts index 7a88b9b81e..42d7f3881d 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts +++ b/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts @@ -64,7 +64,7 @@ const escrowSchema = z.object({ finalResultsUrl: z.string().nullable(), }); -export type AddressDetailsEscrowSchema = z.infer; +export type AddressDetailsEscrow = z.infer; const operatorSchema = z.object({ chainId: z.number(), diff --git a/packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts b/packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts new file mode 100644 index 0000000000..2299f070b5 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts @@ -0,0 +1,21 @@ +import { z } from 'zod'; + +const escrowDetailsSchema = z.object({ + chainId: z.number(), + address: z.string(), + status: z.string(), +}); + +export type EscrowDetails = z.infer; + +export const paginatedEscrowDetailsSchema = z.object({ + address: z.string(), + chainId: z.number(), + first: z.number(), + skip: z.number(), + results: z.array(escrowDetailsSchema), +}); + +export type PaginatedEscrowDetails = z.infer< + typeof paginatedEscrowDetailsSchema +>; diff --git a/packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts b/packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts new file mode 100644 index 0000000000..810967e0f2 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts @@ -0,0 +1,36 @@ +import { z } from 'zod'; + +const internalTransactionSchema = z.object({ + from: z.string(), + to: z.string(), + value: z.string(), + method: z.string(), + receiver: z.string().nullable(), + escrow: z.string().nullable(), + token: z.string().nullable(), +}); + +const transactionDetailsSchema = z.object({ + txHash: z.string(), + method: z.string(), + from: z.string(), + to: z.string(), + receiver: z.string().nullable(), + block: z.number(), + value: z.string(), + internalTransactions: z.array(internalTransactionSchema), +}); + +export type TransactionDetails = z.infer; + +export const paginatedTransactionDetailsSchema = z.object({ + address: z.string(), + chainId: z.number(), + first: z.number(), + skip: z.number(), + results: z.array(transactionDetailsSchema), +}); + +export type PaginatedTransactionDetails = z.infer< + typeof paginatedTransactionDetailsSchema +>; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx similarity index 96% rename from packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx index 7b204fcbef..45b5dccc93 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/EscrowAddress.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx @@ -4,13 +4,13 @@ import Chip from '@mui/material/Chip'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import { AddressDetailsEscrowSchema } from '@/features/searchResults/model/addressDetailsSchema'; +import { AddressDetailsEscrow } from '@/features/searchResults/model/addressDetailsSchema'; import HmtBalance from '@/features/searchResults/ui/HmtBalance'; import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; import SectionWrapper from '@/shared/ui/SectionWrapper'; type Props = { - data: AddressDetailsEscrowSchema; + data: AddressDetailsEscrow; }; const EscrowAddress: FC = ({ data }) => { diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx similarity index 96% rename from packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx index d393857bf7..2475fc6754 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetails.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx @@ -17,10 +17,11 @@ import ReputationScore from '@/features/searchResults/ui/ReputationScore'; import StakeInfo from '@/features/searchResults/ui/StakeInfo'; import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; import { env } from '@/helpers/env'; -import { RoleDetailsEscrowsTable } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable'; import EntityIcon from '@/shared/ui/EntityIcon'; import SectionWrapper from '@/shared/ui/SectionWrapper'; +import EscrowsTable from './OperatorEscrows/EscrowsTable'; + type RoleInfoProps = { title: string; points: string[]; @@ -105,7 +106,7 @@ const renderRoleDetailsInfo = (role: string | null) => { ); }; -const RoleDetails = ({ data }: { data: AddressDetailsOperator }) => { +const OperatorAddress = ({ data }: { data: AddressDetailsOperator }) => { const { balance, role, @@ -206,8 +207,8 @@ const RoleDetails = ({ data }: { data: AddressDetailsOperator }) => { amountWithdrawable={amountWithdrawable} /> - + ); }; -export default RoleDetails; +export default OperatorAddress; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx new file mode 100644 index 0000000000..70071418bd --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx @@ -0,0 +1,81 @@ +import { FC } from 'react'; + +import Table from '@mui/material/Table'; +import TableContainer from '@mui/material/TableContainer'; +import TableFooter from '@mui/material/TableFooter'; +import TableHead from '@mui/material/TableHead'; +import TableRow from '@mui/material/TableRow'; +import Typography from '@mui/material/Typography'; + +import useEscrowDetails from '@/features/searchResults/api/useEscrowDetails'; +import usePagination from '@/features/searchResults/hooks/usePagination'; +import TablePagination from '@/features/searchResults/ui/TablePagination'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; + +import EscrowsTableBody from './EscrowsTableBody'; + +type Props = { + role: string | null; +}; + +const EscrowsTable: FC = ({ role }) => { + const { chainId, address } = useGlobalFiltersStore(); + const { + pagination: { page, pageSize, lastPageIndex }, + params, + setPageSize, + setNextPage, + setPrevPage, + setLastPageIndex, + } = usePagination(); + const { data, isLoading, error } = useEscrowDetails({ + role, + chainId, + address, + page, + lastPageIndex, + params, + setLastPageIndex, + }); + + return ( + + + Escrows + + + + + + + + + + + + +
+ + + ); +}; + +export default EscrowsTable; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx similarity index 56% rename from packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx index eb68bdc0e8..be2ea40c77 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx @@ -1,4 +1,4 @@ -import { FC, useEffect } from 'react'; +import { FC } from 'react'; import { TableRow } from '@mui/material'; import CircularProgress from '@mui/material/CircularProgress'; @@ -6,41 +6,22 @@ import Link from '@mui/material/Link'; import MuiTableBody from '@mui/material/TableBody'; import TableCell from '@mui/material/TableCell'; -import { EscrowsTableBodyContainer } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBodyContainer'; -import { useEscrowDetails } from '@/services/api/use-escrows-details'; +import { PaginatedEscrowDetails } from '@/features/searchResults/model/escrowDetailsSchema'; import { handleErrorMessage } from '@/services/handle-error-message'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; -import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; + +import EscrowsTableBodyContainer from './EscrowsTableBodyContainer'; type Props = { - role: string | null; + data: PaginatedEscrowDetails | undefined; + isLoading: boolean; + error: Error | null; }; -export const EscrowsTableBody: FC = ({ role }) => { - const { chainId, address } = useGlobalFiltersStore(); - const { data, isPending, isError, error } = useEscrowDetails( - role, - chainId, - address - ); - const { - setLastPageIndex, - setPrevPage, - pagination: { page }, - } = useEscrowDetailsDto(); - - useEffect(() => { - if (data?.results.length === 0) { - setLastPageIndex(page); - setPrevPage(); - } - }, [data?.results, page, setLastPageIndex, setPrevPage]); +const EscrowsTableBody: FC = ({ data, isLoading, error }) => { + const { chainId } = useGlobalFiltersStore(); - useEffect(() => { - setLastPageIndex(undefined); - }, [address, chainId, setLastPageIndex]); - - if (isPending) { + if (isLoading) { return ( @@ -48,7 +29,7 @@ export const EscrowsTableBody: FC = ({ role }) => { ); } - if (isError) { + if (error) { return (
{handleErrorMessage(error)}
@@ -56,7 +37,7 @@ export const EscrowsTableBody: FC = ({ role }) => { ); } - if (!data.results.length) { + if (!data?.results.length) { return (
No escrows launched yet
@@ -86,3 +67,5 @@ export const EscrowsTableBody: FC = ({ role }) => { ); }; + +export default EscrowsTableBody; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBodyContainer.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBodyContainer.tsx similarity index 75% rename from packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBodyContainer.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBodyContainer.tsx index 9b00b73d4f..99ef675244 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBodyContainer.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBodyContainer.tsx @@ -1,11 +1,9 @@ +import { FC, PropsWithChildren } from 'react'; + import { Grid } from '@mui/material'; import MuiTableBody from '@mui/material/TableBody'; -export const EscrowsTableBodyContainer = ({ - children, -}: { - children: JSX.Element; -}) => { +const EscrowsTableBodyContainer: FC = ({ children }) => { return ( ); }; + +export default EscrowsTableBodyContainer; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx index 875964a3bc..86b29960a4 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx @@ -4,10 +4,6 @@ import { Stack } from '@mui/material'; import { AxiosError } from 'axios'; import { useLocation, useParams } from 'react-router-dom'; -import EscrowAddress from '@/pages/SearchResults/EscrowAddress'; -import RoleDetails from '@/pages/SearchResults/RoleDetails/RoleDetails'; -import WalletAddress from '@/pages/SearchResults/WalletAddress'; -import { WalletAddressTransactionsTable } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable'; import { handleErrorMessage } from '@/services/handle-error-message'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import EscrowAddressIcon from '@/shared/ui/icons/EscrowAddressIcon'; @@ -20,7 +16,11 @@ import useAddressDetails from '../api/useAddressDetails'; import { AddressDetails } from '../model/addressDetailsSchema'; import Clipboard from './Clipboard'; +import EscrowAddress from './EscrowAddress'; import NothingFound from './NothingFound'; +import OperatorAddress from './OperatorAddress'; +import WalletAddress from './WalletAddress'; +import WalletTransactionsTable from './WalletTransactionsTable'; enum ParamsStatus { LOADING = 'loading', @@ -158,11 +158,11 @@ const SearchResults = () => { {data.operator && data.operator.role ? ( - + ) : null} {walletData ? : null} {data.escrow && } - {showTransactions && } + {showTransactions && } ); }; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx new file mode 100644 index 0000000000..a0611b80ee --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx @@ -0,0 +1,92 @@ +import { FC, useEffect } from 'react'; + +import { TablePagination as MuiTablePagination } from '@mui/material'; + +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; + +type Props = { + page: number; + pageSize: number; + resultsLength: number; + lastPageIndex: number | undefined; + isDataLoading: boolean | undefined; + setPageSize: (pageSize: number) => void; + setNextPage: () => void; + setPrevPage: () => void; + setLastPageIndex: (lastPageIndex: number | undefined) => void; +}; + +const TablePagination: FC = ({ + page, + pageSize, + resultsLength, + lastPageIndex, + isDataLoading, + setPageSize, + setNextPage, + setPrevPage, + setLastPageIndex, +}) => { + const { chainId, address } = useGlobalFiltersStore(); + + useEffect(() => { + if ( + resultsLength !== undefined && + resultsLength === 0 && + page > 0 && + !isDataLoading + ) { + setLastPageIndex(page); + setPrevPage(); + } + }, [resultsLength, page, setLastPageIndex, setPrevPage, isDataLoading]); + + useEffect(() => { + setLastPageIndex(undefined); + }, [address, chainId, setLastPageIndex]); + + useEffect(() => { + return () => { + setPageSize(10); + }; + }, [setPageSize]); + + return ( + {}} + page={page} + component="td" + rowsPerPage={pageSize} + onRowsPerPageChange={(event) => { + setPageSize(Number(event.target.value)); + }} + rowsPerPageOptions={[5, 10]} + labelDisplayedRows={({ from, to }) => { + const effectiveTo = resultsLength ? from + resultsLength - 1 : to; + return `${from}–${effectiveTo}`; + }} + slotProps={{ + actions: { + nextButton: { + onClick: () => { + setNextPage(); + }, + disabled: + lastPageIndex !== undefined && + (page === lastPageIndex || lastPageIndex - 1 === page), + }, + previousButton: { + onClick: () => { + setPrevPage(); + }, + }, + }, + }} + /> + ); +}; + +export default TablePagination; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx similarity index 100% rename from packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddress.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx similarity index 73% rename from packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx index 8e8df53e3d..40b71b0a7a 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import { FC, useState } from 'react'; import AddCircleIcon from '@mui/icons-material/AddCircle'; import ArrowForwardIcon from '@mui/icons-material/ArrowForward'; @@ -10,38 +10,21 @@ import MuiTableBody from '@mui/material/TableBody'; import TableCell from '@mui/material/TableCell'; import TableRow from '@mui/material/TableRow'; -import { TransactionTableCellMethod } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellMethod'; -import { TransactionTableCellValue } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue'; -import { TransactionsTableBodyContainer } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBodyContainer'; -import { useTransactionDetails } from '@/services/api/use-transaction-details'; +import { PaginatedTransactionDetails } from '@/features/searchResults/model/transactionDetailsSchema'; import { handleErrorMessage } from '@/services/handle-error-message'; -import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; -import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; -export const TransactionsTableBody: React.FC = () => { - const { chainId, address } = useGlobalFiltersStore(); - const { data, isPending, isError, error } = useTransactionDetails( - chainId, - address - ); - const { - setLastPageIndex, - setPrevPage, - pagination: { page }, - } = useTransactionDetailsDto(); - - useEffect(() => { - if (data?.results.length === 0) { - setLastPageIndex(page); - setPrevPage(); - } - }, [data?.results, page, setLastPageIndex, setPrevPage]); +import TransactionsTableBodyContainer from './TransactionsTableBodyContainer'; +import TransactionsTableCellMethod from './TransactionsTableCellMethod'; +import TransactionsTableCellValue from './TransactionsTableCellValue'; - useEffect(() => { - setLastPageIndex(undefined); - }, [address, chainId, setLastPageIndex]); +type Props = { + data: PaginatedTransactionDetails | undefined; + isLoading: boolean; + error: Error | null; +}; +const TransactionsTableBody: FC = ({ data, isLoading, error }) => { const [expandedRows, setExpandedRows] = useState>({}); const toggleRow = (idx: number) => { @@ -51,7 +34,7 @@ export const TransactionsTableBody: React.FC = () => { })); }; - if (isPending) { + if (isLoading) { return ( @@ -59,7 +42,7 @@ export const TransactionsTableBody: React.FC = () => { ); } - if (isError) { + if (error) { return (
{handleErrorMessage(error)}
@@ -67,7 +50,7 @@ export const TransactionsTableBody: React.FC = () => { ); } - if (!data.results.length) { + if (!data?.results.length) { return (
No data
@@ -104,7 +87,7 @@ export const TransactionsTableBody: React.FC = () => { - + { {elem.block} - @@ -140,7 +123,7 @@ export const TransactionsTableBody: React.FC = () => { > - + { - @@ -171,3 +154,5 @@ export const TransactionsTableBody: React.FC = () => { ); }; + +export default TransactionsTableBody; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBodyContainer.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx similarity index 76% rename from packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBodyContainer.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx index ea5a84943b..f474999c99 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBodyContainer.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx @@ -1,10 +1,10 @@ +import { FC, PropsWithChildren } from 'react'; + import { Grid } from '@mui/material'; import MuiTableBody from '@mui/material/TableBody'; -export const TransactionsTableBodyContainer = ({ +const TransactionsTableBodyContainer: FC = ({ children, -}: { - children: JSX.Element; }) => { return ( @@ -26,3 +26,5 @@ export const TransactionsTableBodyContainer = ({ ); }; + +export default TransactionsTableBodyContainer; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellMethod.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx similarity index 93% rename from packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellMethod.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx index 72d63b90a9..ac8d85d7ec 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellMethod.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx @@ -70,7 +70,7 @@ const methodAttributes: Record< }, }; -export const TransactionTableCellMethod = ({ method }: { method: string }) => { +const TransactionsTableCellMethod = ({ method }: { method: string }) => { const theme = useTheme(); const currentStatusColors = methodAttributes[method]?.color || { text: 'primary.main', @@ -97,3 +97,5 @@ export const TransactionTableCellMethod = ({ method }: { method: string }) => { /> ); }; + +export default TransactionsTableCellMethod; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx similarity index 92% rename from packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx index f7b3df9364..72ed5522c8 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/cells/TransactionTableCellValue.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx @@ -16,7 +16,7 @@ const InfoTooltip = ({ title }: { title: string }) => ( ); -export const TransactionTableCellValue = ({ +const TransactionsTableCellValue = ({ value, method, }: { @@ -45,3 +45,5 @@ export const TransactionTableCellValue = ({ ); }; + +export default TransactionsTableCellValue; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableHead.tsx similarity index 95% rename from packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead.tsx rename to packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableHead.tsx index dc2dc6667b..060380626b 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableHead.tsx @@ -27,7 +27,7 @@ const InfoTooltip = ({ title }: { title: string }) => ( ); -export const TransactionsTableHead = () => { +const TransactionsTableHead = () => { return ( { ); }; + +export default TransactionsTableHead; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx new file mode 100644 index 0000000000..f007349ded --- /dev/null +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx @@ -0,0 +1,89 @@ +import Table from '@mui/material/Table'; +import TableContainer from '@mui/material/TableContainer'; +import TableFooter from '@mui/material/TableFooter'; +import TableRow from '@mui/material/TableRow'; +import Typography from '@mui/material/Typography'; +import SimpleBar from 'simplebar-react'; + +import useTransactionDetails from '@/features/searchResults/api/useTransactionDetails'; +import usePagination from '@/features/searchResults/hooks/usePagination'; +import TablePagination from '@/features/searchResults/ui/TablePagination'; +import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; + +import TransactionsTableBody from './WalletTransactions/TransactionsTableBody'; +import TransactionsTableHead from './WalletTransactions/TransactionsTableHead'; + +const WalletTransactionsTable = () => { + const { chainId, address } = useGlobalFiltersStore(); + const { + pagination: { page, pageSize, lastPageIndex }, + params, + setPageSize, + setNextPage, + setPrevPage, + setLastPageIndex, + } = usePagination(); + const { data, isLoading, error } = useTransactionDetails({ + chainId, + address, + page, + lastPageIndex, + setLastPageIndex, + params, + }); + + return ( + + + Transactions + + + + + + +
+ + + + + + + +
+ + + ); +}; + +export default WalletTransactionsTable; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/index.ts b/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/index.ts deleted file mode 100644 index b7ba591a2c..0000000000 --- a/packages/apps/dashboard/client/src/pages/SearchResults/EscrowAddress/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './EscrowAddress'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx deleted file mode 100644 index 9c2ae5af72..0000000000 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/RoleDetailsEscrows/RoleDetailsEscrowsTable.tsx +++ /dev/null @@ -1,93 +0,0 @@ -import { useEffect } from 'react'; - -import Stack from '@mui/material/Stack'; -import Table from '@mui/material/Table'; -import TableContainer from '@mui/material/TableContainer'; -import TableHead from '@mui/material/TableHead'; -import TablePagination from '@mui/material/TablePagination'; -import TableRow from '@mui/material/TableRow'; -import Typography from '@mui/material/Typography'; - -import { EscrowsTableBody } from '@/pages/SearchResults/RoleDetails/RoleDetailsEscrows/tableComponents/EscrowsTableBody'; -import { useEscrowDetails } from '@/services/api/use-escrows-details'; -import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; -import SectionWrapper from '@/shared/ui/SectionWrapper'; -import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; - -export const RoleDetailsEscrowsTable = ({ role }: { role: string | null }) => { - const { chainId, address } = useGlobalFiltersStore(); - const { data } = useEscrowDetails(role, chainId, address); - const { - pagination: { page, pageSize, lastPageIndex }, - setPageSize, - setNextPage, - setPrevPage, - } = useEscrowDetailsDto(); - - useEffect(() => { - return () => { - setPageSize(10); - }; - }, [setPageSize]); - - return ( - - - Escrows - - - - - - - -
- - - {}} - page={page} - rowsPerPage={pageSize} - onRowsPerPageChange={(event) => { - setPageSize(Number(event.target.value)); - }} - rowsPerPageOptions={[5, 10]} - labelDisplayedRows={({ from, to }) => { - const effectiveTo = data?.results - ? from + data.results.length - 1 - : to; - return `${from}–${effectiveTo}`; - }} - component="div" - slotProps={{ - actions: { - nextButton: { - onClick: () => { - setNextPage(); - }, - disabled: - lastPageIndex !== undefined && - (page === lastPageIndex || lastPageIndex - 1 === page), - }, - previousButton: { - onClick: () => { - setPrevPage(); - }, - }, - }, - }} - /> - - - ); -}; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/index.ts b/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/index.ts deleted file mode 100644 index 6c3987e4fa..0000000000 --- a/packages/apps/dashboard/client/src/pages/SearchResults/RoleDetails/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './RoleDetails'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx deleted file mode 100644 index bc3b20a273..0000000000 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/WalletAddressTransactions/WalletAddressTransactionsTable.tsx +++ /dev/null @@ -1,106 +0,0 @@ -import { useEffect } from 'react'; - -import Table from '@mui/material/Table'; -import TableContainer from '@mui/material/TableContainer'; -import TableFooter from '@mui/material/TableFooter'; -import TablePagination from '@mui/material/TablePagination'; -import TableRow from '@mui/material/TableRow'; -import Typography from '@mui/material/Typography'; -import SimpleBar from 'simplebar-react'; - -import { TransactionsTableBody } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableBody'; -import { TransactionsTableHead } from '@/pages/SearchResults/WalletAddress/WalletAddressTransactions/tableComponents/TransactionsTableHead'; -import { useTransactionDetails } from '@/services/api/use-transaction-details'; -import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; -import SectionWrapper from '@/shared/ui/SectionWrapper'; -import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; - -export const WalletAddressTransactionsTable = () => { - const { chainId, address } = useGlobalFiltersStore(); - const { data } = useTransactionDetails(chainId, address); - const { - pagination: { page, pageSize, lastPageIndex }, - setPageSize, - setNextPage, - setPrevPage, - } = useTransactionDetailsDto(); - - useEffect(() => { - return () => { - setPageSize(10); - }; - }, [setPageSize]); - - return ( - - - Transactions - - - - - - -
- - - - - {}} - page={page} - component="td" - rowsPerPage={pageSize} - onRowsPerPageChange={(event) => { - setPageSize(Number(event.target.value)); - }} - rowsPerPageOptions={[5, 10]} - labelDisplayedRows={({ from, to }) => { - const effectiveTo = data?.results - ? from + data.results.length - 1 - : to; - return `${from}–${effectiveTo}`; - }} - slotProps={{ - actions: { - nextButton: { - onClick: () => { - setNextPage(); - }, - disabled: - lastPageIndex !== undefined && - (page === lastPageIndex || lastPageIndex - 1 === page), - }, - previousButton: { - onClick: () => { - setPrevPage(); - }, - }, - }, - }} - /> - - -
- - - ); -}; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/index.ts b/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/index.ts deleted file mode 100644 index f9385021f9..0000000000 --- a/packages/apps/dashboard/client/src/pages/SearchResults/WalletAddress/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './WalletAddress'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/index.ts b/packages/apps/dashboard/client/src/pages/SearchResults/index.ts deleted file mode 100644 index 43ac09d5da..0000000000 --- a/packages/apps/dashboard/client/src/pages/SearchResults/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './SearchResults'; diff --git a/packages/apps/dashboard/client/src/pages/_searchResults/index.ts b/packages/apps/dashboard/client/src/pages/_searchResults/index.ts new file mode 100644 index 0000000000..6d66d62fbc --- /dev/null +++ b/packages/apps/dashboard/client/src/pages/_searchResults/index.ts @@ -0,0 +1 @@ +export { default } from './ui/SearchResultsPage'; diff --git a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx b/packages/apps/dashboard/client/src/pages/_searchResults/ui/SearchResultsPage.tsx similarity index 99% rename from packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx rename to packages/apps/dashboard/client/src/pages/_searchResults/ui/SearchResultsPage.tsx index 52ca68ece8..02ae0f5ffc 100644 --- a/packages/apps/dashboard/client/src/pages/SearchResults/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/pages/_searchResults/ui/SearchResultsPage.tsx @@ -12,5 +12,4 @@ const SearchResultsPage = () => { ); }; - export default SearchResultsPage; diff --git a/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx b/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx deleted file mode 100644 index 8946138815..0000000000 --- a/packages/apps/dashboard/client/src/services/api/use-escrows-details.tsx +++ /dev/null @@ -1,99 +0,0 @@ -import { useQuery } from '@tanstack/react-query'; -import { z } from 'zod'; - -import { AddressDetailsOperator } from '@/features/searchResults/model/addressDetailsSchema'; -import { validateResponse } from '@/services/validate-response'; -import { useEscrowDetailsDto } from '@/utils/hooks/use-escrows-details-dto'; - -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; - -const escrowDetailsSuccessResponseSchema = z.object({ - chainId: z.number(), - address: z.string(), - status: z.string(), -}); - -export type TransactionDetails = z.infer< - typeof escrowDetailsSuccessResponseSchema ->; - -const paginatedEscrowsDetailsSuccessResponseSchema = z.object({ - address: z.string(), - chainId: z.number(), - first: z.number(), - skip: z.number(), - results: z.array(escrowDetailsSuccessResponseSchema), -}); - -export type PaginatedEscrowDetails = z.infer< - typeof paginatedEscrowsDetailsSuccessResponseSchema ->; - -export interface PaginatedEscrowsDetailsDto { - skip: number; - first: number; - chainId: number; - role: AddressDetailsOperator['role']; -} - -export function useEscrowDetails( - role: string | null, - chainId: number, - address: string -) { - const { - setLastPageIndex, - pagination: { page, lastPageIndex }, - params, - } = useEscrowDetailsDto(); - - const dto: PaginatedEscrowsDetailsDto = { - chainId, - role, - skip: params.skip, - first: params.first, - }; - - return useQuery({ - queryFn: async () => { - const { data } = await httpService.get( - `${apiPaths.escrowDetails.path}/${address}`, - { - params: dto, - } - ); - - const validResponse = validateResponse( - data, - paginatedEscrowsDetailsSuccessResponseSchema - ); - - // check if last page - if (lastPageIndex === undefined) { - const { data: lastPageCheckData } = await httpService.get( - `${apiPaths.escrowDetails.path}/${address}`, - { - params: { - ...dto, - skip: dto.skip + validResponse.results.length, - first: 1, - }, - } - ); - const validLastPageCheckData = validateResponse( - lastPageCheckData, - paginatedEscrowsDetailsSuccessResponseSchema - ); - - if (validLastPageCheckData.results.length === 0) { - setLastPageIndex(page + 1); - } - } - - return validResponse; - }, - queryKey: ['useEscrowDetails', address, dto], - enabled: !!chainId && !!address, - }); -} diff --git a/packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx b/packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx deleted file mode 100644 index 9a9aabb205..0000000000 --- a/packages/apps/dashboard/client/src/services/api/use-transaction-details.tsx +++ /dev/null @@ -1,107 +0,0 @@ -import { useQuery } from '@tanstack/react-query'; -import { z } from 'zod'; - -import { validateResponse } from '@/services/validate-response'; -import { useTransactionDetailsDto } from '@/utils/hooks/use-transactions-details-dto'; - -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; - -const internalTransactionSchema = z.object({ - from: z.string(), - to: z.string(), - value: z.string(), - method: z.string(), - receiver: z.string().nullable(), - escrow: z.string().nullable(), - token: z.string().nullable(), -}); - -const transactionDetailsSuccessResponseSchema = z.object({ - txHash: z.string(), - method: z.string(), - from: z.string(), - to: z.string(), - receiver: z.string().nullable(), - block: z.number(), - value: z.string(), - internalTransactions: z.array(internalTransactionSchema), -}); - -export type TransactionDetails = z.infer< - typeof transactionDetailsSuccessResponseSchema ->; - -const paginatedTransactionDetailsSuccessResponseSchema = z.object({ - address: z.string(), - chainId: z.number(), - first: z.number(), - skip: z.number(), - results: z.array(transactionDetailsSuccessResponseSchema), -}); - -export type PaginatedTransactionDetails = z.infer< - typeof paginatedTransactionDetailsSuccessResponseSchema ->; - -export interface PaginatedTransactionDetailsDto { - skip: number; - first: number; - chainId: number; -} - -export function useTransactionDetails(chainId: number, address: string) { - const { - params, - pagination: { lastPageIndex, page }, - setLastPageIndex, - } = useTransactionDetailsDto(); - - const dto: PaginatedTransactionDetailsDto = { - chainId, - skip: params.skip, - first: params.first, - }; - - return useQuery({ - queryFn: async () => { - const { data } = await httpService.get( - `${apiPaths.transactionDetails.path}/${address}`, - { - params: dto, - } - ); - - const validResponse = validateResponse( - data, - paginatedTransactionDetailsSuccessResponseSchema - ); - - // check if last page - if (lastPageIndex === undefined) { - const { data: lastPageCheckData } = await httpService.get( - `${apiPaths.transactionDetails.path}/${address}`, - { - params: { - ...dto, - skip: dto.skip + validResponse.results.length, - first: 1, - }, - } - ); - const validLastPageCheckData = validateResponse( - lastPageCheckData, - paginatedTransactionDetailsSuccessResponseSchema - ); - - if (validLastPageCheckData.results.length === 0) { - setLastPageIndex(page + 1); - } - } - - return validResponse; - }, - queryKey: ['useTransactionDetails', address, dto], - enabled: !!chainId && !!address, - }); -} diff --git a/packages/apps/dashboard/client/src/utils/hooks/use-escrows-details-dto.ts b/packages/apps/dashboard/client/src/utils/hooks/use-escrows-details-dto.ts deleted file mode 100644 index deabad31bf..0000000000 --- a/packages/apps/dashboard/client/src/utils/hooks/use-escrows-details-dto.ts +++ /dev/null @@ -1,97 +0,0 @@ -import { create } from 'zustand'; - -export interface EscrowDetailsDto { - params: { - first: number; - skip: number; - }; - pagination: { - page: number; - pageSize: number; - lastPageIndex?: number; - }; - setNextPage: () => void; - setPrevPage: () => void; - setPageSize: (pageSize: number) => void; - setLastPageIndex: (lastPageIndex: number | undefined) => void; -} - -const INITIAL_PAGE_SIZE = 10; - -export const useEscrowDetailsDto = create((set) => ({ - params: { - first: INITIAL_PAGE_SIZE, - skip: 0, - }, - pagination: { - page: 0, - pageSize: INITIAL_PAGE_SIZE, - lastPage: false, - }, - setNextPage() { - set((state) => { - const nextPage = state.pagination.page + 1; - const newSkip = nextPage * state.params.first; - - return { - ...state, - params: { - ...state.params, - skip: newSkip, - }, - pagination: { - ...state.pagination, - page: nextPage, - }, - }; - }); - }, - setPrevPage() { - set((state) => { - const prevPage = - state.pagination.page === 0 ? 0 : state.pagination.page - 1; - const offSetPages = prevPage === 0 ? 0 : state.pagination.page - 1; - const newSkip = state.params.first * offSetPages; - - return { - ...state, - params: { - ...state.params, - skip: newSkip, - }, - pagination: { - ...state.pagination, - page: prevPage, - }, - }; - }); - }, - setPageSize(pageSize: number) { - set((state) => { - return { - ...state, - pagination: { - lastPage: false, - page: 0, - pageSize: pageSize, - }, - params: { - ...state.params, - first: pageSize, - skip: 0, - }, - }; - }); - }, - setLastPageIndex(lastPageIndex: number | undefined) { - set((state) => { - return { - ...state, - pagination: { - ...state.pagination, - lastPageIndex, - }, - }; - }); - }, -})); diff --git a/packages/apps/dashboard/client/src/utils/hooks/use-transactions-details-dto.ts b/packages/apps/dashboard/client/src/utils/hooks/use-transactions-details-dto.ts deleted file mode 100644 index ce4219c922..0000000000 --- a/packages/apps/dashboard/client/src/utils/hooks/use-transactions-details-dto.ts +++ /dev/null @@ -1,99 +0,0 @@ -import { create } from 'zustand'; - -export interface TransactionDetailsDto { - params: { - first: number; - skip: number; - }; - pagination: { - page: number; - pageSize: number; - lastPageIndex?: number; - }; - setNextPage: () => void; - setPrevPage: () => void; - setPageSize: (pageSize: number) => void; - setLastPageIndex: (lastPageIndex: number | undefined) => void; -} - -const INITIAL_PAGE_SIZE = 10; - -export const useTransactionDetailsDto = create( - (set) => ({ - params: { - first: INITIAL_PAGE_SIZE, - skip: 0, - }, - pagination: { - page: 0, - pageSize: INITIAL_PAGE_SIZE, - lastPage: false, - }, - setNextPage() { - set((state) => { - const nextPage = state.pagination.page + 1; - const newSkip = nextPage * state.params.first; - - return { - ...state, - params: { - ...state.params, - skip: newSkip, - }, - pagination: { - ...state.pagination, - page: nextPage, - }, - }; - }); - }, - setPrevPage() { - set((state) => { - const prevPage = - state.pagination.page === 0 ? 0 : state.pagination.page - 1; - const offSetPages = prevPage === 0 ? 0 : state.pagination.page - 1; - const newSkip = state.params.first * offSetPages; - - return { - ...state, - params: { - ...state.params, - skip: newSkip, - }, - pagination: { - ...state.pagination, - page: prevPage, - }, - }; - }); - }, - setPageSize(pageSize: number) { - set((state) => { - return { - ...state, - pagination: { - lastPage: false, - page: 0, - pageSize: pageSize, - }, - params: { - ...state.params, - first: pageSize, - skip: 0, - }, - }; - }); - }, - setLastPageIndex(lastPageIndex: number | undefined) { - set((state) => { - return { - ...state, - pagination: { - ...state.pagination, - lastPageIndex, - }, - }; - }); - }, - }) -); From ab1260d8a6240cecadf41081d43b9339bc858ddc Mon Sep 17 00:00:00 2001 From: kirill Date: Thu, 19 Jun 2025 18:34:57 +0300 Subject: [PATCH 19/27] fix: add eslintcache to gitignore --- packages/apps/dashboard/client/.eslintcache | 1 - packages/apps/dashboard/client/.gitignore | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) delete mode 100644 packages/apps/dashboard/client/.eslintcache diff --git a/packages/apps/dashboard/client/.eslintcache b/packages/apps/dashboard/client/.eslintcache deleted file mode 100644 index c56720bb02..0000000000 --- a/packages/apps/dashboard/client/.eslintcache +++ /dev/null @@ -1 +0,0 @@ -[{"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/app/AppRoutes.tsx":"1","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts":"2","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts":"3","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts":"4","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts":"5","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts":"6","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts":"7","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx":"8","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx":"9","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx":"10","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx":"11","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBodyContainer.tsx":"12","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx":"13","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx":"14","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx":"15","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx":"16","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx":"17","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx":"18","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx":"19","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableHead.tsx":"20","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx":"21","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/index.ts":"22","/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/ui/SearchResultsPage.tsx":"23"},{"size":790,"mtime":1750346752701,"results":"24","hashOfConfig":"25"},{"size":1847,"mtime":1750346752701,"results":"26","hashOfConfig":"25"},{"size":1870,"mtime":1750347051950,"results":"27","hashOfConfig":"25"},{"size":1466,"mtime":1750347051959,"results":"28","hashOfConfig":"25"},{"size":3198,"mtime":1750346752701,"results":"29","hashOfConfig":"25"},{"size":479,"mtime":1750347051982,"results":"30","hashOfConfig":"25"},{"size":896,"mtime":1750347051987,"results":"31","hashOfConfig":"25"},{"size":4037,"mtime":1750346752702,"results":"32","hashOfConfig":"25"},{"size":6784,"mtime":1750346752702,"results":"33","hashOfConfig":"25"},{"size":2310,"mtime":1750346752702,"results":"34","hashOfConfig":"25"},{"size":1809,"mtime":1750346752702,"results":"35","hashOfConfig":"25"},{"size":680,"mtime":1750346752702,"results":"36","hashOfConfig":"25"},{"size":4533,"mtime":1750346752703,"results":"37","hashOfConfig":"25"},{"size":2242,"mtime":1750347052040,"results":"38","hashOfConfig":"25"},{"size":2751,"mtime":1750346752703,"results":"39","hashOfConfig":"25"},{"size":5339,"mtime":1750346752703,"results":"40","hashOfConfig":"25"},{"size":693,"mtime":1750347052058,"results":"41","hashOfConfig":"25"},{"size":1953,"mtime":1750347052062,"results":"42","hashOfConfig":"25"},{"size":1151,"mtime":1750346752704,"results":"43","hashOfConfig":"25"},{"size":1833,"mtime":1750346752704,"results":"44","hashOfConfig":"25"},{"size":2657,"mtime":1750347052071,"results":"45","hashOfConfig":"25"},{"size":50,"mtime":1750347052073,"results":"46","hashOfConfig":"25"},{"size":448,"mtime":1750347052076,"results":"47","hashOfConfig":"25"},{"filePath":"48","messages":"49","suppressedMessages":"50","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"g1vefj",{"filePath":"51","messages":"52","suppressedMessages":"53","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"54","messages":"55","suppressedMessages":"56","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"57","messages":"58","suppressedMessages":"59","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","suppressedMessages":"62","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","suppressedMessages":"65","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","suppressedMessages":"68","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"69","messages":"70","suppressedMessages":"71","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"72","messages":"73","suppressedMessages":"74","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"75","messages":"76","suppressedMessages":"77","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"78","messages":"79","suppressedMessages":"80","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"81","messages":"82","suppressedMessages":"83","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"84","messages":"85","suppressedMessages":"86","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"87","messages":"88","suppressedMessages":"89","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"90","messages":"91","suppressedMessages":"92","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"93","messages":"94","suppressedMessages":"95","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"96","messages":"97","suppressedMessages":"98","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"99","messages":"100","suppressedMessages":"101","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"102","messages":"103","suppressedMessages":"104","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"105","messages":"106","suppressedMessages":"107","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"108","messages":"109","suppressedMessages":"110","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"111","messages":"112","suppressedMessages":"113","errorCount":1,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"114","messages":"115","suppressedMessages":"116","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/app/AppRoutes.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/hooks/usePagination.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/addressDetailsSchema.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/escrowDetailsSchema.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/model/transactionDetailsSchema.ts",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTable.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBodyContainer.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/TablePagination.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellMethod.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableHead.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx",[],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/index.ts",["117"],[],"/Users/kirill/Work/HumanProtocol/human-protocol/packages/apps/dashboard/client/src/pages/SearchResults/ui/SearchResultsPage.tsx",[],[],{"ruleId":"118","severity":2,"message":"119","line":1,"column":25,"nodeType":"120","endLine":1,"endColumn":49},"import/no-unresolved","Casing of ./ui/SearchResultsPage does not match the underlying filesystem.","Literal"] \ No newline at end of file diff --git a/packages/apps/dashboard/client/.gitignore b/packages/apps/dashboard/client/.gitignore index a547bf36d8..adc48a4b49 100644 --- a/packages/apps/dashboard/client/.gitignore +++ b/packages/apps/dashboard/client/.gitignore @@ -17,6 +17,7 @@ dist-ssr !.vscode/extensions.json .idea .DS_Store +.eslintcache *.suo *.ntvs* *.njsproj From 16f86a0a396db564af527d3164aa2f57d6564442 Mon Sep 17 00:00:00 2001 From: kirill Date: Thu, 19 Jun 2025 18:36:40 +0300 Subject: [PATCH 20/27] fix: rename page dir back --- packages/apps/dashboard/client/src/app/AppRoutes.tsx | 2 +- .../client/src/pages/{_searchResults => searchResults}/index.ts | 0 .../{_searchResults => searchResults}/ui/SearchResultsPage.tsx | 0 3 files changed, 1 insertion(+), 1 deletion(-) rename packages/apps/dashboard/client/src/pages/{_searchResults => searchResults}/index.ts (100%) rename packages/apps/dashboard/client/src/pages/{_searchResults => searchResults}/ui/SearchResultsPage.tsx (100%) diff --git a/packages/apps/dashboard/client/src/app/AppRoutes.tsx b/packages/apps/dashboard/client/src/app/AppRoutes.tsx index 8d3099c836..866ee88553 100644 --- a/packages/apps/dashboard/client/src/app/AppRoutes.tsx +++ b/packages/apps/dashboard/client/src/app/AppRoutes.tsx @@ -2,10 +2,10 @@ import { FC } from 'react'; import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; -import SearchResultsPage from '@/pages/_searchResults'; import GraphPage from '@/pages/graph'; import HomePage from '@/pages/home'; import LeaderboardPage from '@/pages/leaderboard'; +import SearchResultsPage from '@/pages/searchResults'; import { ROUTES } from './config/routes'; diff --git a/packages/apps/dashboard/client/src/pages/_searchResults/index.ts b/packages/apps/dashboard/client/src/pages/searchResults/index.ts similarity index 100% rename from packages/apps/dashboard/client/src/pages/_searchResults/index.ts rename to packages/apps/dashboard/client/src/pages/searchResults/index.ts diff --git a/packages/apps/dashboard/client/src/pages/_searchResults/ui/SearchResultsPage.tsx b/packages/apps/dashboard/client/src/pages/searchResults/ui/SearchResultsPage.tsx similarity index 100% rename from packages/apps/dashboard/client/src/pages/_searchResults/ui/SearchResultsPage.tsx rename to packages/apps/dashboard/client/src/pages/searchResults/ui/SearchResultsPage.tsx From 87594c33e65e73999e8591e446ca08e238353649 Mon Sep 17 00:00:00 2001 From: kirill Date: Thu, 19 Jun 2025 18:45:57 +0300 Subject: [PATCH 21/27] fix: move the file one level up and update imports --- .../dashboard/client/src/features/leaderboard/ui/ChainCell.tsx | 2 +- .../client/src/features/searchResults/ui/SearchResults.tsx | 2 +- .../apps/dashboard/client/src/shared/api/useFilteredNetworks.ts | 2 +- .../apps/dashboard/client/src/utils/{config => }/networks.ts | 0 4 files changed, 3 insertions(+), 3 deletions(-) rename packages/apps/dashboard/client/src/utils/{config => }/networks.ts (100%) diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx index 4176dcd2d0..aa90464a34 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx @@ -4,7 +4,7 @@ import { ChainId } from '@human-protocol/sdk'; import { Typography } from '@mui/material'; import { NetworkIcon } from '@/shared/ui/NetworkIcon'; -import { getNetwork } from '@/utils/config/networks'; +import { getNetwork } from '@/utils/networks'; type Props = { chainId: ChainId; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx index 86b29960a4..641c2ea23f 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx @@ -10,7 +10,7 @@ import EscrowAddressIcon from '@/shared/ui/icons/EscrowAddressIcon'; import WalletIcon from '@/shared/ui/icons/WalletIcon'; import Loader from '@/shared/ui/Loader'; import ShadowIcon from '@/shared/ui/ShadowIcon'; -import { getNetwork } from '@/utils/config/networks'; +import { getNetwork } from '@/utils/networks'; import useAddressDetails from '../api/useAddressDetails'; import { AddressDetails } from '../model/addressDetailsSchema'; diff --git a/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts index 118c66727b..dac2b2401b 100644 --- a/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts +++ b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts @@ -5,7 +5,7 @@ import { z } from 'zod'; import { apiPaths } from '@/services/api-paths'; import { httpService } from '@/services/http-service'; -import { networks as allNetworks } from '@/utils/config/networks'; +import { networks as allNetworks } from '@/utils/networks'; const enabledChainsSchema = z.array(z.number()); diff --git a/packages/apps/dashboard/client/src/utils/config/networks.ts b/packages/apps/dashboard/client/src/utils/networks.ts similarity index 100% rename from packages/apps/dashboard/client/src/utils/config/networks.ts rename to packages/apps/dashboard/client/src/utils/networks.ts From 35bc21523d099df2147d741712e44dc7d5701150 Mon Sep 17 00:00:00 2001 From: kirill Date: Fri, 20 Jun 2025 13:30:35 +0300 Subject: [PATCH 22/27] refactor: graph feature --- .../components/Charts/CustomChartTooltip.tsx | 86 ---------- .../client/src/components/Charts/index.ts | 4 - .../client/src/components/DataEntry/index.ts | 2 - .../client/src/components/Home/index.ts | 2 - .../src/features/graph/api/useChartData.ts | 113 +++++++++++++ .../client/src/features/graph/index.ts | 1 + .../graph/model/hcaptchaDailyStatsSchema.ts | 18 +++ .../graph/model/hmtDailyStatsSchema.ts | 29 ++++ .../graph/store/useChartParamsStore.ts} | 4 +- .../graph/ui}/AreaChart.tsx | 57 ++++--- .../src/features/graph/ui/ChartTooltip.tsx | 88 ++++++++++ .../graph/ui}/CustomXAxisTick.tsx | 0 .../graph/ui}/GraphSwiper.tsx | 19 ++- .../Home => features/graph/ui}/SmallGraph.tsx | 65 ++++---- .../graph/ui}/ToggleButtons.tsx | 7 +- .../graph/ui}/ToggleCharts.tsx | 6 +- .../client/src/pages/graph/ui/GraphPage.tsx | 6 +- .../client/src/pages/home/ui/HomePage.tsx | 2 +- .../api/use-graph-page-chart-data.tsx | 150 ------------------ .../ui/DatePicker/index.tsx} | 0 20 files changed, 335 insertions(+), 324 deletions(-) delete mode 100644 packages/apps/dashboard/client/src/components/Charts/CustomChartTooltip.tsx delete mode 100644 packages/apps/dashboard/client/src/components/Charts/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/DataEntry/index.ts delete mode 100644 packages/apps/dashboard/client/src/components/Home/index.ts create mode 100644 packages/apps/dashboard/client/src/features/graph/api/useChartData.ts create mode 100644 packages/apps/dashboard/client/src/features/graph/index.ts create mode 100644 packages/apps/dashboard/client/src/features/graph/model/hcaptchaDailyStatsSchema.ts create mode 100644 packages/apps/dashboard/client/src/features/graph/model/hmtDailyStatsSchema.ts rename packages/apps/dashboard/client/src/{utils/hooks/use-graph-page-chart-params.tsx => features/graph/store/useChartParamsStore.ts} (96%) rename packages/apps/dashboard/client/src/{components/Charts => features/graph/ui}/AreaChart.tsx (91%) create mode 100644 packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx rename packages/apps/dashboard/client/src/{components/Charts => features/graph/ui}/CustomXAxisTick.tsx (100%) rename packages/apps/dashboard/client/src/{components/Home => features/graph/ui}/GraphSwiper.tsx (81%) rename packages/apps/dashboard/client/src/{components/Home => features/graph/ui}/SmallGraph.tsx (74%) rename packages/apps/dashboard/client/src/{components/DataEntry => features/graph/ui}/ToggleButtons.tsx (93%) rename packages/apps/dashboard/client/src/{components/Charts => features/graph/ui}/ToggleCharts.tsx (96%) delete mode 100644 packages/apps/dashboard/client/src/services/api/use-graph-page-chart-data.tsx rename packages/apps/dashboard/client/src/{components/DataEntry/DatePicker.tsx => shared/ui/DatePicker/index.tsx} (100%) diff --git a/packages/apps/dashboard/client/src/components/Charts/CustomChartTooltip.tsx b/packages/apps/dashboard/client/src/components/Charts/CustomChartTooltip.tsx deleted file mode 100644 index 43e186ae67..0000000000 --- a/packages/apps/dashboard/client/src/components/Charts/CustomChartTooltip.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import FiberManualRecordIcon from '@mui/icons-material/FiberManualRecord'; -import { Grid, Typography } from '@mui/material'; -import Box from '@mui/material/Box'; -import Card from '@mui/material/Card'; -import Stack from '@mui/material/Stack'; -import { NumericFormat } from 'react-number-format'; -import { TooltipProps } from 'recharts'; - -import { GraphPageChartDataConfigObject } from '@/components/Charts/AreaChart'; -import { formatDate } from '@/helpers/formatDate'; - -const renderTitle = (title: string) => { - const currentTitle: GraphPageChartDataConfigObject = { - totalTransactionAmount: 'Transfer Amount', - totalTransactionCount: 'Transactions Count', - solved: 'Number of Tasks', - dailyUniqueReceivers: 'Unique Receivers', - dailyUniqueSenders: 'Unique Senders', - }; - return currentTitle[title as keyof GraphPageChartDataConfigObject]; -}; - -const CustomChartTooltip = ({ - payload, - label, - active, -}: TooltipProps) => { - if (active) { - return ( - - - - {formatDate(label, 'MMMM DD, YYYY')} - - {payload?.map((elem) => ( - - - - - - {renderTitle(elem.name ?? '')} - - - - - - {' '} - {elem.name === 'totalTransactionAmount' ? 'HMT' : ''} - - - - ))} - - - ); - } - return null; -}; - -export default CustomChartTooltip; diff --git a/packages/apps/dashboard/client/src/components/Charts/index.ts b/packages/apps/dashboard/client/src/components/Charts/index.ts deleted file mode 100644 index 52e979682c..0000000000 --- a/packages/apps/dashboard/client/src/components/Charts/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -export * from './AreaChart'; -export * from './CustomChartTooltip'; -export * from './CustomXAxisTick'; -export * from './ToggleCharts'; diff --git a/packages/apps/dashboard/client/src/components/DataEntry/index.ts b/packages/apps/dashboard/client/src/components/DataEntry/index.ts deleted file mode 100644 index b2655c7380..0000000000 --- a/packages/apps/dashboard/client/src/components/DataEntry/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './DatePicker'; -export * from './ToggleButtons'; diff --git a/packages/apps/dashboard/client/src/components/Home/index.ts b/packages/apps/dashboard/client/src/components/Home/index.ts deleted file mode 100644 index 7117ca0dc1..0000000000 --- a/packages/apps/dashboard/client/src/components/Home/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './SmallGraph'; -export * from './GraphSwiper'; diff --git a/packages/apps/dashboard/client/src/features/graph/api/useChartData.ts b/packages/apps/dashboard/client/src/features/graph/api/useChartData.ts new file mode 100644 index 0000000000..f575d4e5ad --- /dev/null +++ b/packages/apps/dashboard/client/src/features/graph/api/useChartData.ts @@ -0,0 +1,113 @@ +import { useMemo } from 'react'; + +import { useQuery, keepPreviousData } from '@tanstack/react-query'; +import dayjs from 'dayjs'; +import { useDebounce } from 'use-debounce'; + +import { apiPaths } from '@/services/api-paths'; +import { httpService } from '@/services/http-service'; +import { validateResponse } from '@/services/validate-response'; + +import { + hcaptchaDailyStatsSchema, + HcaptchaDailyStats, +} from '../model/hcaptchaDailyStatsSchema'; +import { + hmtDailyStatsSchema, + HMTDailyStats, +} from '../model/hmtDailyStatsSchema'; + +export type ChartData = (HMTDailyStats & Omit)[]; + +const mergeResponses = ( + hcaptchaStatsResults: HcaptchaDailyStats[], + hmtStatsResults: HMTDailyStats[] +): ChartData => { + const allDates = Array.from( + new Set([ + ...hcaptchaStatsResults.map(({ date }) => date), + ...hmtStatsResults.map(({ date }) => date), + ]) + ).sort((a, b) => (dayjs(a).isBefore(dayjs(b)) ? -1 : 1)); + + const hcaptchaStatsResultsMap = new Map(); + const hmtStatsResultsMap = new Map(); + + hcaptchaStatsResults.forEach((entry) => { + hcaptchaStatsResultsMap.set(entry.date, entry); + }); + + hmtStatsResults.forEach((entry) => { + hmtStatsResultsMap.set(entry.date, entry); + }); + + return allDates.map((date) => { + const hmtStatsEntry: HMTDailyStats = hmtStatsResultsMap.get(date) || { + dailyUniqueReceivers: 0, + dailyUniqueSenders: 0, + date: date, + totalTransactionAmount: 0, + totalTransactionCount: 0, + }; + + const hcaptchaStatsEntry: HcaptchaDailyStats = hcaptchaStatsResultsMap.get( + date + ) || { + date: date, + solved: 0, + }; + + return { ...hmtStatsEntry, ...hcaptchaStatsEntry }; + }); +}; + +const DEBOUNCE_MS = 300; + +const useChartData = (from: dayjs.Dayjs, to: dayjs.Dayjs) => { + const queryParams = useMemo( + () => ({ + from: from.format('YYYY-MM-DD'), + to: to.format('YYYY-MM-DD'), + }), + [from, to] + ); + + const [debouncedQueryParams] = useDebounce(queryParams, DEBOUNCE_MS); + + return useQuery({ + queryFn: async () => { + const { data: hmtDailyStats } = await httpService.get( + apiPaths.hmtDailyStats.path, + { + params: debouncedQueryParams, + } + ); + const { data: hcaptchDailyStats } = await httpService.get( + apiPaths.hcaptchaStatsDaily.path, + { + params: debouncedQueryParams, + } + ); + + const validHmtDailyStats = validateResponse( + hmtDailyStats, + hmtDailyStatsSchema + ); + + const validHcaptchaGeneralStats = validateResponse( + hcaptchDailyStats, + hcaptchaDailyStatsSchema + ); + + return mergeResponses( + validHcaptchaGeneralStats.results, + validHmtDailyStats.results + ); + }, + staleTime: DEBOUNCE_MS, + queryKey: ['useChartData', debouncedQueryParams], + placeholderData: keepPreviousData, + }); +}; + +export default useChartData; diff --git a/packages/apps/dashboard/client/src/features/graph/index.ts b/packages/apps/dashboard/client/src/features/graph/index.ts new file mode 100644 index 0000000000..9cb08db244 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/graph/index.ts @@ -0,0 +1 @@ +export { default } from './ui/AreaChart'; diff --git a/packages/apps/dashboard/client/src/features/graph/model/hcaptchaDailyStatsSchema.ts b/packages/apps/dashboard/client/src/features/graph/model/hcaptchaDailyStatsSchema.ts new file mode 100644 index 0000000000..6b8d16a1ac --- /dev/null +++ b/packages/apps/dashboard/client/src/features/graph/model/hcaptchaDailyStatsSchema.ts @@ -0,0 +1,18 @@ +import { z } from 'zod'; + +export const hcaptchaDailyStatsSchema = z.object({ + from: z.string().optional(), + to: z.string().optional(), + results: z.array( + z.object({ + solved: z.number(), + date: z.string(), + }) + ), +}); + +export type HcaptchaDailyStatsResponse = z.infer< + typeof hcaptchaDailyStatsSchema +>; + +export type HcaptchaDailyStats = HcaptchaDailyStatsResponse['results'][number]; diff --git a/packages/apps/dashboard/client/src/features/graph/model/hmtDailyStatsSchema.ts b/packages/apps/dashboard/client/src/features/graph/model/hmtDailyStatsSchema.ts new file mode 100644 index 0000000000..5e4a86629a --- /dev/null +++ b/packages/apps/dashboard/client/src/features/graph/model/hmtDailyStatsSchema.ts @@ -0,0 +1,29 @@ +import { z } from 'zod'; + +export const hmtDailyStatsSchema = z.object({ + from: z.string().optional(), + to: z.string().optional(), + results: z.array( + z.object({ + totalTransactionAmount: z.string().transform((value, ctx) => { + const valueAsNumber = Number(value); + if (Number.isNaN(valueAsNumber)) { + ctx.addIssue({ + path: ['totalTransactionAmount'], + code: z.ZodIssueCode.custom, + }); + } + + return valueAsNumber / 10 ** 18; + }), + totalTransactionCount: z.number(), + dailyUniqueSenders: z.number(), + dailyUniqueReceivers: z.number(), + date: z.string(), + }) + ), +}); + +export type HMTDailyStatsResponse = z.output; + +export type HMTDailyStats = HMTDailyStatsResponse['results'][number]; diff --git a/packages/apps/dashboard/client/src/utils/hooks/use-graph-page-chart-params.tsx b/packages/apps/dashboard/client/src/features/graph/store/useChartParamsStore.ts similarity index 96% rename from packages/apps/dashboard/client/src/utils/hooks/use-graph-page-chart-params.tsx rename to packages/apps/dashboard/client/src/features/graph/store/useChartParamsStore.ts index 0869e4dc69..7755ed615d 100644 --- a/packages/apps/dashboard/client/src/utils/hooks/use-graph-page-chart-params.tsx +++ b/packages/apps/dashboard/client/src/features/graph/store/useChartParamsStore.ts @@ -58,7 +58,7 @@ const INITIAL_RANGE_PARAMS = { to: dayjs(), }; -export const useGraphPageChartParams = create((set) => ({ +const useChartParamsStore = create((set) => ({ dateRangeParams: INITIAL_RANGE_PARAMS, selectedTimePeriod: '1W', setFromDate: (fromDate: Dayjs | null) => { @@ -116,3 +116,5 @@ export const useGraphPageChartParams = create((set) => ({ })); }, })); + +export default useChartParamsStore; diff --git a/packages/apps/dashboard/client/src/components/Charts/AreaChart.tsx b/packages/apps/dashboard/client/src/features/graph/ui/AreaChart.tsx similarity index 91% rename from packages/apps/dashboard/client/src/components/Charts/AreaChart.tsx rename to packages/apps/dashboard/client/src/features/graph/ui/AreaChart.tsx index 36f5fa95b1..6ddc289304 100644 --- a/packages/apps/dashboard/client/src/components/Charts/AreaChart.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/AreaChart.tsx @@ -1,4 +1,4 @@ -import { useEffect, useRef, useState } from 'react'; +import { FC, useEffect, useRef, useState } from 'react'; import { Typography, useTheme } from '@mui/material'; import Card from '@mui/material/Card'; @@ -14,34 +14,35 @@ import { ResponsiveContainer, } from 'recharts'; -import CustomXAxisTick from '@/components/Charts/CustomXAxisTick'; -import ToggleCharts from '@/components/Charts/ToggleCharts'; -import DatePicker from '@/components/DataEntry/DatePicker'; -import ToggleButtons from '@/components/DataEntry/ToggleButtons'; import { formatNumber } from '@/helpers/formatNumber'; -import { - GraphPageChartData, - useGraphPageChartData, -} from '@/services/api/use-graph-page-chart-data'; -import { +import DatePicker from '@/shared/ui/DatePicker'; + +import useChartData, { ChartData } from '../api/useChartData'; +import useChartParamsStore, { initialAllTime, - useGraphPageChartParams, -} from '@/utils/hooks/use-graph-page-chart-params'; +} from '../store/useChartParamsStore'; -import CustomChartTooltip from './CustomChartTooltip'; +import ChartTooltip from './ChartTooltip'; +import CustomXAxisTick from './CustomXAxisTick'; +import ToggleButtons from './ToggleButtons'; +import ToggleCharts from './ToggleCharts'; -export type GraphPageChartDataConfigObject = Partial< - Record +export type ChartDataConfigObject = Partial< + Record >; -const CHECKED_CHARTS_DEFAULT_STATE: GraphPageChartDataConfigObject = { +type AreaChartProps = { + changeDateOnScroll?: boolean; +}; + +const CHECKED_CHARTS_DEFAULT_STATE: ChartDataConfigObject = { totalTransactionAmount: true, totalTransactionCount: true, solved: true, dailyUniqueReceivers: true, dailyUniqueSenders: true, }; -const HOVERED_CHARTS_DEFAULT_STATE: GraphPageChartDataConfigObject = { +const HOVERED_CHARTS_DEFAULT_STATE: ChartDataConfigObject = { totalTransactionAmount: false, totalTransactionCount: false, solved: false, @@ -50,12 +51,12 @@ const HOVERED_CHARTS_DEFAULT_STATE: GraphPageChartDataConfigObject = { }; type SumOfNumericChartDataProperties = Record< - keyof Omit, + keyof Omit, number >; const sumNumericProperties = ( - chartData: GraphPageChartData + chartData: ChartData ): SumOfNumericChartDataProperties => { return chartData.reduce( (acc, chartEntry) => { @@ -76,20 +77,16 @@ const sumNumericProperties = ( ); }; -export const AreaChart = ({ - changeDateOnScroll = false, -}: { - changeDateOnScroll?: boolean; -}) => { - const { data } = useGraphPageChartData(); - const theme = useTheme(); - const chartData = data || []; +const AreaChart: FC = ({ changeDateOnScroll = false }) => { const { setFromDate, setToDate, clearTimePeriod, dateRangeParams: { from, to }, - } = useGraphPageChartParams(); + } = useChartParamsStore(); + const { data } = useChartData(from, to); + const theme = useTheme(); + const chartData = data || []; const sum = sumNumericProperties(chartData); const [checkedCharts, setCheckedCharts] = useState( CHECKED_CHARTS_DEFAULT_STATE @@ -314,7 +311,7 @@ export const AreaChart = ({ dataKey="date" tickMargin={10} /> - } /> + } /> {checkedCharts.totalTransactionAmount && ( ); }; + +export default AreaChart; diff --git a/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx b/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx new file mode 100644 index 0000000000..e8ecef01a8 --- /dev/null +++ b/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx @@ -0,0 +1,88 @@ +import { FC } from 'react'; + +import FiberManualRecordIcon from '@mui/icons-material/FiberManualRecord'; +import { Grid, Typography } from '@mui/material'; +import Box from '@mui/material/Box'; +import Card from '@mui/material/Card'; +import Stack from '@mui/material/Stack'; +import { NumericFormat } from 'react-number-format'; +import { TooltipProps } from 'recharts'; + +import { formatDate } from '@/helpers/formatDate'; + +import { ChartDataConfigObject } from './AreaChart'; + +const renderTitle = (title: string) => { + const currentTitle: ChartDataConfigObject = { + totalTransactionAmount: 'Transfer Amount', + totalTransactionCount: 'Transactions Count', + solved: 'Number of Tasks', + dailyUniqueReceivers: 'Unique Receivers', + dailyUniqueSenders: 'Unique Senders', + }; + return currentTitle[title as keyof ChartDataConfigObject]; +}; + +const ChartTooltip: FC> = ({ + payload, + label, + active, +}) => { + if (!active) return null; + + return ( + + + + {formatDate(label, 'MMMM DD, YYYY')} + + {payload?.map((elem) => ( + + + + + + {renderTitle(elem.name ?? '')} + + + + + + {' '} + {elem.name === 'totalTransactionAmount' ? 'HMT' : ''} + + + + ))} + + + ); +}; + +export default ChartTooltip; diff --git a/packages/apps/dashboard/client/src/components/Charts/CustomXAxisTick.tsx b/packages/apps/dashboard/client/src/features/graph/ui/CustomXAxisTick.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/Charts/CustomXAxisTick.tsx rename to packages/apps/dashboard/client/src/features/graph/ui/CustomXAxisTick.tsx diff --git a/packages/apps/dashboard/client/src/components/Home/GraphSwiper.tsx b/packages/apps/dashboard/client/src/features/graph/ui/GraphSwiper.tsx similarity index 81% rename from packages/apps/dashboard/client/src/components/Home/GraphSwiper.tsx rename to packages/apps/dashboard/client/src/features/graph/ui/GraphSwiper.tsx index cb42b9e8f5..67775b3f45 100644 --- a/packages/apps/dashboard/client/src/components/Home/GraphSwiper.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/GraphSwiper.tsx @@ -1,17 +1,22 @@ -import { useEffect } from 'react'; +import { FC, useEffect } from 'react'; import { Navigation } from 'swiper/modules'; import { Swiper, SwiperSlide } from 'swiper/react'; -import SmallGraph from '@/components/Home/SmallGraph'; import 'swiper/css'; import 'swiper/css/navigation'; -import { useGraphPageChartData } from '@/services/api/use-graph-page-chart-data'; -import { useGraphPageChartParams } from '@/utils/hooks/use-graph-page-chart-params'; -const GraphSwiper = () => { - const { data } = useGraphPageChartData(); - const { revertToInitialParams } = useGraphPageChartParams(); +import useChartData from '../api/useChartData'; +import useChartParamsStore from '../store/useChartParamsStore'; + +import SmallGraph from './SmallGraph'; + +const GraphSwiper: FC = () => { + const { + revertToInitialParams, + dateRangeParams: { from, to }, + } = useChartParamsStore(); + const { data } = useChartData(from, to); useEffect(() => { revertToInitialParams(); diff --git a/packages/apps/dashboard/client/src/components/Home/SmallGraph.tsx b/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx similarity index 74% rename from packages/apps/dashboard/client/src/components/Home/SmallGraph.tsx rename to packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx index 284aeda325..5b145730d4 100644 --- a/packages/apps/dashboard/client/src/components/Home/SmallGraph.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx @@ -1,4 +1,4 @@ -import { Fragment } from 'react'; +import { FC, Fragment } from 'react'; import { useTheme } from '@mui/material'; import Box from '@mui/material/Box'; @@ -16,50 +16,49 @@ import { TooltipProps, } from 'recharts'; -import ToggleButtons from '@/components/DataEntry/ToggleButtons'; +import ToggleButtons from '@/features/graph/ui/ToggleButtons'; import { formatDate } from '@/helpers/formatDate'; import { formatNumber } from '@/helpers/formatNumber'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; -const CustomSmallChartTooltip = ({ +const CustomSmallChartTooltip: FC> = ({ payload, active, -}: TooltipProps) => { - if (active) { - return ( - - - {payload?.map((elem) => ( - - - {formatDate(elem.payload.date, 'MMMM DD, YYYY')} - - - {elem.value ? elem.value.toLocaleString('en-US') : ''} - - - ))} - - - ); - } - return null; +}) => { + if (!active) return null; + + return ( + + + {payload?.map((elem) => ( + + + {formatDate(elem.payload.date, 'MMMM DD, YYYY')} + + + {elem.value ? elem.value.toLocaleString('en-US') : ''} + + + ))} + + + ); }; -interface SmallGraphProps { +type SmallGraphProps = { graphData: { date: string; value: number; }[]; title: string; -} +}; const GraphSettings = ({ title }: { title: string }) => ( ( ); -const SmallGraph = ({ title, graphData }: SmallGraphProps) => { +const SmallGraph: FC = ({ title, graphData }) => { const isMobile = useIsMobile(); const theme = useTheme(); diff --git a/packages/apps/dashboard/client/src/components/DataEntry/ToggleButtons.tsx b/packages/apps/dashboard/client/src/features/graph/ui/ToggleButtons.tsx similarity index 93% rename from packages/apps/dashboard/client/src/components/DataEntry/ToggleButtons.tsx rename to packages/apps/dashboard/client/src/features/graph/ui/ToggleButtons.tsx index 29c523d3d9..9ef5a320b4 100644 --- a/packages/apps/dashboard/client/src/components/DataEntry/ToggleButtons.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/ToggleButtons.tsx @@ -4,11 +4,10 @@ import ToggleButton from '@mui/material/ToggleButton'; import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import dayjs from 'dayjs'; -import { +import useChartParamsStore, { TIME_PERIOD_OPTIONS, TimePeriod, - useGraphPageChartParams, -} from '@/utils/hooks/use-graph-page-chart-params'; +} from '../store/useChartParamsStore'; export const StyledToggleButtonGroup = styled(ToggleButtonGroup)( ({ theme }) => ({ @@ -26,7 +25,7 @@ export const StyledToggleButtonGroup = styled(ToggleButtonGroup)( const ToggleButtons = () => { const { setTimePeriod, selectedTimePeriod, dateRangeParams } = - useGraphPageChartParams(); + useChartParamsStore(); const checkIfSelected = (element: TimePeriod) => { if (element.name !== 'ALL') { diff --git a/packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx b/packages/apps/dashboard/client/src/features/graph/ui/ToggleCharts.tsx similarity index 96% rename from packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx rename to packages/apps/dashboard/client/src/features/graph/ui/ToggleCharts.tsx index 251f026d27..0a9719aee7 100644 --- a/packages/apps/dashboard/client/src/components/Charts/ToggleCharts.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/ToggleCharts.tsx @@ -1,3 +1,5 @@ +import { FC } from 'react'; + import { FormControlLabel, FormGroup, Typography } from '@mui/material'; import Checkbox from '@mui/material/Checkbox'; import Stack from '@mui/material/Stack'; @@ -17,12 +19,12 @@ interface ToggleChartsProps { }[]; } -const ToggleCharts = ({ +const ToggleCharts: FC = ({ handleChange, chartOptions, onMouseLeave, onMouseEnter, -}: ToggleChartsProps) => { +}) => { return ( { - const { revertToInitialParams } = useGraphPageChartParams(); + const { revertToInitialParams } = useChartParamsStore(); useEffect(() => { revertToInitialParams(); diff --git a/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx index 752a3ab64d..a92bd05c73 100644 --- a/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx +++ b/packages/apps/dashboard/client/src/pages/home/ui/HomePage.tsx @@ -9,7 +9,7 @@ import Typography from '@mui/material/Typography'; import Grid from '@mui/material/Unstable_Grid2'; import { Link } from 'react-router-dom'; -import GraphSwiper from '@/components/Home/GraphSwiper'; +import GraphSwiper from '@/features/graph/ui/GraphSwiper'; import HmtPrice from '@/features/home/ui/HmtPrice'; import Holders from '@/features/home/ui/Holders'; import TotalNumberOfTasks from '@/features/home/ui/TotalNumberOfTasks'; diff --git a/packages/apps/dashboard/client/src/services/api/use-graph-page-chart-data.tsx b/packages/apps/dashboard/client/src/services/api/use-graph-page-chart-data.tsx deleted file mode 100644 index 63032aaf65..0000000000 --- a/packages/apps/dashboard/client/src/services/api/use-graph-page-chart-data.tsx +++ /dev/null @@ -1,150 +0,0 @@ -import { useMemo } from 'react'; - -import { useQuery, keepPreviousData } from '@tanstack/react-query'; -import dayjs from 'dayjs'; -import { useDebounce } from 'use-debounce'; -import { z } from 'zod'; - -import { validateResponse } from '@/services/validate-response'; -import { useGraphPageChartParams } from '@/utils/hooks/use-graph-page-chart-params'; - -import { apiPaths } from '../api-paths'; -import { httpService } from '../http-service'; - -const hmtDailyStatSchemaResponseSchema = z.object({ - from: z.string().optional(), - to: z.string().optional(), - results: z.array( - z.object({ - totalTransactionAmount: z.string().transform((value, ctx) => { - const valueAsNumber = Number(value); - if (Number.isNaN(valueAsNumber)) { - ctx.addIssue({ - path: ['totalTransactionAmount'], - code: z.ZodIssueCode.custom, - }); - } - - return valueAsNumber / 10 ** 18; - }), - totalTransactionCount: z.number(), - dailyUniqueSenders: z.number(), - dailyUniqueReceivers: z.number(), - date: z.string(), - }) - ), -}); - -export type HMTDailyStatsResponse = z.output< - typeof hmtDailyStatSchemaResponseSchema ->; -export type HMTDailyStat = HMTDailyStatsResponse['results'][number]; - -const hcaptchaDailyStatsResponseSchema = z.object({ - from: z.string().optional(), - to: z.string().optional(), - results: z.array( - z.object({ - solved: z.number(), - date: z.string(), - }) - ), -}); - -export type HcaptchaDailyStatsResponse = z.infer< - typeof hcaptchaDailyStatsResponseSchema ->; -export type HcaptchaDailyStat = HcaptchaDailyStatsResponse['results'][number]; - -export type GraphPageChartData = (HMTDailyStat & - Omit)[]; - -const mergeResponses = ( - hcaptchaStatsResults: HcaptchaDailyStat[], - hmtStatsResults: HMTDailyStat[] -): GraphPageChartData => { - const allDates = Array.from( - new Set([ - ...hcaptchaStatsResults.map(({ date }) => date), - ...hmtStatsResults.map(({ date }) => date), - ]) - ).sort((a, b) => (dayjs(a).isBefore(dayjs(b)) ? -1 : 1)); - - const hcaptchaStatsResultsMap = new Map(); - const hmtStatsResultsMap = new Map(); - - hcaptchaStatsResults.forEach((entry) => { - hcaptchaStatsResultsMap.set(entry.date, entry); - }); - - hmtStatsResults.forEach((entry) => { - hmtStatsResultsMap.set(entry.date, entry); - }); - return allDates.map((date) => { - const hmtStatsEntry: HMTDailyStat = hmtStatsResultsMap.get(date) || { - dailyUniqueReceivers: 0, - dailyUniqueSenders: 0, - date: date, - totalTransactionAmount: 0, - totalTransactionCount: 0, - }; - - const hcaptchaStatsEntry: HcaptchaDailyStat = hcaptchaStatsResultsMap.get( - date - ) || { - date: date, - solved: 0, - }; - return { ...hmtStatsEntry, ...hcaptchaStatsEntry }; - }); -}; - -const DEBOUNCE_MS = 300; - -export function useGraphPageChartData() { - const { dateRangeParams } = useGraphPageChartParams(); - const queryParams = useMemo( - () => ({ - from: dateRangeParams.from.format('YYYY-MM-DD'), - to: dateRangeParams.to.format('YYYY-MM-DD'), - }), - [dateRangeParams.from, dateRangeParams.to] - ); - - const [debouncedQueryParams] = useDebounce(queryParams, DEBOUNCE_MS); - - return useQuery({ - queryFn: async () => { - const { data: hmtDailyStats } = await httpService.get( - apiPaths.hmtDailyStats.path, - { - params: debouncedQueryParams, - } - ); - const { data: hcaptchDailyStats } = await httpService.get( - apiPaths.hcaptchaStatsDaily.path, - { - params: debouncedQueryParams, - } - ); - - const validHmtDailyStats = validateResponse( - hmtDailyStats, - hmtDailyStatSchemaResponseSchema - ); - - const validHcaptchaGeneralStats = validateResponse( - hcaptchDailyStats, - hcaptchaDailyStatsResponseSchema - ); - - return mergeResponses( - validHcaptchaGeneralStats.results, - validHmtDailyStats.results - ); - }, - staleTime: DEBOUNCE_MS, - queryKey: ['useGraphPageChartData', debouncedQueryParams], - placeholderData: keepPreviousData, - }); -} diff --git a/packages/apps/dashboard/client/src/components/DataEntry/DatePicker.tsx b/packages/apps/dashboard/client/src/shared/ui/DatePicker/index.tsx similarity index 100% rename from packages/apps/dashboard/client/src/components/DataEntry/DatePicker.tsx rename to packages/apps/dashboard/client/src/shared/ui/DatePicker/index.tsx From 8569b5003aaa6b2fb043081e96a50d64da44094f Mon Sep 17 00:00:00 2001 From: kirill Date: Fri, 20 Jun 2025 15:53:04 +0300 Subject: [PATCH 23/27] refactor: move helpers, utils and services to shared/api and shared/lib --- .../client/src/features/graph/api/useChartData.ts | 10 +++++----- .../{helpers => features/graph/lib}/formatDate.ts | 4 +++- .../{helpers => features/graph/lib}/formatNumber.ts | 4 +++- .../client/src/features/graph/ui/AreaChart.tsx | 2 +- .../client/src/features/graph/ui/ChartTooltip.tsx | 2 +- .../client/src/features/graph/ui/CustomXAxisTick.tsx | 2 +- .../client/src/features/graph/ui/SmallGraph.tsx | 5 +++-- .../client/src/features/home/api/useGeneralStats.ts | 8 ++++---- .../src/features/home/api/useHcaptchaGeneralStats.ts | 10 ++++------ .../leaderboard/api/useLeaderboardDetails.ts | 8 ++++---- .../client/src/features/leaderboard/ui/ChainCell.tsx | 2 +- .../src/features/leaderboard/ui/DataGridWrapper.tsx | 2 +- .../client/src/features/leaderboard/ui/RoleCell.tsx | 4 ++-- .../features/searchResults/api/useAddressDetails.ts | 8 ++++---- .../features/searchResults/api/useEscrowDetails.ts | 10 +++++----- .../src/features/searchResults/api/useKvStoreData.ts | 8 ++++---- .../searchResults/api/useTransactionDetails.ts | 10 +++++----- .../features/searchResults/ui/OperatorAddress.tsx | 2 +- .../ui/OperatorEscrows/EscrowsTableBody.tsx | 2 +- .../src/features/searchResults/ui/SearchResults.tsx | 4 ++-- .../ui/WalletTransactions/TransactionsTableBody.tsx | 2 +- .../TransactionsTableCellValue.tsx | 4 ++-- .../dashboard/client/src/helpers/abbreviateValue.ts | 12 ------------ packages/apps/dashboard/client/src/helpers/index.ts | 1 - .../client/src/helpers/isValidEVMAddress.ts | 4 ---- .../dashboard/client/src/services/http-service.ts | 7 ------- .../api-paths.ts => shared/api/apiPaths.ts} | 4 +++- .../dashboard/client/src/shared/api/httpClient.ts | 9 +++++++++ .../client/src/shared/api/useFilteredNetworks.ts | 8 ++++---- .../dashboard/client/src/shared/api/useHmtPrice.ts | 8 ++++---- .../client/src/shared/lib/abbreviateAddress.ts | 12 ++++++++++++ .../src/shared/lib/convertSnakeToHumanReadable.ts | 8 ++++++++ .../client/src/{helpers => shared/lib}/env.ts | 0 .../lib/formatHmtDecimals.ts} | 4 +++- .../lib/handleErrorMessage.ts} | 6 ++++-- .../client/src/shared/lib/isValidEvmAddress.ts | 6 ++++++ .../client/src/{utils => shared/lib}/networks.ts | 2 +- .../lib/validateResponse.ts} | 4 +++- .../src/{services => shared/types}/global.type.ts | 0 .../src/shared/ui/AbbreviateClipboard/index.tsx | 6 +++--- .../client/src/shared/ui/SearchBar/index.tsx | 6 +++--- .../dashboard/client/src/utils/case-converter.ts | 8 -------- .../client/src/widgets/footer/ui/Footer.tsx | 2 +- .../client/src/widgets/header/ui/Header.tsx | 2 +- 44 files changed, 123 insertions(+), 109 deletions(-) rename packages/apps/dashboard/client/src/{helpers => features/graph/lib}/formatDate.ts (52%) rename packages/apps/dashboard/client/src/{helpers => features/graph/lib}/formatNumber.ts (72%) delete mode 100644 packages/apps/dashboard/client/src/helpers/abbreviateValue.ts delete mode 100644 packages/apps/dashboard/client/src/helpers/index.ts delete mode 100644 packages/apps/dashboard/client/src/helpers/isValidEVMAddress.ts delete mode 100644 packages/apps/dashboard/client/src/services/http-service.ts rename packages/apps/dashboard/client/src/{services/api-paths.ts => shared/api/apiPaths.ts} (93%) create mode 100644 packages/apps/dashboard/client/src/shared/api/httpClient.ts create mode 100644 packages/apps/dashboard/client/src/shared/lib/abbreviateAddress.ts create mode 100644 packages/apps/dashboard/client/src/shared/lib/convertSnakeToHumanReadable.ts rename packages/apps/dashboard/client/src/{helpers => shared/lib}/env.ts (100%) rename packages/apps/dashboard/client/src/{helpers/formatHMTDecimals.ts => shared/lib/formatHmtDecimals.ts} (87%) rename packages/apps/dashboard/client/src/{services/handle-error-message.ts => shared/lib/handleErrorMessage.ts} (76%) create mode 100644 packages/apps/dashboard/client/src/shared/lib/isValidEvmAddress.ts rename packages/apps/dashboard/client/src/{utils => shared/lib}/networks.ts (96%) rename packages/apps/dashboard/client/src/{services/validate-response.ts => shared/lib/validateResponse.ts} (82%) rename packages/apps/dashboard/client/src/{services => shared/types}/global.type.ts (100%) delete mode 100644 packages/apps/dashboard/client/src/utils/case-converter.ts diff --git a/packages/apps/dashboard/client/src/features/graph/api/useChartData.ts b/packages/apps/dashboard/client/src/features/graph/api/useChartData.ts index f575d4e5ad..b6e27a522d 100644 --- a/packages/apps/dashboard/client/src/features/graph/api/useChartData.ts +++ b/packages/apps/dashboard/client/src/features/graph/api/useChartData.ts @@ -4,9 +4,9 @@ import { useQuery, keepPreviousData } from '@tanstack/react-query'; import dayjs from 'dayjs'; import { useDebounce } from 'use-debounce'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { hcaptchaDailyStatsSchema, @@ -76,13 +76,13 @@ const useChartData = (from: dayjs.Dayjs, to: dayjs.Dayjs) => { return useQuery({ queryFn: async () => { - const { data: hmtDailyStats } = await httpService.get( + const { data: hmtDailyStats } = await httpClient.get( apiPaths.hmtDailyStats.path, { params: debouncedQueryParams, } ); - const { data: hcaptchDailyStats } = await httpService.get( + const { data: hcaptchDailyStats } = await httpClient.get( apiPaths.hcaptchaStatsDaily.path, { params: debouncedQueryParams, diff --git a/packages/apps/dashboard/client/src/helpers/formatDate.ts b/packages/apps/dashboard/client/src/features/graph/lib/formatDate.ts similarity index 52% rename from packages/apps/dashboard/client/src/helpers/formatDate.ts rename to packages/apps/dashboard/client/src/features/graph/lib/formatDate.ts index d2cf178433..eee127a6ab 100644 --- a/packages/apps/dashboard/client/src/helpers/formatDate.ts +++ b/packages/apps/dashboard/client/src/features/graph/lib/formatDate.ts @@ -1,5 +1,7 @@ import dayjs from 'dayjs'; -export const formatDate = (date: string, dateFormat?: string) => { +const formatDate = (date: string, dateFormat?: string) => { return dayjs(new Date(date)).format(dateFormat ?? 'dd/MM/yyyy'); }; + +export default formatDate; diff --git a/packages/apps/dashboard/client/src/helpers/formatNumber.ts b/packages/apps/dashboard/client/src/features/graph/lib/formatNumber.ts similarity index 72% rename from packages/apps/dashboard/client/src/helpers/formatNumber.ts rename to packages/apps/dashboard/client/src/features/graph/lib/formatNumber.ts index 029a6ae604..c4a391b9d8 100644 --- a/packages/apps/dashboard/client/src/helpers/formatNumber.ts +++ b/packages/apps/dashboard/client/src/features/graph/lib/formatNumber.ts @@ -1,4 +1,4 @@ -export const formatNumber = (number: number) => { +const formatNumber = (number: number) => { if (number >= 1000000) { return `${(number / 1000000).toFixed()} M`; } @@ -9,3 +9,5 @@ export const formatNumber = (number: number) => { return `${number.toString()}`; }; + +export default formatNumber; diff --git a/packages/apps/dashboard/client/src/features/graph/ui/AreaChart.tsx b/packages/apps/dashboard/client/src/features/graph/ui/AreaChart.tsx index 6ddc289304..73a297367d 100644 --- a/packages/apps/dashboard/client/src/features/graph/ui/AreaChart.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/AreaChart.tsx @@ -14,10 +14,10 @@ import { ResponsiveContainer, } from 'recharts'; -import { formatNumber } from '@/helpers/formatNumber'; import DatePicker from '@/shared/ui/DatePicker'; import useChartData, { ChartData } from '../api/useChartData'; +import formatNumber from '../lib/formatNumber'; import useChartParamsStore, { initialAllTime, } from '../store/useChartParamsStore'; diff --git a/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx b/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx index e8ecef01a8..47e5690013 100644 --- a/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx @@ -8,7 +8,7 @@ import Stack from '@mui/material/Stack'; import { NumericFormat } from 'react-number-format'; import { TooltipProps } from 'recharts'; -import { formatDate } from '@/helpers/formatDate'; +import formatDate from '../lib/formatDate'; import { ChartDataConfigObject } from './AreaChart'; diff --git a/packages/apps/dashboard/client/src/features/graph/ui/CustomXAxisTick.tsx b/packages/apps/dashboard/client/src/features/graph/ui/CustomXAxisTick.tsx index 3cdcc81b5b..7d351507c6 100644 --- a/packages/apps/dashboard/client/src/features/graph/ui/CustomXAxisTick.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/CustomXAxisTick.tsx @@ -2,7 +2,7 @@ import { useTheme } from '@mui/material'; // @ts-expect-error -- import error, but this type work property import { ContentRenderer } from 'recharts'; -import { formatDate } from '@/helpers/formatDate'; +import formatDate from '../lib/formatDate'; const CustomXAxisTick = ({ x, y, payload }: ContentRenderer) => { const theme = useTheme(); diff --git a/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx b/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx index 5b145730d4..a0c4c470dd 100644 --- a/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx @@ -17,10 +17,11 @@ import { } from 'recharts'; import ToggleButtons from '@/features/graph/ui/ToggleButtons'; -import { formatDate } from '@/helpers/formatDate'; -import { formatNumber } from '@/helpers/formatNumber'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; +import formatDate from '../lib/formatDate'; +import formatNumber from '../lib/formatNumber'; + const CustomSmallChartTooltip: FC> = ({ payload, active, diff --git a/packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts b/packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts index c305298b7c..c1c3c85238 100644 --- a/packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts +++ b/packages/apps/dashboard/client/src/features/home/api/useGeneralStats.ts @@ -1,15 +1,15 @@ import { useQuery } from '@tanstack/react-query'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { generalStatsResponseSchema } from '../model/generalStats'; const useGeneralStats = () => { return useQuery({ queryFn: async () => { - const { data } = await httpService.get(apiPaths.generalStats.path); + const { data } = await httpClient.get(apiPaths.generalStats.path); const validResponse = validateResponse(data, generalStatsResponseSchema); diff --git a/packages/apps/dashboard/client/src/features/home/api/useHcaptchaGeneralStats.ts b/packages/apps/dashboard/client/src/features/home/api/useHcaptchaGeneralStats.ts index 8df830be1b..afd902db3f 100644 --- a/packages/apps/dashboard/client/src/features/home/api/useHcaptchaGeneralStats.ts +++ b/packages/apps/dashboard/client/src/features/home/api/useHcaptchaGeneralStats.ts @@ -1,17 +1,15 @@ import { useQuery } from '@tanstack/react-query'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { hcaptchaGeneralStatsResponseSchema } from '../model/hcaptchaGeneralStats'; const useHcaptchaGeneralStats = () => { return useQuery({ queryFn: async () => { - const { data } = await httpService.get( - apiPaths.hcaptchaGeneralStats.path - ); + const { data } = await httpClient.get(apiPaths.hcaptchaGeneralStats.path); const validResponse = validateResponse( data, diff --git a/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts b/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts index 041cfd5680..6c2e3a4457 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts +++ b/packages/apps/dashboard/client/src/features/leaderboard/api/useLeaderboardDetails.ts @@ -1,8 +1,8 @@ import { useQuery } from '@tanstack/react-query'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { leaderboardResponseSchema } from '../model/leaderboardSchema'; @@ -13,7 +13,7 @@ const useLeaderboardDetails = (chainId: number, first?: number) => { return []; } - const { data } = await httpService.get(apiPaths.leaderboardDetails.path, { + const { data } = await httpClient.get(apiPaths.leaderboardDetails.path, { params: { chainId, first }, }); diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx index aa90464a34..2c16b90c65 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx @@ -3,8 +3,8 @@ import { FC } from 'react'; import { ChainId } from '@human-protocol/sdk'; import { Typography } from '@mui/material'; +import { getNetwork } from '@/shared/lib/networks'; import { NetworkIcon } from '@/shared/ui/NetworkIcon'; -import { getNetwork } from '@/utils/networks'; type Props = { chainId: ChainId; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx index 1bbfade008..9315537cfd 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx @@ -3,8 +3,8 @@ import { FC } from 'react'; import { Box, Typography } from '@mui/material'; import { DataGrid } from '@mui/x-data-grid'; -import { handleErrorMessage } from '@/services/handle-error-message'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; +import handleErrorMessage from '@/shared/lib/handleErrorMessage'; import Loader from '@/shared/ui/Loader'; import { LeaderboardData } from '../model/leaderboardSchema'; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx index 16e8541e3f..a06dfac29e 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx @@ -5,8 +5,8 @@ import { Box, Typography } from '@mui/material'; import { Link } from 'react-router-dom'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; +import convertSnakeToHumanReadable from '@/shared/lib/convertSnakeToHumanReadable'; import EntityIcon from '@/shared/ui/EntityIcon'; -import { CaseConverter } from '@/utils/case-converter'; type WrapperProps = { websiteUrl?: string; @@ -45,7 +45,7 @@ const Wrapper: FC> = ({ const RoleCell: FC = ({ rank, role, websiteUrl, name }) => { const isMobile = useIsMobile(); - const humanReadableRole = CaseConverter.convertSnakeToHumanReadable(role); + const humanReadableRole = convertSnakeToHumanReadable(role); const formattedName = name ? name.split(' ')[0] : null; return ( diff --git a/packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts b/packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts index 6ef23f3745..547adb1331 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useAddressDetails.ts @@ -1,15 +1,15 @@ import { useQuery } from '@tanstack/react-query'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { addressDetailsResponseSchema } from '../model/addressDetailsSchema'; const useAddressDetails = (chainId: number, address: string) => { return useQuery({ queryFn: async () => { - const { data } = await httpService.get( + const { data } = await httpClient.get( `${apiPaths.addressDetails.path}/${address}`, { params: { chainId: chainId || -1 } } ); diff --git a/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts b/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts index e285847431..2c946b1b69 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useEscrowDetails.ts @@ -1,8 +1,8 @@ import { useQuery } from '@tanstack/react-query'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { paginatedEscrowDetailsSchema } from '../model/escrowDetailsSchema'; @@ -37,7 +37,7 @@ const useEscrowDetails = ({ return useQuery({ queryFn: async () => { - const { data } = await httpService.get( + const { data } = await httpClient.get( `${apiPaths.escrowDetails.path}/${address}`, { params: dto } ); @@ -49,7 +49,7 @@ const useEscrowDetails = ({ // check if last page if (lastPageIndex === undefined) { - const { data: lastPageCheckData } = await httpService.get( + const { data: lastPageCheckData } = await httpClient.get( `${apiPaths.escrowDetails.path}/${address}`, { params: { diff --git a/packages/apps/dashboard/client/src/features/searchResults/api/useKvStoreData.ts b/packages/apps/dashboard/client/src/features/searchResults/api/useKvStoreData.ts index 73a769bd92..056bb530ee 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/api/useKvStoreData.ts +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useKvStoreData.ts @@ -1,8 +1,8 @@ import { useQuery } from '@tanstack/react-query'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { kvstoreDataSchema } from '../model/kvStoreDataSchema'; @@ -10,7 +10,7 @@ const useKvstoreData = (chainId: number, address: string) => { return useQuery({ queryKey: ['kvstoreData', address], queryFn: async () => { - const { data } = await httpService.get( + const { data } = await httpClient.get( `${apiPaths.kvstore.path}/${address}`, { params: { chain_id: chainId || -1 } } ); diff --git a/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts b/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts index ba7bc2c277..eee96a4a69 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts +++ b/packages/apps/dashboard/client/src/features/searchResults/api/useTransactionDetails.ts @@ -1,8 +1,8 @@ import { useQuery } from '@tanstack/react-query'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; import { paginatedTransactionDetailsSchema } from '../model/transactionDetailsSchema'; @@ -34,7 +34,7 @@ const useTransactionDetails = ({ return useQuery({ queryFn: async () => { - const { data } = await httpService.get( + const { data } = await httpClient.get( `${apiPaths.transactionDetails.path}/${address}`, { params: dto, @@ -48,7 +48,7 @@ const useTransactionDetails = ({ // check if last page if (lastPageIndex === undefined) { - const { data: lastPageCheckData } = await httpService.get( + const { data: lastPageCheckData } = await httpClient.get( `${apiPaths.transactionDetails.path}/${address}`, { params: { diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx index 2475fc6754..35bd087600 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx @@ -16,7 +16,7 @@ import KVStore from '@/features/searchResults/ui/KvStore'; import ReputationScore from '@/features/searchResults/ui/ReputationScore'; import StakeInfo from '@/features/searchResults/ui/StakeInfo'; import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; -import { env } from '@/helpers/env'; +import { env } from '@/shared/lib/env'; import EntityIcon from '@/shared/ui/EntityIcon'; import SectionWrapper from '@/shared/ui/SectionWrapper'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx index be2ea40c77..27fe744ef9 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorEscrows/EscrowsTableBody.tsx @@ -7,7 +7,7 @@ import MuiTableBody from '@mui/material/TableBody'; import TableCell from '@mui/material/TableCell'; import { PaginatedEscrowDetails } from '@/features/searchResults/model/escrowDetailsSchema'; -import { handleErrorMessage } from '@/services/handle-error-message'; +import handleErrorMessage from '@/shared/lib/handleErrorMessage'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import EscrowsTableBodyContainer from './EscrowsTableBodyContainer'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx index 641c2ea23f..e9b30182a3 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/SearchResults.tsx @@ -4,13 +4,13 @@ import { Stack } from '@mui/material'; import { AxiosError } from 'axios'; import { useLocation, useParams } from 'react-router-dom'; -import { handleErrorMessage } from '@/services/handle-error-message'; +import handleErrorMessage from '@/shared/lib/handleErrorMessage'; +import { getNetwork } from '@/shared/lib/networks'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import EscrowAddressIcon from '@/shared/ui/icons/EscrowAddressIcon'; import WalletIcon from '@/shared/ui/icons/WalletIcon'; import Loader from '@/shared/ui/Loader'; import ShadowIcon from '@/shared/ui/ShadowIcon'; -import { getNetwork } from '@/utils/networks'; import useAddressDetails from '../api/useAddressDetails'; import { AddressDetails } from '../model/addressDetailsSchema'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx index 40b71b0a7a..50dc2598dc 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx @@ -11,7 +11,7 @@ import TableCell from '@mui/material/TableCell'; import TableRow from '@mui/material/TableRow'; import { PaginatedTransactionDetails } from '@/features/searchResults/model/transactionDetailsSchema'; -import { handleErrorMessage } from '@/services/handle-error-message'; +import handleErrorMessage from '@/shared/lib/handleErrorMessage'; import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; import TransactionsTableBodyContainer from './TransactionsTableBodyContainer'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx index 72ed5522c8..4c031b002c 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableCellValue.tsx @@ -1,8 +1,8 @@ import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; import Typography from '@mui/material/Typography'; -import { formatHMTDecimals } from '@/helpers/formatHMTDecimals'; import useHmtPrice from '@/shared/api/useHmtPrice'; +import formatHmtDecimals from '@/shared/lib/formatHmtDecimals'; import CustomTooltip from '@/shared/ui/CustomTooltip'; const InfoTooltip = ({ title }: { title: string }) => ( @@ -35,7 +35,7 @@ const TransactionsTableCellValue = ({ return ( - {formatHMTDecimals(value)} + {formatHmtDecimals(value)} HMT diff --git a/packages/apps/dashboard/client/src/helpers/abbreviateValue.ts b/packages/apps/dashboard/client/src/helpers/abbreviateValue.ts deleted file mode 100644 index 45feadaf9d..0000000000 --- a/packages/apps/dashboard/client/src/helpers/abbreviateValue.ts +++ /dev/null @@ -1,12 +0,0 @@ -const abbreviateValue = (value: string | null) => { - if (value) { - const first3Letters = value.slice(0, 5); - const last5Letters = value.slice(-5); - - return `${first3Letters}...${last5Letters}`; - } - - return null; -}; - -export default abbreviateValue; diff --git a/packages/apps/dashboard/client/src/helpers/index.ts b/packages/apps/dashboard/client/src/helpers/index.ts deleted file mode 100644 index f2f42df6a9..0000000000 --- a/packages/apps/dashboard/client/src/helpers/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from 'src/helpers/abbreviateValue'; diff --git a/packages/apps/dashboard/client/src/helpers/isValidEVMAddress.ts b/packages/apps/dashboard/client/src/helpers/isValidEVMAddress.ts deleted file mode 100644 index 8b4e86d412..0000000000 --- a/packages/apps/dashboard/client/src/helpers/isValidEVMAddress.ts +++ /dev/null @@ -1,4 +0,0 @@ -export const isValidEVMAddress = (input: string): boolean => { - const evmRegex = /^0x[a-fA-F0-9]{40}$/; - return evmRegex.test(input); -}; diff --git a/packages/apps/dashboard/client/src/services/http-service.ts b/packages/apps/dashboard/client/src/services/http-service.ts deleted file mode 100644 index 92fbd08e36..0000000000 --- a/packages/apps/dashboard/client/src/services/http-service.ts +++ /dev/null @@ -1,7 +0,0 @@ -import axios from 'axios'; - -import { env } from '../helpers/env'; - -export const httpService = axios.create({ - baseURL: env.VITE_API_URL, -}); diff --git a/packages/apps/dashboard/client/src/services/api-paths.ts b/packages/apps/dashboard/client/src/shared/api/apiPaths.ts similarity index 93% rename from packages/apps/dashboard/client/src/services/api-paths.ts rename to packages/apps/dashboard/client/src/shared/api/apiPaths.ts index dfa16f9f30..8bff832b59 100644 --- a/packages/apps/dashboard/client/src/services/api-paths.ts +++ b/packages/apps/dashboard/client/src/shared/api/apiPaths.ts @@ -1,4 +1,4 @@ -export const apiPaths = { +const apiPaths = { hcaptchaGeneralStats: { path: '/stats/hcaptcha/general', }, @@ -33,3 +33,5 @@ export const apiPaths = { path: '/details/kvstore', }, } as const; + +export default apiPaths; diff --git a/packages/apps/dashboard/client/src/shared/api/httpClient.ts b/packages/apps/dashboard/client/src/shared/api/httpClient.ts new file mode 100644 index 0000000000..9bf75ff916 --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/api/httpClient.ts @@ -0,0 +1,9 @@ +import axios from 'axios'; + +import { env } from '@/shared/lib/env'; + +const httpClient = axios.create({ + baseURL: env.VITE_API_URL, +}); + +export default httpClient; diff --git a/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts index dac2b2401b..478cc36966 100644 --- a/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts +++ b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts @@ -3,9 +3,9 @@ import { useMemo } from 'react'; import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { networks as allNetworks } from '@/utils/networks'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import { networks as allNetworks } from '@/shared/lib/networks'; const enabledChainsSchema = z.array(z.number()); @@ -17,7 +17,7 @@ const useFilteredNetworks = () => { } = useQuery({ queryKey: ['enabledChains'], queryFn: async () => { - const response = await httpService.get(apiPaths.enabledChains.path); + const response = await httpClient.get(apiPaths.enabledChains.path); return enabledChainsSchema.parse(response.data); }, }); diff --git a/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts b/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts index 29c4779a08..f75de04957 100644 --- a/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts +++ b/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts @@ -1,9 +1,9 @@ import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; -import { apiPaths } from '@/services/api-paths'; -import { httpService } from '@/services/http-service'; -import { validateResponse } from '@/services/validate-response'; +import apiPaths from '@/shared/api/apiPaths'; +import httpClient from '@/shared/api/httpClient'; +import validateResponse from '@/shared/lib/validateResponse'; const hmtPriceResponseSchema = z.object({ hmtPrice: z.number(), @@ -14,7 +14,7 @@ export type HmtPrice = z.infer; const useHmtPrice = () => { return useQuery({ queryFn: async () => { - const { data } = await httpService.get(apiPaths.statsHmtPrice.path); + const { data } = await httpClient.get(apiPaths.statsHmtPrice.path); const validResponse = validateResponse(data, hmtPriceResponseSchema); diff --git a/packages/apps/dashboard/client/src/shared/lib/abbreviateAddress.ts b/packages/apps/dashboard/client/src/shared/lib/abbreviateAddress.ts new file mode 100644 index 0000000000..39cfa892b0 --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/lib/abbreviateAddress.ts @@ -0,0 +1,12 @@ +const abbreviateAddress = (address: string | null) => { + if (address) { + const first3Letters = address.slice(0, 5); + const last5Letters = address.slice(-5); + + return `${first3Letters}...${last5Letters}`; + } + + return null; +}; + +export default abbreviateAddress; diff --git a/packages/apps/dashboard/client/src/shared/lib/convertSnakeToHumanReadable.ts b/packages/apps/dashboard/client/src/shared/lib/convertSnakeToHumanReadable.ts new file mode 100644 index 0000000000..ea4b8843ed --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/lib/convertSnakeToHumanReadable.ts @@ -0,0 +1,8 @@ +const convertSnakeToHumanReadable = (string: string) => { + return string + .split('_') + .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()) + .join(' '); +}; + +export default convertSnakeToHumanReadable; diff --git a/packages/apps/dashboard/client/src/helpers/env.ts b/packages/apps/dashboard/client/src/shared/lib/env.ts similarity index 100% rename from packages/apps/dashboard/client/src/helpers/env.ts rename to packages/apps/dashboard/client/src/shared/lib/env.ts diff --git a/packages/apps/dashboard/client/src/helpers/formatHMTDecimals.ts b/packages/apps/dashboard/client/src/shared/lib/formatHmtDecimals.ts similarity index 87% rename from packages/apps/dashboard/client/src/helpers/formatHMTDecimals.ts rename to packages/apps/dashboard/client/src/shared/lib/formatHmtDecimals.ts index 8a6adfd05b..c0610ad83b 100644 --- a/packages/apps/dashboard/client/src/helpers/formatHMTDecimals.ts +++ b/packages/apps/dashboard/client/src/shared/lib/formatHmtDecimals.ts @@ -1,6 +1,6 @@ import { formatEther } from 'ethers'; -export const formatHMTDecimals = (value: string) => { +const formatHmtDecimals = (value: string) => { const formattedValue = Number(formatEther(value)); if (Number.isInteger(formattedValue)) { @@ -22,3 +22,5 @@ export const formatHMTDecimals = (value: string) => { ? formattedValue.toFixed(4) : formattedValue.toString(); }; + +export default formatHmtDecimals; diff --git a/packages/apps/dashboard/client/src/services/handle-error-message.ts b/packages/apps/dashboard/client/src/shared/lib/handleErrorMessage.ts similarity index 76% rename from packages/apps/dashboard/client/src/services/handle-error-message.ts rename to packages/apps/dashboard/client/src/shared/lib/handleErrorMessage.ts index 4e69c870ac..ff81428b80 100644 --- a/packages/apps/dashboard/client/src/services/handle-error-message.ts +++ b/packages/apps/dashboard/client/src/shared/lib/handleErrorMessage.ts @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { ZodError } from 'zod'; -export function handleErrorMessage(unknownError: unknown): string { +const handleErrorMessage = (unknownError: unknown): string => { if (unknownError instanceof AxiosError) { return unknownError.message; } @@ -15,4 +15,6 @@ export function handleErrorMessage(unknownError: unknown): string { } return 'Something went wrong'; -} +}; + +export default handleErrorMessage; diff --git a/packages/apps/dashboard/client/src/shared/lib/isValidEvmAddress.ts b/packages/apps/dashboard/client/src/shared/lib/isValidEvmAddress.ts new file mode 100644 index 0000000000..375c45011b --- /dev/null +++ b/packages/apps/dashboard/client/src/shared/lib/isValidEvmAddress.ts @@ -0,0 +1,6 @@ +const isValidEVMAddress = (input: string): boolean => { + const evmRegex = /^0x[a-fA-F0-9]{40}$/; + return evmRegex.test(input); +}; + +export default isValidEVMAddress; diff --git a/packages/apps/dashboard/client/src/utils/networks.ts b/packages/apps/dashboard/client/src/shared/lib/networks.ts similarity index 96% rename from packages/apps/dashboard/client/src/utils/networks.ts rename to packages/apps/dashboard/client/src/shared/lib/networks.ts index 05d80ebb58..c98025eb72 100644 --- a/packages/apps/dashboard/client/src/utils/networks.ts +++ b/packages/apps/dashboard/client/src/shared/lib/networks.ts @@ -1,7 +1,7 @@ import type { Chain } from 'viem/chains'; import * as chains from 'viem/chains'; -import { env } from '@/helpers/env'; +import { env } from '@/shared/lib/env'; //TODO: temporal fix. Should be fetched from API. https://github.com/humanprotocol/human-protocol/issues/2855 const ENABLED_CHAIN_IDS = env.VITE_ENABLED_CHAIN_IDS; diff --git a/packages/apps/dashboard/client/src/services/validate-response.ts b/packages/apps/dashboard/client/src/shared/lib/validateResponse.ts similarity index 82% rename from packages/apps/dashboard/client/src/services/validate-response.ts rename to packages/apps/dashboard/client/src/shared/lib/validateResponse.ts index d91f29b073..d2c74bed9c 100644 --- a/packages/apps/dashboard/client/src/services/validate-response.ts +++ b/packages/apps/dashboard/client/src/shared/lib/validateResponse.ts @@ -1,6 +1,6 @@ import { ZodError, type z } from 'zod'; -export const validateResponse = ( +const validateResponse = ( object: unknown, zodObject: T ): z.infer => { @@ -19,3 +19,5 @@ export const validateResponse = ( throw error; } }; + +export default validateResponse; diff --git a/packages/apps/dashboard/client/src/services/global.type.ts b/packages/apps/dashboard/client/src/shared/types/global.type.ts similarity index 100% rename from packages/apps/dashboard/client/src/services/global.type.ts rename to packages/apps/dashboard/client/src/shared/types/global.type.ts diff --git a/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx b/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx index dd96919cb2..83c1e14638 100644 --- a/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/AbbreviateClipboard/index.tsx @@ -7,7 +7,7 @@ import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; import { useNavigate } from 'react-router-dom'; -import abbreviateValue from '@/helpers/abbreviateValue'; +import abbreviateAddress from '@/shared/lib/abbreviateAddress'; import CustomTooltip from '@/shared/ui/CustomTooltip'; interface AbbreviateClipboardProps { @@ -49,11 +49,11 @@ const AbbreviateClipboard = ({ value, link }: AbbreviateClipboardProps) => { }, }} > - {abbreviateValue(value)} + {abbreviateAddress(value)} ) : ( - <>{abbreviateValue(value)} + <>{abbreviateAddress(value)} )} = ({ }, [filteredNetworks, isLoading, chainId, setChainId]); const navigateToAddress = useCallback(() => { - if (!isValidEVMAddress(inputValue)) { + if (!isValidEvmAddress(inputValue)) { setError('Invalid EVM address.'); return; } @@ -76,7 +76,7 @@ const SearchBar: FC = ({ const value = event.target.value; setInputValue(value); - if (isValidEVMAddress(value)) { + if (isValidEvmAddress(value)) { setError(null); } else if (value.length > 0) { setError('Invalid EVM address. Must start with 0x and be 42 characters.'); diff --git a/packages/apps/dashboard/client/src/utils/case-converter.ts b/packages/apps/dashboard/client/src/utils/case-converter.ts deleted file mode 100644 index d17b45eaf0..0000000000 --- a/packages/apps/dashboard/client/src/utils/case-converter.ts +++ /dev/null @@ -1,8 +0,0 @@ -export class CaseConverter { - static convertSnakeToHumanReadable(string: string): string { - return string - .split('_') - .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()) - .join(' '); - } -} diff --git a/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx b/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx index 292f263203..abefca1e74 100644 --- a/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx +++ b/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx @@ -9,7 +9,7 @@ import Box from '@mui/material/Box'; import Link from '@mui/material/Link'; import Typography from '@mui/material/Typography'; -import { env } from '@/helpers/env'; +import { env } from '@/shared/lib/env'; import DiscordIcon from '@/shared/ui/icons/DiscordIcon'; const StyledLink = styled(Link)(({ theme }) => ({ diff --git a/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx b/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx index 2024d30557..3932680ab3 100644 --- a/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx +++ b/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx @@ -12,7 +12,7 @@ import styled from '@mui/material/styles/styled'; import Toolbar from '@mui/material/Toolbar'; import { Link } from 'react-router-dom'; -import { env } from '@/helpers/env'; +import { env } from '@/shared/lib/env'; import LogoBlockIcon from '@/shared/ui/icons/LogoBlockIcon'; import LogoBlockIconMobile from '@/shared/ui/icons/LogoBlockIconMobile'; From 6b821b2562f6d3cef6d3debf4b3d9c19a9470eb8 Mon Sep 17 00:00:00 2001 From: kirill Date: Tue, 24 Jun 2025 11:55:23 +0300 Subject: [PATCH 24/27] refactor: rename FormatNumber and use it all over the app instead of NumericFormat package; update imports to be relative --- .../apps/dashboard/client/src/app/index.tsx | 2 +- .../src/features/graph/ui/ChartTooltip.tsx | 9 +++---- .../src/features/graph/ui/SmallGraph.tsx | 3 ++- .../src/features/graph/ui/ToggleCharts.tsx | 4 +-- .../client/src/features/home/ui/Holders.tsx | 4 +-- .../features/home/ui/TotalNumberOfTasks.tsx | 4 +-- .../features/home/ui/TotalTransactions.tsx | 4 +-- .../features/leaderboard/ui/AddressCell.tsx | 2 +- .../features/leaderboard/ui/CategoryCell.tsx | 3 ++- .../src/features/leaderboard/ui/ChainCell.tsx | 2 +- .../leaderboard/ui/DataGridWrapper.tsx | 3 ++- .../src/features/leaderboard/ui/RoleCell.tsx | 3 ++- .../src/features/leaderboard/ui/TextCell.tsx | 2 +- .../features/leaderboard/ui/useDataGrid.tsx | 3 ++- .../searchResults/ui/EscrowAddress.tsx | 8 +++--- .../features/searchResults/ui/HmtBalance.tsx | 9 ++----- .../searchResults/ui/OperatorAddress.tsx | 15 ++++++----- .../ui/OperatorEscrows/EscrowsTable.tsx | 7 ++--- .../ui/OperatorEscrows/EscrowsTableBody.tsx | 3 ++- .../EscrowsTableBodyContainer.tsx | 2 +- .../features/searchResults/ui/StakeInfo.tsx | 6 ++--- .../searchResults/ui/WalletAddress.tsx | 26 +++++++++---------- .../TransactionsTableBody.tsx | 3 ++- .../TransactionsTableBodyContainer.tsx | 2 +- .../ui/WalletTransactionsTable.tsx | 7 ++--- .../src/shared/api/useFilteredNetworks.ts | 5 ++-- .../client/src/shared/api/useHmtPrice.ts | 5 ++-- .../index.tsx | 14 ++++++---- 28 files changed, 84 insertions(+), 76 deletions(-) rename packages/apps/dashboard/client/src/shared/ui/{FormatNumber => FormattedNumber}/index.tsx (54%) diff --git a/packages/apps/dashboard/client/src/app/index.tsx b/packages/apps/dashboard/client/src/app/index.tsx index 26001b986c..04a926ce42 100644 --- a/packages/apps/dashboard/client/src/app/index.tsx +++ b/packages/apps/dashboard/client/src/app/index.tsx @@ -5,7 +5,7 @@ import ReactDOM from 'react-dom/client'; import AppRoutes from './AppRoutes'; import ThemeProvider from './providers/ThemeProvider'; -import '@/app/styles/main.scss'; +import './styles/main.scss'; import 'simplebar-react/dist/simplebar.min.css'; const queryClient = new QueryClient({ diff --git a/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx b/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx index 47e5690013..a1c474da5b 100644 --- a/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/ChartTooltip.tsx @@ -5,9 +5,10 @@ import { Grid, Typography } from '@mui/material'; import Box from '@mui/material/Box'; import Card from '@mui/material/Card'; import Stack from '@mui/material/Stack'; -import { NumericFormat } from 'react-number-format'; import { TooltipProps } from 'recharts'; +import FormattedNumber from '@/shared/ui/FormattedNumber'; + import formatDate from '../lib/formatDate'; import { ChartDataConfigObject } from './AreaChart'; @@ -70,11 +71,7 @@ const ChartTooltip: FC> = ({ textAlign="start" variant="subtitle2" > - {' '} + {' '} {elem.name === 'totalTransactionAmount' ? 'HMT' : ''} diff --git a/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx b/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx index a0c4c470dd..f03d15b7d0 100644 --- a/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/SmallGraph.tsx @@ -16,12 +16,13 @@ import { TooltipProps, } from 'recharts'; -import ToggleButtons from '@/features/graph/ui/ToggleButtons'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; import formatDate from '../lib/formatDate'; import formatNumber from '../lib/formatNumber'; +import ToggleButtons from './ToggleButtons'; + const CustomSmallChartTooltip: FC> = ({ payload, active, diff --git a/packages/apps/dashboard/client/src/features/graph/ui/ToggleCharts.tsx b/packages/apps/dashboard/client/src/features/graph/ui/ToggleCharts.tsx index 0a9719aee7..b699b14f8d 100644 --- a/packages/apps/dashboard/client/src/features/graph/ui/ToggleCharts.tsx +++ b/packages/apps/dashboard/client/src/features/graph/ui/ToggleCharts.tsx @@ -4,7 +4,7 @@ import { FormControlLabel, FormGroup, Typography } from '@mui/material'; import Checkbox from '@mui/material/Checkbox'; import Stack from '@mui/material/Stack'; -import FormatNumber from '@/shared/ui/FormatNumber'; +import FormattedNumber from '@/shared/ui/FormattedNumber'; interface ToggleChartsProps { handleChange: (event: React.ChangeEvent) => void; @@ -64,7 +64,7 @@ const ToggleCharts: FC = ({ <> {elem.title} - {elem.amount ? : 0} + {elem.amount ? : 0} {elem.name === 'totalTransactionAmount' && elem.isAreaChart && ( { Holders - {isSuccess && } + {isSuccess && } {isPending && '...'} {isError && 'No data'} diff --git a/packages/apps/dashboard/client/src/features/home/ui/TotalNumberOfTasks.tsx b/packages/apps/dashboard/client/src/features/home/ui/TotalNumberOfTasks.tsx index 9fa09f8bfa..715d56712c 100644 --- a/packages/apps/dashboard/client/src/features/home/ui/TotalNumberOfTasks.tsx +++ b/packages/apps/dashboard/client/src/features/home/ui/TotalNumberOfTasks.tsx @@ -1,7 +1,7 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import FormatNumber from '@/shared/ui/FormatNumber'; +import FormattedNumber from '@/shared/ui/FormattedNumber'; import useHcaptchaGeneralStats from '../api/useHcaptchaGeneralStats'; @@ -12,7 +12,7 @@ const TotalNumberOfTasks = () => { Total Number of Tasks - {isSuccess && } + {isSuccess && } {isPending && '...'} {isError && 'No data'} diff --git a/packages/apps/dashboard/client/src/features/home/ui/TotalTransactions.tsx b/packages/apps/dashboard/client/src/features/home/ui/TotalTransactions.tsx index 52a9b06ded..5bd9a31a0c 100644 --- a/packages/apps/dashboard/client/src/features/home/ui/TotalTransactions.tsx +++ b/packages/apps/dashboard/client/src/features/home/ui/TotalTransactions.tsx @@ -1,7 +1,7 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; -import FormatNumber from '@/shared/ui/FormatNumber'; +import FormattedNumber from '@/shared/ui/FormattedNumber'; import useGeneralStats from '../api/useGeneralStats'; @@ -12,7 +12,7 @@ const TotalTransactions = () => { Total Transactions - {isSuccess && } + {isSuccess && } {isPending && '...'} {isError && 'No data'} diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/AddressCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/AddressCell.tsx index 5a0455dce9..f2935aa8fa 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/AddressCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/AddressCell.tsx @@ -1,7 +1,7 @@ import { FC } from 'react'; import { ChainId } from '@human-protocol/sdk'; -import { Box } from '@mui/material'; +import Box from '@mui/material/Box'; import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/CategoryCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/CategoryCell.tsx index 2747630c8f..aff8549534 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/CategoryCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/CategoryCell.tsx @@ -1,6 +1,7 @@ import { FC } from 'react'; -import { Chip, Box } from '@mui/material'; +import Box from '@mui/material/Box'; +import Chip from '@mui/material/Chip'; type CategoryCellProps = { value?: string; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx index 2c16b90c65..028b9dcaf2 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/ChainCell.tsx @@ -1,7 +1,7 @@ import { FC } from 'react'; import { ChainId } from '@human-protocol/sdk'; -import { Typography } from '@mui/material'; +import Typography from '@mui/material/Typography'; import { getNetwork } from '@/shared/lib/networks'; import { NetworkIcon } from '@/shared/ui/NetworkIcon'; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx index 9315537cfd..bc71c3b905 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/DataGridWrapper.tsx @@ -1,6 +1,7 @@ import { FC } from 'react'; -import { Box, Typography } from '@mui/material'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; import { DataGrid } from '@mui/x-data-grid'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx index a06dfac29e..f65a2a7da4 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/RoleCell.tsx @@ -1,7 +1,8 @@ import { FC, PropsWithChildren } from 'react'; import { Launch as LaunchIcon } from '@mui/icons-material'; -import { Box, Typography } from '@mui/material'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; import { Link } from 'react-router-dom'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/TextCell.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/TextCell.tsx index fffa20128f..a3f78f9ebf 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/TextCell.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/TextCell.tsx @@ -1,6 +1,6 @@ import { FC } from 'react'; -import { Typography } from '@mui/material'; +import Typography from '@mui/material/Typography'; type TextCellProps = { value: string; diff --git a/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx b/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx index 535e292f17..f2e2f630f2 100644 --- a/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx +++ b/packages/apps/dashboard/client/src/features/leaderboard/ui/useDataGrid.tsx @@ -1,7 +1,8 @@ import { useMemo } from 'react'; import HelpOutlineIcon from '@mui/icons-material/HelpOutline'; -import { Box, Typography } from '@mui/material'; +import Box from '@mui/material/Box'; +import Typography from '@mui/material/Typography'; import { GridColDef, GridRenderCellParams } from '@mui/x-data-grid'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx index 45b5dccc93..8801d5d77a 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/EscrowAddress.tsx @@ -4,11 +4,13 @@ import Chip from '@mui/material/Chip'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import { AddressDetailsEscrow } from '@/features/searchResults/model/addressDetailsSchema'; -import HmtBalance from '@/features/searchResults/ui/HmtBalance'; -import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; import SectionWrapper from '@/shared/ui/SectionWrapper'; +import { AddressDetailsEscrow } from '../model/addressDetailsSchema'; + +import HmtBalance from './HmtBalance'; +import TitleSectionWrapper from './TitleSectionWrapper'; + type Props = { data: AddressDetailsEscrow; }; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/HmtBalance.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/HmtBalance.tsx index abcb587b2a..aa4f482b53 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/HmtBalance.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/HmtBalance.tsx @@ -2,10 +2,10 @@ import { FC } from 'react'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import { NumericFormat } from 'react-number-format'; import useHmtPrice from '@/shared/api/useHmtPrice'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; +import FormattedNumber from '@/shared/ui/FormattedNumber'; type Props = { balance?: number | null; @@ -30,12 +30,7 @@ const HmtBalance: FC = ({ balance }) => { return ( - + = ({ children }) => { diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/StakeInfo.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/StakeInfo.tsx index 299e753836..449d26c9ea 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/StakeInfo.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/StakeInfo.tsx @@ -2,9 +2,9 @@ import { FC } from 'react'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import { NumericFormat } from 'react-number-format'; import { useIsMobile } from '@/shared/hooks/useBreakpoints'; +import FormattedNumber from '@/shared/ui/FormattedNumber'; import SectionWrapper from '@/shared/ui/SectionWrapper'; type Props = { @@ -17,10 +17,8 @@ const renderAmount = (amount: number | null | undefined, isMobile: boolean) => { return ( - diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx index 4f80e41b47..5275c53c20 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletAddress.tsx @@ -2,20 +2,22 @@ import { FC } from 'react'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import { NumericFormat } from 'react-number-format'; + +import { useIsMobile } from '@/shared/hooks/useBreakpoints'; +import FormattedNumber from '@/shared/ui/FormattedNumber'; +import SectionWrapper from '@/shared/ui/SectionWrapper'; import { AddressDetailsOperator, AddressDetailsWallet, -} from '@/features/searchResults/model/addressDetailsSchema'; -import HmtBalance from '@/features/searchResults/ui/HmtBalance'; -import HmtPrice from '@/features/searchResults/ui/HmtPrice'; -import KVStore from '@/features/searchResults/ui/KvStore'; -import ReputationScore from '@/features/searchResults/ui/ReputationScore'; -import StakeInfo from '@/features/searchResults/ui/StakeInfo'; -import TitleSectionWrapper from '@/features/searchResults/ui/TitleSectionWrapper'; -import { useIsMobile } from '@/shared/hooks/useBreakpoints'; -import SectionWrapper from '@/shared/ui/SectionWrapper'; +} from '../model/addressDetailsSchema'; + +import HmtBalance from './HmtBalance'; +import HmtPrice from './HmtPrice'; +import KVStore from './KvStore'; +import ReputationScore from './ReputationScore'; +import StakeInfo from './StakeInfo'; +import TitleSectionWrapper from './TitleSectionWrapper'; type Props = { data: AddressDetailsWallet | AddressDetailsOperator; @@ -55,10 +57,8 @@ const WalletAddress: FC = ({ data }) => { tooltip="Total amount earned by participating in jobs" > - diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx index 50dc2598dc..d2122d76cb 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBody.tsx @@ -10,10 +10,11 @@ import MuiTableBody from '@mui/material/TableBody'; import TableCell from '@mui/material/TableCell'; import TableRow from '@mui/material/TableRow'; -import { PaginatedTransactionDetails } from '@/features/searchResults/model/transactionDetailsSchema'; import handleErrorMessage from '@/shared/lib/handleErrorMessage'; import AbbreviateClipboard from '@/shared/ui/AbbreviateClipboard'; +import { PaginatedTransactionDetails } from '../../model/transactionDetailsSchema'; + import TransactionsTableBodyContainer from './TransactionsTableBodyContainer'; import TransactionsTableCellMethod from './TransactionsTableCellMethod'; import TransactionsTableCellValue from './TransactionsTableCellValue'; diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx index f474999c99..133bb36a0f 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactions/TransactionsTableBodyContainer.tsx @@ -1,6 +1,6 @@ import { FC, PropsWithChildren } from 'react'; -import { Grid } from '@mui/material'; +import Grid from '@mui/material/Grid'; import MuiTableBody from '@mui/material/TableBody'; const TransactionsTableBodyContainer: FC = ({ diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx index f007349ded..2dbe0da623 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/WalletTransactionsTable.tsx @@ -5,12 +5,13 @@ import TableRow from '@mui/material/TableRow'; import Typography from '@mui/material/Typography'; import SimpleBar from 'simplebar-react'; -import useTransactionDetails from '@/features/searchResults/api/useTransactionDetails'; -import usePagination from '@/features/searchResults/hooks/usePagination'; -import TablePagination from '@/features/searchResults/ui/TablePagination'; import useGlobalFiltersStore from '@/shared/store/useGlobalFiltersStore'; import SectionWrapper from '@/shared/ui/SectionWrapper'; +import useTransactionDetails from '../api/useTransactionDetails'; +import usePagination from '../hooks/usePagination'; + +import TablePagination from './TablePagination'; import TransactionsTableBody from './WalletTransactions/TransactionsTableBody'; import TransactionsTableHead from './WalletTransactions/TransactionsTableHead'; diff --git a/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts index 478cc36966..861b903ca0 100644 --- a/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts +++ b/packages/apps/dashboard/client/src/shared/api/useFilteredNetworks.ts @@ -3,10 +3,11 @@ import { useMemo } from 'react'; import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; -import apiPaths from '@/shared/api/apiPaths'; -import httpClient from '@/shared/api/httpClient'; import { networks as allNetworks } from '@/shared/lib/networks'; +import apiPaths from './apiPaths'; +import httpClient from './httpClient'; + const enabledChainsSchema = z.array(z.number()); const useFilteredNetworks = () => { diff --git a/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts b/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts index f75de04957..ad74d8cf2a 100644 --- a/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts +++ b/packages/apps/dashboard/client/src/shared/api/useHmtPrice.ts @@ -1,10 +1,11 @@ import { useQuery } from '@tanstack/react-query'; import { z } from 'zod'; -import apiPaths from '@/shared/api/apiPaths'; -import httpClient from '@/shared/api/httpClient'; import validateResponse from '@/shared/lib/validateResponse'; +import apiPaths from './apiPaths'; +import httpClient from './httpClient'; + const hmtPriceResponseSchema = z.object({ hmtPrice: z.number(), }); diff --git a/packages/apps/dashboard/client/src/shared/ui/FormatNumber/index.tsx b/packages/apps/dashboard/client/src/shared/ui/FormattedNumber/index.tsx similarity index 54% rename from packages/apps/dashboard/client/src/shared/ui/FormatNumber/index.tsx rename to packages/apps/dashboard/client/src/shared/ui/FormattedNumber/index.tsx index eb723acd74..43f4a848dd 100644 --- a/packages/apps/dashboard/client/src/shared/ui/FormatNumber/index.tsx +++ b/packages/apps/dashboard/client/src/shared/ui/FormattedNumber/index.tsx @@ -1,18 +1,22 @@ +import { FC } from 'react'; + import { NumericFormat } from 'react-number-format'; -const FormatNumber = ({ - value, -}: { +type Props = { value: number | string | undefined | null; -}) => { + decimalScale?: number; +}; + +const FormattedNumber: FC = ({ value, decimalScale = 9 }) => { return ( ); }; -export default FormatNumber; +export default FormattedNumber; From 437ad971efc34db8f48975ff06302e412efbec20 Mon Sep 17 00:00:00 2001 From: kirill Date: Tue, 24 Jun 2025 12:05:58 +0300 Subject: [PATCH 25/27] refactor: move env file to shared/config --- .../client/src/features/searchResults/ui/OperatorAddress.tsx | 2 +- packages/apps/dashboard/client/src/shared/api/httpClient.ts | 2 +- .../apps/dashboard/client/src/shared/{lib => config}/env.ts | 0 packages/apps/dashboard/client/src/shared/lib/networks.ts | 2 +- packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx | 2 +- packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx | 2 +- 6 files changed, 5 insertions(+), 5 deletions(-) rename packages/apps/dashboard/client/src/shared/{lib => config}/env.ts (100%) diff --git a/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx index 32d575712f..9f47bdbbc8 100644 --- a/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx +++ b/packages/apps/dashboard/client/src/features/searchResults/ui/OperatorAddress.tsx @@ -9,7 +9,7 @@ import ListItem from '@mui/material/ListItem'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; -import { env } from '@/shared/lib/env'; +import { env } from '@/shared/config/env'; import EntityIcon from '@/shared/ui/EntityIcon'; import SectionWrapper from '@/shared/ui/SectionWrapper'; diff --git a/packages/apps/dashboard/client/src/shared/api/httpClient.ts b/packages/apps/dashboard/client/src/shared/api/httpClient.ts index 9bf75ff916..0a222e29e8 100644 --- a/packages/apps/dashboard/client/src/shared/api/httpClient.ts +++ b/packages/apps/dashboard/client/src/shared/api/httpClient.ts @@ -1,6 +1,6 @@ import axios from 'axios'; -import { env } from '@/shared/lib/env'; +import { env } from '@/shared/config/env'; const httpClient = axios.create({ baseURL: env.VITE_API_URL, diff --git a/packages/apps/dashboard/client/src/shared/lib/env.ts b/packages/apps/dashboard/client/src/shared/config/env.ts similarity index 100% rename from packages/apps/dashboard/client/src/shared/lib/env.ts rename to packages/apps/dashboard/client/src/shared/config/env.ts diff --git a/packages/apps/dashboard/client/src/shared/lib/networks.ts b/packages/apps/dashboard/client/src/shared/lib/networks.ts index c98025eb72..68d850c418 100644 --- a/packages/apps/dashboard/client/src/shared/lib/networks.ts +++ b/packages/apps/dashboard/client/src/shared/lib/networks.ts @@ -1,7 +1,7 @@ import type { Chain } from 'viem/chains'; import * as chains from 'viem/chains'; -import { env } from '@/shared/lib/env'; +import { env } from '@/shared/config/env'; //TODO: temporal fix. Should be fetched from API. https://github.com/humanprotocol/human-protocol/issues/2855 const ENABLED_CHAIN_IDS = env.VITE_ENABLED_CHAIN_IDS; diff --git a/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx b/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx index abefca1e74..1695d72ed0 100644 --- a/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx +++ b/packages/apps/dashboard/client/src/widgets/footer/ui/Footer.tsx @@ -9,7 +9,7 @@ import Box from '@mui/material/Box'; import Link from '@mui/material/Link'; import Typography from '@mui/material/Typography'; -import { env } from '@/shared/lib/env'; +import { env } from '@/shared/config/env'; import DiscordIcon from '@/shared/ui/icons/DiscordIcon'; const StyledLink = styled(Link)(({ theme }) => ({ diff --git a/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx b/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx index 3932680ab3..8b2703c8e4 100644 --- a/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx +++ b/packages/apps/dashboard/client/src/widgets/header/ui/Header.tsx @@ -12,7 +12,7 @@ import styled from '@mui/material/styles/styled'; import Toolbar from '@mui/material/Toolbar'; import { Link } from 'react-router-dom'; -import { env } from '@/shared/lib/env'; +import { env } from '@/shared/config/env'; import LogoBlockIcon from '@/shared/ui/icons/LogoBlockIcon'; import LogoBlockIconMobile from '@/shared/ui/icons/LogoBlockIconMobile'; From bc48b20fdb18cfa1a8ad6edb62db904d183d048b Mon Sep 17 00:00:00 2001 From: kirill Date: Tue, 24 Jun 2025 12:22:29 +0300 Subject: [PATCH 26/27] refactor: running tsc check from pre-commit --- .husky/pre-commit | 2 +- packages/apps/dashboard/client/.lintstagedrc.js | 7 ------- packages/apps/dashboard/client/package.json | 10 ++++++++-- 3 files changed, 9 insertions(+), 10 deletions(-) delete mode 100644 packages/apps/dashboard/client/.lintstagedrc.js diff --git a/.husky/pre-commit b/.husky/pre-commit index b1dd4d8a8e..7c0cca3586 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1,4 @@ -yarn dlx lint-staged +yarn dlx lint-staged && yarn workspaces foreach --all -p run typecheck # Format python file changes cd packages/sdk/python/human-protocol-sdk diff --git a/packages/apps/dashboard/client/.lintstagedrc.js b/packages/apps/dashboard/client/.lintstagedrc.js deleted file mode 100644 index 9d97e5d6f0..0000000000 --- a/packages/apps/dashboard/client/.lintstagedrc.js +++ /dev/null @@ -1,7 +0,0 @@ -export default { - "*.{ts,tsx}": [ - () => "tsc --skipLibCheck --noEmit", - "prettier --write", - "eslint --cache --fix", - ], -}; \ No newline at end of file diff --git a/packages/apps/dashboard/client/package.json b/packages/apps/dashboard/client/package.json index 860fa97a01..8e0eef6f20 100644 --- a/packages/apps/dashboard/client/package.json +++ b/packages/apps/dashboard/client/package.json @@ -9,12 +9,12 @@ "clean": "tsc --build --clean && rm -rf dist", "start": "vite", "build": "tsc --build && vite build", - "lint": "tsc --noEmit --skipLibCheck && eslint . --report-unused-disable-directives --max-warnings 0", + "lint": "yarn typecheck && eslint . --report-unused-disable-directives --max-warnings 0", "lint:fix": "eslint . --fix", "preview": "vite preview", "vercel-build": "yarn workspace human-protocol build:libs && yarn build", "test": "exit 0", - "tsc": "tsc --noEmit" + "typecheck": "tsc --noEmit" }, "dependencies": { "@emotion/react": "^11.11.4", @@ -64,5 +64,11 @@ "typescript": "^5.6.3", "typescript-eslint": "^8.33.0", "vite": "^6.2.4" + }, + "lint-staged": { + "*.{ts,tsx}": [ + "prettier --write", + "eslint --cache --fix" + ] } } From cd641a03252ae1cc345c7f4d8570e8c1c5262b0b Mon Sep 17 00:00:00 2001 From: kirill Date: Tue, 24 Jun 2025 12:33:33 +0300 Subject: [PATCH 27/27] minor pre-commit hook fix --- .husky/pre-commit | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.husky/pre-commit b/.husky/pre-commit index 7c0cca3586..19c3fa6e16 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1,5 @@ -yarn dlx lint-staged && yarn workspaces foreach --all -p run typecheck +yarn dlx lint-staged +yarn workspaces foreach --all -p run typecheck # Format python file changes cd packages/sdk/python/human-protocol-sdk