Skip to content

Commit

Permalink
Merge pull request #662 from oceanprotocol/issue-661-dashboard-connec…
Browse files Browse the repository at this point in the history 
…ted-nodes

Dashboard UI update: connected nodes
  • Loading branch information
@jamiehewitt15
jamiehewitt15 authored Sep 3, 2024
2 parents a221025 + e2a20b6 commit 1bdb52e
Show file tree
Hide file tree
Showing 11 changed files with 34 additions and 19 deletions.
1 change: 0 additions & 1 deletion dashboard/src/components/JobStatusPanel/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import { getStatusColors } from '@/shared/utils/jobs'
import Alert from '@mui/material/Alert'

export default function JobStatusPanel(props: any) {
console.log('PROPS: ', props)
const color: string = props.job ? getStatusColors(props.job.status) : 'black'
return (
<div>
Expand Down
39 changes: 29 additions & 10 deletions dashboard/src/components/NodePeers/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,12 @@ import styles from './style.module.css'
import Spinner from '../Spinner'
import { truncateString } from '../../shared/utils/truncateString'
import Copy from '../Copy'
import { Button, Typography } from '@mui/material'

export default function NodePeers() {
const [nodePeers, setNodePeers] = useState<string[]>([])
const [isLoadingNodePeers, setLoadingNodePeers] = useState(true)
const [showAll, setShowAll] = useState(false)

const fetchNodePeers = async () => {
setLoadingNodePeers(true)
Expand Down Expand Up @@ -38,23 +40,40 @@ export default function NodePeers() {
return () => clearInterval(intervalId)
}, [])

// Determine the nodes to display
const displayedNodePeers = showAll ? nodePeers : nodePeers.slice(0, 10)

return (
<div className={styles.nodes}>
<div className={styles.title24}>Connected Nodes (Total {nodePeers.length})</div>
{isLoadingNodePeers && (

{isLoadingNodePeers ? (
<div className={styles.loaderContainer}>
<Spinner />
</div>
)}

{nodePeers.length > 0 ? (
nodePeers.map((address) => (
<div className={styles.nodeAddress} key={address}>
{truncateString(address, 12)} <Copy text={address} />
</div>
))
) : (
<div>There are no nodes connected</div>
<>
{nodePeers.length > 0 ? (
displayedNodePeers.map((address) => (
<div className={styles.nodeAddress} key={address}>
{truncateString(address, 12)} <Copy text={address} />
</div>
))
) : (
<Typography variant="body1">There are no nodes connected</Typography>
)}

{!showAll && nodePeers.length > 10 && (
<Button onClick={() => setShowAll(true)} variant="text" color="primary">
Show All
</Button>
)}
{showAll && nodePeers.length > 10 && (
<Button onClick={() => setShowAll(false)} variant="text" color="primary">
Show Less
</Button>
)}
</>
)}
</div>
)
Expand Down
2 changes: 1 addition & 1 deletion dist/dashboard/404.html
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><title>404: This page could not be found</title><meta name="next-head-count" content="3"/><link rel="preload" href="/_next/static/css/28e16ff29a58442c.css" as="style" crossorigin=""/><link rel="stylesheet" href="/_next/static/css/28e16ff29a58442c.css" crossorigin="" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" crossorigin="" nomodule="" src="/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js"></script><script src="/_next/static/chunks/webpack-fe817b75e2ea8908.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/framework-ca706bf673a13738.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/main-66d85fc6f7952338.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/pages/_app-8a605b014f26ab32.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/pages/_error-e4216aab802f5810.js" defer="" crossorigin=""></script><script src="/_next/static/TKOP_tQWDQuagCxlBxyhs/_buildManifest.js" defer="" crossorigin=""></script><script src="/_next/static/TKOP_tQWDQuagCxlBxyhs/_ssgManifest.js" defer="" crossorigin=""></script></head><body><div id="__next"><div data-rk=""><style>[data-rk]{--rk-blurs-modalOverlay:blur(0px);--rk-fonts-body:SFRounded, ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--rk-radii-actionButton:9999px;--rk-radii-connectButton:12px;--rk-radii-menuButton:12px;--rk-radii-modal:24px;--rk-radii-modalMobile:28px;--rk-colors-accentColor:#0E76FD;--rk-colors-accentColorForeground:#FFF;--rk-colors-actionButtonBorder:rgba(0, 0, 0, 0.04);--rk-colors-actionButtonBorderMobile:rgba(0, 0, 0, 0.06);--rk-colors-actionButtonSecondaryBackground:rgba(0, 0, 0, 0.06);--rk-colors-closeButton:rgba(60, 66, 66, 0.8);--rk-colors-closeButtonBackground:rgba(0, 0, 0, 0.06);--rk-colors-connectButtonBackground:#FFF;--rk-colors-connectButtonBackgroundError:#FF494A;--rk-colors-connectButtonInnerBackground:linear-gradient(0deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.06));--rk-colors-connectButtonText:#25292E;--rk-colors-connectButtonTextError:#FFF;--rk-colors-connectionIndicator:#30E000;--rk-colors-downloadBottomCardBackground:linear-gradient(126deg, rgba(255, 255, 255, 0) 9.49%, rgba(171, 171, 171, 0.04) 71.04%), #FFFFFF;--rk-colors-downloadTopCardBackground:linear-gradient(126deg, rgba(171, 171, 171, 0.2) 9.49%, rgba(255, 255, 255, 0) 71.04%), #FFFFFF;--rk-colors-error:#FF494A;--rk-colors-generalBorder:rgba(0, 0, 0, 0.06);--rk-colors-generalBorderDim:rgba(0, 0, 0, 0.03);--rk-colors-menuItemBackground:rgba(60, 66, 66, 0.1);--rk-colors-modalBackdrop:rgba(0, 0, 0, 0.3);--rk-colors-modalBackground:#FFF;--rk-colors-modalBorder:transparent;--rk-colors-modalText:#25292E;--rk-colors-modalTextDim:rgba(60, 66, 66, 0.3);--rk-colors-modalTextSecondary:rgba(60, 66, 66, 0.6);--rk-colors-profileAction:#FFF;--rk-colors-profileActionHover:rgba(255, 255, 255, 0.5);--rk-colors-profileForeground:rgba(60, 66, 66, 0.06);--rk-colors-selectedOptionBorder:rgba(60, 66, 66, 0.1);--rk-colors-standby:#FFD641;--rk-shadows-connectButton:0px 4px 12px rgba(0, 0, 0, 0.1);--rk-shadows-dialog:0px 8px 32px rgba(0, 0, 0, 0.32);--rk-shadows-profileDetailsAction:0px 2px 6px rgba(37, 41, 46, 0.04);--rk-shadows-selectedOption:0px 2px 6px rgba(0, 0, 0, 0.24);--rk-shadows-selectedWallet:0px 2px 6px rgba(0, 0, 0, 0.12);--rk-shadows-walletLogo:0px 2px 16px rgba(0, 0, 0, 0.16);}</style><div style="font-family:system-ui,&quot;Segoe UI&quot;,Roboto,Helvetica,Arial,sans-serif,&quot;Apple Color Emoji&quot;,&quot;Segoe UI Emoji&quot;;height:100vh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center"><div style="line-height:48px"><style>body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}</style><h1 class="next-error-h1" style="display:inline-block;margin:0 20px 0 0;padding-right:23px;font-size:24px;font-weight:500;vertical-align:top">404</h1><div style="display:inline-block"><h2 style="font-size:14px;font-weight:400;line-height:28px">This page could not be found<!-- -->.</h2></div></div></div></div></div><script id="__NEXT_DATA__" type="application/json" crossorigin="">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{},"buildId":"TKOP_tQWDQuagCxlBxyhs","nextExport":true,"isFallback":false,"gip":true,"scriptLoader":[]}</script></body></html>
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><title>404: This page could not be found</title><meta name="next-head-count" content="3"/><link rel="preload" href="/_next/static/css/28e16ff29a58442c.css" as="style" crossorigin=""/><link rel="stylesheet" href="/_next/static/css/28e16ff29a58442c.css" crossorigin="" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" crossorigin="" nomodule="" src="/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js"></script><script src="/_next/static/chunks/webpack-fe817b75e2ea8908.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/framework-ca706bf673a13738.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/main-66d85fc6f7952338.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/pages/_app-8a605b014f26ab32.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/pages/_error-e4216aab802f5810.js" defer="" crossorigin=""></script><script src="/_next/static/Y6w7oMjRjI-tffwCvjHC1/_buildManifest.js" defer="" crossorigin=""></script><script src="/_next/static/Y6w7oMjRjI-tffwCvjHC1/_ssgManifest.js" defer="" crossorigin=""></script></head><body><div id="__next"><div data-rk=""><style>[data-rk]{--rk-blurs-modalOverlay:blur(0px);--rk-fonts-body:SFRounded, ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--rk-radii-actionButton:9999px;--rk-radii-connectButton:12px;--rk-radii-menuButton:12px;--rk-radii-modal:24px;--rk-radii-modalMobile:28px;--rk-colors-accentColor:#0E76FD;--rk-colors-accentColorForeground:#FFF;--rk-colors-actionButtonBorder:rgba(0, 0, 0, 0.04);--rk-colors-actionButtonBorderMobile:rgba(0, 0, 0, 0.06);--rk-colors-actionButtonSecondaryBackground:rgba(0, 0, 0, 0.06);--rk-colors-closeButton:rgba(60, 66, 66, 0.8);--rk-colors-closeButtonBackground:rgba(0, 0, 0, 0.06);--rk-colors-connectButtonBackground:#FFF;--rk-colors-connectButtonBackgroundError:#FF494A;--rk-colors-connectButtonInnerBackground:linear-gradient(0deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.06));--rk-colors-connectButtonText:#25292E;--rk-colors-connectButtonTextError:#FFF;--rk-colors-connectionIndicator:#30E000;--rk-colors-downloadBottomCardBackground:linear-gradient(126deg, rgba(255, 255, 255, 0) 9.49%, rgba(171, 171, 171, 0.04) 71.04%), #FFFFFF;--rk-colors-downloadTopCardBackground:linear-gradient(126deg, rgba(171, 171, 171, 0.2) 9.49%, rgba(255, 255, 255, 0) 71.04%), #FFFFFF;--rk-colors-error:#FF494A;--rk-colors-generalBorder:rgba(0, 0, 0, 0.06);--rk-colors-generalBorderDim:rgba(0, 0, 0, 0.03);--rk-colors-menuItemBackground:rgba(60, 66, 66, 0.1);--rk-colors-modalBackdrop:rgba(0, 0, 0, 0.3);--rk-colors-modalBackground:#FFF;--rk-colors-modalBorder:transparent;--rk-colors-modalText:#25292E;--rk-colors-modalTextDim:rgba(60, 66, 66, 0.3);--rk-colors-modalTextSecondary:rgba(60, 66, 66, 0.6);--rk-colors-profileAction:#FFF;--rk-colors-profileActionHover:rgba(255, 255, 255, 0.5);--rk-colors-profileForeground:rgba(60, 66, 66, 0.06);--rk-colors-selectedOptionBorder:rgba(60, 66, 66, 0.1);--rk-colors-standby:#FFD641;--rk-shadows-connectButton:0px 4px 12px rgba(0, 0, 0, 0.1);--rk-shadows-dialog:0px 8px 32px rgba(0, 0, 0, 0.32);--rk-shadows-profileDetailsAction:0px 2px 6px rgba(37, 41, 46, 0.04);--rk-shadows-selectedOption:0px 2px 6px rgba(0, 0, 0, 0.24);--rk-shadows-selectedWallet:0px 2px 6px rgba(0, 0, 0, 0.12);--rk-shadows-walletLogo:0px 2px 16px rgba(0, 0, 0, 0.16);}</style><div style="font-family:system-ui,&quot;Segoe UI&quot;,Roboto,Helvetica,Arial,sans-serif,&quot;Apple Color Emoji&quot;,&quot;Segoe UI Emoji&quot;;height:100vh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center"><div style="line-height:48px"><style>body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}</style><h1 class="next-error-h1" style="display:inline-block;margin:0 20px 0 0;padding-right:23px;font-size:24px;font-weight:500;vertical-align:top">404</h1><div style="display:inline-block"><h2 style="font-size:14px;font-weight:400;line-height:28px">This page could not be found<!-- -->.</h2></div></div></div></div></div><script id="__NEXT_DATA__" type="application/json" crossorigin="">{"props":{"pageProps":{"statusCode":404}},"page":"/_error","query":{},"buildId":"Y6w7oMjRjI-tffwCvjHC1","nextExport":true,"isFallback":false,"gip":true,"scriptLoader":[]}</script></body></html>
1 change: 0 additions & 1 deletion dist/dashboard/_next/static/TKOP_tQWDQuagCxlBxyhs/_buildManifest.js
View file

This file was deleted.

2 changes: 1 addition & 1 deletion ...c/rkuUjlvom16kl1FT5vKpM/_buildManifest.js → ...c/Y6w7oMjRjI-tffwCvjHC1/_buildManifest.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 ...tic/TKOP_tQWDQuagCxlBxyhs/_ssgManifest.js → ...tic/Y6w7oMjRjI-tffwCvjHC1/_ssgManifest.js
View file
File renamed without changes.
2 changes: 1 addition & 1 deletion ...ic/chunks/pages/index-d29bcc128e0b545b.js → ...ic/chunks/pages/index-0d98b4fd6834b567.js
View file

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion dist/dashboard/_next/static/chunks/pages/index-65a2360df4a5ce0c.js
View file

This file was deleted.

1 change: 0 additions & 1 deletion dist/dashboard/_next/static/rkuUjlvom16kl1FT5vKpM/_ssgManifest.js
View file

This file was deleted.

Loading

0 comments on commit 1bdb52e

Please sign in to comment.