Mark Sinclair
5dadd73dfd
* fixed styled component * dynamic colour for isSelected * corrected type names * wrapped nav for routing and positioning of main section and dynamic colour for selected section * overview info panes added * quick refactor break out components separately * WorldMap implemented but not data * map changed and updated to shades correctly * live data in cards * added any types for react simple map * nested routing added but needs tidying and types refactored * added tooltip to worldmap * worldmap killed unused props * updated MUI version to stable v5 * dark mode and ContentCard refactor complete * refactor of DarkMode context and API into class and context setup * context refactor for multiple APIs at top level * mui typography used for error msging instead of jsx/html * added typeDefs for node api types * small changes to sx styling * added types for api responses and main context * promiseAll for better error handling of individual async calls * switch out to live API for country nodes * removal of unnecessary type any and shortening sx style block * routing and basic mixnodes table and linking * fixed TS error handling and ts exclude files * refactor of class API fetch reqs * renaming to more appropriate explorer-api * broken - passing to Fouad * fix for types in context main * mixnode detail page * rebasing back before fetch mixnode by ID was implemented * added basic cache for huge dump of mixnode data * broken mixnodes context * fixed mixnode detail fetch * added hardcoded BondBreakdown section * added 2 col table for detail page and small refactor of ApiState type for consistent use throughout app * basic chart with basic dark/theme implemented - no live data * added scrollToTop useRef for Detail page * tidied grid items * media qry for smaller screens * small changes * added live data to bonds breakdown 1/2 * small changes/tweaks * Bondbreakdown retrieves live data * mixnode stats using live data * added node status live data * uptime story added with live data * date formatting added * mixnode map * error handling for mixnode stats * error handling for port stats * improved error handling for table - unfinished * error handling for mixnode table * handle Loading state for 2colSmallTable * Uptime story loading handling * set up data grid component * remove mixnode value check as handled inside MixnodesDataGrid component * use loading prop in data grid component * undo unintentional code formatting * map blur and linkable data-grid added * getting ready for gateways and removing con logs * quickfix for map blur * PR comment changes * refactored data grid for reuseability * Link to open Big Dipper for Blocks * passing element to title instead of string for routing to Big Dipper * quick fix for element passed as title for contentCard * fix for colour coding nodes * nuts and bolts of search and results per page are working * media query for responsive search and no-per-page toolbar * broke out search and pagesize to separate toolbar * fix for going back to mixnodes datagrid and refetching * corrected typings for WorldMap * removed API for topojson * Cleaner implementation of formatting inline for datagrid * added Type to Datagrid Rows for mixnode * removed optional from type for Datagrid * added page listing the Gateway nodes * adding clickable location to handleSearch * tidying util functions and removing dead useEffect * Add missing constant * Validators link to Big Dipper * added validators link to side nav as per Issues card * SVG icons * PR tweak to move logic to routes * removed dead code post rebase * fixed light dark mode for DataGrid * light dark mode works on SVGs in Nav * moving logic back to Nav to avoid window object issues * neater ternary for SVG icons dark mode * Better Linking/Styling for cells * corrected prop/attr name in svg to Reactify it * moved api url to constants * SVGs dark now governed by context not props so reverting renderIcon method back to key value setup * percentage for bond total added * SVGs for Overview cards Mixnodes Gateways and Validators * decimalised formatted punks and % of bond for BondBreakdown card * number formatting via validator module * adding cossmjs math pkg * unfinished refactor BondBreakdown * first few ui tweaks * Adding google font Open Sans as per designs * DataGrid unstylable in theme so nuking in css * adding theming to Block Height card not hardcoded colours * DataGrid styling * Nav styling colours but without hover fix * theme for bond breakdown * killing con logs * Datagrid styling * Nav bar working * added lines to nav * removed cursive from fallback fonts * trimming and refactoring * removed dead isActive code from nav options * Color correction for theme on 2col table * Moved cell styles out to UniversalDatagrid for reuseability * Nav colors moved to theme * Removing comments and dead code * DataGrid UI improvements * theming for Overview content card * Bonds updated from UPUNK to PUNK * corrected SVG warning on stroke-width * added Boolean class instead of ternary * fixing up svg attr to jsx props * merging UPUNK changes into ui-tweaks * corrected SVG warning on stroke-width * added Boolean class instead of ternary * last instance of Boolean * BondBreakdown handles 0 delegations * formatting for webpack config and svgs * Add `npm run lint` and `npm run lint:fix` targets to `package.json` * Allow `.vscode` directories - exclude them individually like has been done already in the `.gitignore` directory * Add `vscode` action to run `eslint` on save for the `/explorer/**` sub-directory * eslint auto fix * Fix some easy eslint issues * removing grid pipes and pastel map colors * Grid xl lg values to align with Search Toolbar * GitHub Actions: do not trigger Rust actions when the paths are only `/explorer/**` See https://docs.github.com/en/actions/learn-github-actions/workflow-syntax-for-github-actions#onpushpull_requestpaths for details. * GitHub Actions: run eslint and annotate pull requests * socials added to Appbar and Footer * smaller darkmode icon for mobile * cleaner code for nav dark light selector * almost all lint fixes * post linting Nav fix * killed con log and removed unused dep * ref type and removed 1x ts ignore from worldMap * disabl nested tern w/ nav is refactored on diff br * icons smaller put into mui List format * Added hover effect to match DarkLight switch * ts ignore for worldMap vs no ts decl * parking changes * Flipped to MUI SVGs * re-added external links to Socials * nav functionality working * spacing on Mixnode detail page * datagrid alignment & detail page spacing * map but no datagrid yet * killed old SVGs now using mui icons * added palette instead of strings * Mixnode Map page working still needs tidying * better lg xl responsive on Overview and sanitized Page Titles * removed typography from imports as unused now * search, sort working & added LG XL responsiveness * Routing root reqs direct to Overview * basic 404 page and btn back to overview * killed fragments and comments * updated Bond total in column * Change bond col to type number not text * Added field to DataGrid and updated MixnodeToGridrow logic * Added type number so sorting works properly. * added %self to Detail page * basic scroll working desktop * delegations now popout and scroll according to designs * added stickyHeader and killed dead code * ExpandMore only renders if delegations exist * killed old svg icons * added theme to Overview SVGs * bringing Title into other pages * linting fix * pagination and spacing of gateways cols * linting fix * style override for pagination * added hamburger and changed appbar to fixed * bringing in other lint fix to pass linting * PR feedback changes * Add README.md for theme customisation * Add hook to get app state context * Add Nym theme typings to MUI `Theme` types * Use new theme provider * Fixing up components to use theme typings Updated Overview Footer and ContentCard Footer and Nav socials Title, Nav chevron and Nav SVGs Overview SVGs Light Dark switch BondBreakdown and 2 col table DataGrid and 2col Tables WorldMap UptimeChart and theme changes WorldMap colors merge changes added StatsCard for overview * Bug fix: do no close drawer when clicking on mixnodes or gateways * Theme primary colour set to orange highlight, so that default/primary actions are clear to the user. This fixes colours on the pagination page list. * Fixing up map projection * Map view uses stroke colour from theme * added useTheme from correct pkg * react types upgrade to kill SXProps issue * SXProps fix removing dead mixins from fixed AppBar * Scale of Map changed to see more countries * return type for main Context required * Fixed map so more countries show * type for useMainContext hook added * Remove unused file * Tidy up imports * Remove use of `any` by using strongly typed hook to get the app state * Remove module declaration so that @types/react-simple-maps is used * API map response changed to indexed object * Map view uses correct typings from `@types/react-simple-maps` and `d3-scale` * Make content responsive and fills the view when screen widest * Link network explorer in title to overview page * Increase size of card headers to differentiate * Fix column widths * Fixed icons showing incorrectly the stats card in mixnode detail view * Set default sort on mixnodes and gateways to be `bond` descending. There is an error in MUI data-grid that does not adjust the sort caret based on initial `sortModel` value. Needs investigation. * GitHub Action for deployment: prefix with network explorer to stop collisions with other deployment projects * Mixnode list: fix up header title for `host` * Fix up notification URLs and tidy up readme * Fix up license information Co-authored-by: Adrian Thompson <adrian@nymtech.net> Co-authored-by: Adrian Thompson <adrianthompson@Adrians-MacBook-Air.local> Co-authored-by: fmtabbara <fmtabbara@hotmail.co.uk> Co-authored-by: Aid19801 <adrianThompson19801@gmail.com>
Nym Network Explorer
The network explorer lets you explore the Nym network.
Getting started
You will need:
- NodeJS (use
nvm installto automatically install the correct version) npm
From the explorer directory of the nym monorepo, run:
npm install
npm run start
You can then open a browser to http://localhost:3000 and start development.
Development
Documentation for developers can be found here.
Deployment
Build the UI with:
npm install
npm run build
The output will be in the dist directory. Serve this with nginx or httpd.
Make sure you have built the explorer-api and are running it as a service proxied through
nginx or httpd so that both the UI and API are running on the same host.
License
Please see the project README and the LICENSES directory for license details for all Nym software.
Contributing
If you would like to contribute to the Network Explorer send us a PR or
raise an issue on GitHub and tag them with network-explorer.
Development
Please see development docs here for more information on the structure and design of this app.