From 48c008c5863371d7ea5a6520cbe6f5b012fb0cce Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 12 Sep 2023 09:20:53 -0600
Subject: [PATCH 01/18] chore(webapp): add key icon for account keys

---
 webapp/src/components/AccountInfo/index.js   |  5 ++--
 webapp/src/components/AccountInfo/styles.js  |  7 +++++
 webapp/src/components/MoreInfoModal/index.js | 29 +++++++++++++-------
 webapp/src/components/NodeCard/NodesCard.js  |  3 +-
 4 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/webapp/src/components/AccountInfo/index.js b/webapp/src/components/AccountInfo/index.js
index fcc0659c..117daff9 100644
--- a/webapp/src/components/AccountInfo/index.js
+++ b/webapp/src/components/AccountInfo/index.js
@@ -9,6 +9,7 @@ import Accordion from '@mui/material/Accordion'
 import AccordionSummary from '@mui/material/AccordionSummary'
 import AccordionDetails from '@mui/material/AccordionDetails'
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
+import KeyOutlinedIcon from '@mui/icons-material/KeyOutlined';
 
 import RicardianContract from '../RicardianContract'
 import ContractActions from '../ContractActions'
@@ -116,7 +117,7 @@ const AccountInfo = ({
       {!!info && (
         <>
           <div className={classes.boxHeaderCard}>
-            <div className="identicon">
+            <div className={`identicon ${classes.cardPadding}`}>
               <div className={classes.iconBorder}>
                 <Identicon
                   string={info.account_name || 'default'}
@@ -165,7 +166,7 @@ const AccountInfo = ({
                       <dt className={classes.keyItem}>
                         <Typography>{key.label}</Typography>
                         {key.value ? (
-                          <MoreInfoModal>
+                          <MoreInfoModal Icon={KeyOutlinedIcon}>
                             <Typography className={classes.keyLabel}>
                               {key.value}
                             </Typography>
diff --git a/webapp/src/components/AccountInfo/styles.js b/webapp/src/components/AccountInfo/styles.js
index 22624f4f..941dae04 100644
--- a/webapp/src/components/AccountInfo/styles.js
+++ b/webapp/src/components/AccountInfo/styles.js
@@ -28,7 +28,9 @@ export default (theme) => ({
     display: 'flex',
     textTransform: 'capitalize',
     justifyContent: 'space-between',
+    alignItems: 'center',
     minWidth: '100px',
+    paddingTop: theme.spacing(1),
   },
   keyIcon: {
     marginRight: theme.spacing(1),
@@ -105,4 +107,9 @@ export default (theme) => ({
     justifyContent: 'center',
     alignItems: 'center',
   },
+  cardPadding: {
+    [theme.breakpoints.up('lg')]: {
+      paddingRight: theme.spacing(4),
+    },
+  },
 })
diff --git a/webapp/src/components/MoreInfoModal/index.js b/webapp/src/components/MoreInfoModal/index.js
index 3bbca070..27ba05ab 100644
--- a/webapp/src/components/MoreInfoModal/index.js
+++ b/webapp/src/components/MoreInfoModal/index.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React, { useState, memo } from 'react'
 import { makeStyles } from '@mui/styles'
 import { useTranslation } from 'react-i18next'
 import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'
@@ -10,7 +10,7 @@ import styles from './styles'
 
 const useStyles = makeStyles(styles)
 
-const MoreInfoModal = ({ hideCloseButton, children }) => {
+const MoreInfoModal = ({ hideCloseButton, Icon, children }) => {
   const classes = useStyles()
   const { t } = useTranslation()
   const [anchorEl, setAnchorEl] = useState(null)
@@ -26,12 +26,21 @@ const MoreInfoModal = ({ hideCloseButton, children }) => {
   return (
     <>
       <MUITooltip title={t('moreInfo')} arrow placement="right">
-        <InfoOutlinedIcon
-          className={classes.clickableIcon}
-          onClick={(e) => {
-            handlePopoverOpen(e.target)
-          }}
-        />
+        {Icon ? (
+          <Icon
+            className={classes.clickableIcon}
+            onClick={(e) => {
+              handlePopoverOpen(e.target)
+            }}
+          />
+        ) : (
+          <InfoOutlinedIcon
+            className={classes.clickableIcon}
+            onClick={(e) => {
+              handlePopoverOpen(e.target)
+            }}
+          />
+        )}
       </MUITooltip>
       <Tooltip
         anchorEl={anchorEl}
@@ -45,8 +54,8 @@ const MoreInfoModal = ({ hideCloseButton, children }) => {
   )
 }
 
-Tooltip.defaultProps = {
+MoreInfoModal.defaultProps = {
   hideCloseButton: false,
 }
 
-export default MoreInfoModal
+export default memo(MoreInfoModal)
diff --git a/webapp/src/components/NodeCard/NodesCard.js b/webapp/src/components/NodeCard/NodesCard.js
index 3395c38f..02fd61c8 100644
--- a/webapp/src/components/NodeCard/NodesCard.js
+++ b/webapp/src/components/NodeCard/NodesCard.js
@@ -6,6 +6,7 @@ import { makeStyles } from '@mui/styles'
 import CardHeader from '@mui/material/CardHeader'
 import CardContent from '@mui/material/CardContent'
 import Chip from '@mui/material/Chip'
+import KeyOutlinedIcon from '@mui/icons-material/KeyOutlined';
 import 'flag-icon-css/css/flag-icons.css'
 
 import ChipList from '../ChipList'
@@ -51,7 +52,7 @@ const NodesCard = ({ nodes }) => {
         {Object.keys(keys).map((key, i) => (
           <div key={i} className={classes.keysContainer}>
             <p className={classes.bold}>{key}:</p>
-            <MoreInfoModal>
+            <MoreInfoModal Icon={KeyOutlinedIcon}>
               <p className={classes.keys}>{keys[key]}</p>
             </MoreInfoModal>
           </div>

From 2a6bb515dee01e4dde84eddbd5b5474c80d165cc Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 12 Sep 2023 09:26:54 -0600
Subject: [PATCH 02/18] feat(webapp): change select for autocomplete field

---
 .../src/components/ContractActions/index.js   | 34 +++++++++----------
 1 file changed, 16 insertions(+), 18 deletions(-)

diff --git a/webapp/src/components/ContractActions/index.js b/webapp/src/components/ContractActions/index.js
index 4838ec26..eea82d4c 100644
--- a/webapp/src/components/ContractActions/index.js
+++ b/webapp/src/components/ContractActions/index.js
@@ -2,10 +2,9 @@ import React, { useState, useEffect } from 'react'
 import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import { makeStyles } from '@mui/styles'
-import MenuItem from '@mui/material/MenuItem'
-import Select from '@mui/material/Select'
+import Autocomplete from '@mui/material/Autocomplete'
 import FormControl from '@mui/material/FormControl'
-import InputLabel from '@mui/material/InputLabel'
+import TextField from '@mui/material/TextField'
 
 import ContractActionForm from '../ContractActionForm'
 
@@ -32,25 +31,24 @@ const ContractActions = ({ accountName, abi, onSubmitAction }) => {
   return (
     <div className={classes.formControl}>
       <FormControl variant="outlined" className={classes.formControl}>
-        <InputLabel id="actionNameLabel">{t('action')}</InputLabel>
-        <Select
-          labelId="actionNameLabel"
-          id="actionName"
-          value={action}
-          onChange={(event) => setAction(event.target.value)}
-          label={t('action')}
-        >
-          {actions.map((item) => (
-            <MenuItem key={`action-menu-item-${item}`} value={item}>
-              {item}
-            </MenuItem>
-          ))}
-        </Select>
+        <Autocomplete
+            id="actionName"
+            labelId="actionNameLabel"
+            options={actions}
+            value={action}
+            inputValue={action}
+            onChange={(_e, value) => setAction(value || '')}
+            onInputChange={(_e, value) => setAction(value || '')}
+            renderInput={params => (
+              <TextField {...params} label={t('action')} />
+            )}
+            noOptionsText={t('noOptions')}
+          />
       </FormControl>
 
       <ContractActionForm
         accountName={accountName}
-        action={action}
+        action={actions.find(element => element === action)}
         abi={abi}
         onSubmitAction={onSubmitAction}
       />

From b94dd3df601e2543775cf663791d06c6e1c0c69c Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 12 Sep 2023 10:05:14 -0600
Subject: [PATCH 03/18] chore(webapp): remove description list and fix label id

---
 webapp/src/components/AccountInfo/index.js    | 34 +++++++++----------
 .../src/components/ContractActions/index.js   |  2 +-
 .../src/components/RicardianContract/index.js | 16 +++++----
 webapp/src/routes/BlockDistribution/index.js  |  4 +--
 webapp/src/routes/CPUBenchmark/index.js       |  4 +--
 webapp/src/routes/MissedBlocks/index.js       |  4 +--
 6 files changed, 33 insertions(+), 31 deletions(-)

diff --git a/webapp/src/components/AccountInfo/index.js b/webapp/src/components/AccountInfo/index.js
index 117daff9..dc483b48 100644
--- a/webapp/src/components/AccountInfo/index.js
+++ b/webapp/src/components/AccountInfo/index.js
@@ -160,24 +160,22 @@ const AccountInfo = ({
                 {t('keys')}
               </Typography>
               <div className="keys">
-                <dl>
-                  {info.keys.map((key) => (
-                    <span key={`account-key-${key.label}`}>
-                      <dt className={classes.keyItem}>
-                        <Typography>{key.label}</Typography>
-                        {key.value ? (
-                          <MoreInfoModal Icon={KeyOutlinedIcon}>
-                            <Typography className={classes.keyLabel}>
-                              {key.value}
-                            </Typography>
-                          </MoreInfoModal>
-                        ) : (
-                          <p>-</p>
-                        )}
-                      </dt>
-                    </span>
-                  ))}
-                </dl>
+                {info.keys.map(key => (
+                  <span key={`account-key-${key.label}`}>
+                    <div className={classes.keyItem}>
+                      <Typography>{key.label}</Typography>
+                      {key.value ? (
+                        <MoreInfoModal Icon={KeyOutlinedIcon}>
+                          <Typography className={classes.keyLabel}>
+                            {key.value}
+                          </Typography>
+                        </MoreInfoModal>
+                      ) : (
+                        <p>-</p>
+                      )}
+                    </div>
+                  </span>
+                ))}
               </div>
             </div>
           </div>
diff --git a/webapp/src/components/ContractActions/index.js b/webapp/src/components/ContractActions/index.js
index eea82d4c..11be6125 100644
--- a/webapp/src/components/ContractActions/index.js
+++ b/webapp/src/components/ContractActions/index.js
@@ -33,7 +33,7 @@ const ContractActions = ({ accountName, abi, onSubmitAction }) => {
       <FormControl variant="outlined" className={classes.formControl}>
         <Autocomplete
             id="actionName"
-            labelId="actionNameLabel"
+            labelid="actionNameLabel"
             options={actions}
             value={action}
             inputValue={action}
diff --git a/webapp/src/components/RicardianContract/index.js b/webapp/src/components/RicardianContract/index.js
index 71a01224..960a2bef 100644
--- a/webapp/src/components/RicardianContract/index.js
+++ b/webapp/src/components/RicardianContract/index.js
@@ -35,12 +35,16 @@ const RicardianContract = ({ abi, hash }) => {
               onError={useDefaultLogo}
             />
             <div className={classes.boxText}>
-              <Typography color="primary" variant="h5">
-                {_title || name}
-              </Typography>
-              <Typography color="primary" variant="subtitle2">
-                {version}
-              </Typography>
+              {_title && name && (
+                <Typography color="primary" variant="h5">
+                  {_title || name}
+                </Typography>
+              )}
+              {version && (
+                <Typography color="primary" variant="subtitle2">
+                  {version}
+                </Typography>
+              )}
             </div>
           </div>
           <Divider className={classes.divider} />
diff --git a/webapp/src/routes/BlockDistribution/index.js b/webapp/src/routes/BlockDistribution/index.js
index bb7ae054..eb7068a8 100644
--- a/webapp/src/routes/BlockDistribution/index.js
+++ b/webapp/src/routes/BlockDistribution/index.js
@@ -103,11 +103,11 @@ const BlockDistribution = () => {
           </Typography>
           <div className={classes.formControl}>
             <FormControl variant="standard">
-              <InputLabel id="demo-simple-select-label">
+              <InputLabel id="select-range-label">
                 {t('timeFrame')}
               </InputLabel>
               <Select
-                labelId="demo-simple-select-label"
+                labelid="select-range-label"
                 value={range}
                 onChange={(e) => setRange(e.target.value)}
                 fullWidth
diff --git a/webapp/src/routes/CPUBenchmark/index.js b/webapp/src/routes/CPUBenchmark/index.js
index 19f37b63..82a56c88 100644
--- a/webapp/src/routes/CPUBenchmark/index.js
+++ b/webapp/src/routes/CPUBenchmark/index.js
@@ -187,11 +187,11 @@ const CPUBenchmark = () => {
             {t('title')}
           </Typography>
           <FormControl variant="standard">
-            <InputLabel id="demo-simple-select-label">
+            <InputLabel id="select-range-label">
               {t('timeFrame')}
             </InputLabel>
             <Select
-              labelId="demo-simple-select-label"
+              labelid="select-range-label"
               value={range}
               onChange={event => setRange(event.target.value)}
               fullWidth
diff --git a/webapp/src/routes/MissedBlocks/index.js b/webapp/src/routes/MissedBlocks/index.js
index caa3cc69..9c86cbd6 100644
--- a/webapp/src/routes/MissedBlocks/index.js
+++ b/webapp/src/routes/MissedBlocks/index.js
@@ -119,11 +119,11 @@ const BlockDistribution = () => {
             {t('title')}
           </Typography>
           <FormControl variant="standard">
-            <InputLabel id="demo-simple-select-label">
+            <InputLabel id="select-range-label">
               {t('timeFrame')}
             </InputLabel>
             <Select
-              labelId="demo-simple-select-label"
+              labelid="select-range-label"
               value={range}
               onChange={(e) => setRange(e.target.value)}
               fullWidth

From f3a8195406ff23199ca3b4c799cff8a30d0e6960 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 12 Sep 2023 10:26:52 -0600
Subject: [PATCH 04/18] chore(webapp): add space between the text and the icon

---
 webapp/src/components/AccountInfo/styles.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/webapp/src/components/AccountInfo/styles.js b/webapp/src/components/AccountInfo/styles.js
index 941dae04..5513117c 100644
--- a/webapp/src/components/AccountInfo/styles.js
+++ b/webapp/src/components/AccountInfo/styles.js
@@ -30,7 +30,13 @@ export default (theme) => ({
     justifyContent: 'space-between',
     alignItems: 'center',
     minWidth: '100px',
-    paddingTop: theme.spacing(1),
+    paddingTop: theme.spacing(2),
+    '& p': {
+      marginRight: theme.spacing(2),
+    },
+    '& p:first-child': {
+      minWidth: '80px',
+    },
   },
   keyIcon: {
     marginRight: theme.spacing(1),

From a8140006c3b20678ca0f04f84a68e8caaca02234 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 12 Sep 2023 14:42:19 -0600
Subject: [PATCH 05/18] chore(webapp): add titles to sidebar links

---
 webapp/src/components/EndpointsTable/index.js  |  1 +
 .../src/components/Sidebar/SidebarCategory.js  | 18 ++++++++++++++++--
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/webapp/src/components/EndpointsTable/index.js b/webapp/src/components/EndpointsTable/index.js
index d3199139..b3144017 100644
--- a/webapp/src/components/EndpointsTable/index.js
+++ b/webapp/src/components/EndpointsTable/index.js
@@ -87,6 +87,7 @@ const EndpointsTable = ({ producers, textLists }) => {
                       <MUITooltip title={t('linkToStats')} arrow>
                         <Link
                           aria-label={`Link to endpoints stats of ${producer.name}`}
+                          title={`${producer.name} endpoints stats`}
                           component={RouterLink}
                           state={{ producerId: producer.id }}
                           to="/endpoints-stats"
diff --git a/webapp/src/components/Sidebar/SidebarCategory.js b/webapp/src/components/Sidebar/SidebarCategory.js
index 923c72b3..eae181eb 100644
--- a/webapp/src/components/Sidebar/SidebarCategory.js
+++ b/webapp/src/components/Sidebar/SidebarCategory.js
@@ -6,6 +6,7 @@ import ExpandMore from '@mui/icons-material/ExpandMore'
 import { Chip, ListItem as MuiListItem, ListItemText } from '@mui/material'
 import styled from 'styled-components'
 import { darken } from 'polished'
+import { eosConfig } from 'config'
 
 const Category = styled(MuiListItem)`
   font-weight: ${(props) => props.theme.typography.fontWeightRegular};
@@ -39,10 +40,23 @@ const SidebarCategory = ({
   showOnlyIcons,
   ...rest
 }) => {
-  if (showOnlyIcons) return <Category {...rest} aria-label={`Link to ${name}`}>{icon}</Category>
+  if (showOnlyIcons)
+    return (
+      <Category
+        {...rest}
+        aria-label={`Link to ${name}`}
+        title={`${eosConfig.networkLabel} ${name}`}
+      >
+        {icon}
+      </Category>
+    )
 
   return (
-    <Category {...rest}>
+    <Category
+      {...rest}
+      aria-label={`Link to ${name}`}
+      title={`${eosConfig.networkLabel} ${name}`}
+    >
       {icon}
       <ListItemText className={classes.categoryText}>{name}</ListItemText>
       {isCollapsable ? (

From 91cf0e97f8f278b1349b907ee789f37b85c81a6d Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 12 Sep 2023 15:01:44 -0600
Subject: [PATCH 06/18] fix(webapp): fix missing form label

---
 webapp/src/routes/BlockDistribution/index.js | 4 ++--
 webapp/src/routes/CPUBenchmark/index.js      | 4 ++--
 webapp/src/routes/MissedBlocks/index.js      | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/webapp/src/routes/BlockDistribution/index.js b/webapp/src/routes/BlockDistribution/index.js
index eb7068a8..0af5a059 100644
--- a/webapp/src/routes/BlockDistribution/index.js
+++ b/webapp/src/routes/BlockDistribution/index.js
@@ -103,11 +103,11 @@ const BlockDistribution = () => {
           </Typography>
           <div className={classes.formControl}>
             <FormControl variant="standard">
-              <InputLabel id="select-range-label">
+              <InputLabel htmlFor="select-range-label">
                 {t('timeFrame')}
               </InputLabel>
               <Select
-                labelid="select-range-label"
+                inputProps={{ id: 'select-range-label' }}
                 value={range}
                 onChange={(e) => setRange(e.target.value)}
                 fullWidth
diff --git a/webapp/src/routes/CPUBenchmark/index.js b/webapp/src/routes/CPUBenchmark/index.js
index 82a56c88..fdbac2dc 100644
--- a/webapp/src/routes/CPUBenchmark/index.js
+++ b/webapp/src/routes/CPUBenchmark/index.js
@@ -187,11 +187,11 @@ const CPUBenchmark = () => {
             {t('title')}
           </Typography>
           <FormControl variant="standard">
-            <InputLabel id="select-range-label">
+            <InputLabel htmlFor="select-range-label">
               {t('timeFrame')}
             </InputLabel>
             <Select
-              labelid="select-range-label"
+              inputProps={{ id: 'select-range-label' }}
               value={range}
               onChange={event => setRange(event.target.value)}
               fullWidth
diff --git a/webapp/src/routes/MissedBlocks/index.js b/webapp/src/routes/MissedBlocks/index.js
index 9c86cbd6..b4898feb 100644
--- a/webapp/src/routes/MissedBlocks/index.js
+++ b/webapp/src/routes/MissedBlocks/index.js
@@ -119,11 +119,11 @@ const BlockDistribution = () => {
             {t('title')}
           </Typography>
           <FormControl variant="standard">
-            <InputLabel id="select-range-label">
+            <InputLabel htmlFor="select-range-label">
               {t('timeFrame')}
             </InputLabel>
             <Select
-              labelid="select-range-label"
+              inputProps={{ id: 'select-range-label' }}
               value={range}
               onChange={(e) => setRange(e.target.value)}
               fullWidth

From a9483507339605171e8cf053d3a804826950dc0c Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Wed, 13 Sep 2023 10:48:58 -0600
Subject: [PATCH 07/18] feat(webapp): include network name via interpolation

---
 webapp/src/language/en.json               | 40 +++++++++++------------
 webapp/src/language/en.telos-testnet.json |  1 -
 webapp/src/language/en.telos.json         |  1 -
 webapp/src/language/es.json               | 35 ++++++++++----------
 webapp/src/layouts/Dashboard.js           | 29 ++++++++--------
 webapp/src/routes/EVMDashboard/index.js   | 12 ++++---
 6 files changed, 61 insertions(+), 57 deletions(-)

diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index 064a731b..fd191727 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -53,58 +53,58 @@
   "routes": {
     "/>sidebar": "Dashboard",
     "/>title": "Antelope Tools",
-    "/>heading": "Welcome to",
+    "/>heading": "Welcome to {{networkName}}",
     "/cpu-benchmark>sidebar": "CPU Benchmarks",
     "/cpu-benchmark>title": "CPU Benchmarks - EOSIO + Antelope Network Dashboard",
-    "/cpu-benchmark>heading": "Block Producer Nodes CPU Benchmarks",
+    "/cpu-benchmark>heading": "Block Producer Nodes CPU Benchmarks in {{networkName}}",
     "/block-producers>sidebar": "Block Producers",
     "/block-producers>title": "Block Producers - EOSIO + Antelope Network Dashboard",
-    "/block-producers>heading": "Block Producers",
+    "/block-producers>heading": "Block Producers in {{networkName}}",
     "/undiscoverable-bps>sidebar": "Undiscoverable BPs",
     "/undiscoverable-bps>title": "Undiscoverable Block Producers or Sock Puppet BPs - EOSIO + Antelope Network Dashboard",
-    "/undiscoverable-bps>heading": "Undiscoverable Paid Block Producers",
+    "/undiscoverable-bps>heading": "Undiscoverable Paid Block Producers in {{networkName}}",
     "/rewards-distribution>sidebar": "Rewards Distribution",
     "/rewards-distribution>title": "Rewards Distribution - EOSIO + Antelope Network Dashboard",
-    "/rewards-distribution>heading": "Rewards Distribution",
+    "/rewards-distribution>heading": "Rewards Distribution of {{networkName}}",
     "/nodes>sidebar": "Nodes",
     "/nodes>title": "Nodes - EOSIO + Antelope Network Dashboard",
-    "/nodes>heading": "Nodes",
+    "/nodes>heading": "Nodes in {{networkName}}",
     "/nodes-distribution>sidebar": "Geo Distribution",
     "/nodes-distribution>title": "Geographic Distribution of Nodes - EOSIO + Antelope Network Dashboard",
-    "/nodes-distribution>heading": "Geographic Distribution of Nodes",
+    "/nodes-distribution>heading": "Geographic Distribution of {{networkName}} Nodes",
     "/accounts>sidebar": "Accounts & Contracts",
     "/accounts>title": "Accounts and Contracts - EOSIO + Antelope Network Dashboard",
-    "/accounts>heading": "Accounts and Contracts",
+    "/accounts>heading": "Accounts and Contracts of {{networkName}}",
     "/bpjson>sidebar": "BP.json Generator",
     "/bpjson>title": "BP JSON Generator - EOSIO + Antelope Network Dashboard",
     "/bpjson>heading": "BP.json Generator",
     "/faucet>sidebar": "Create Account & Faucet",
     "/faucet>title": "Faucet and Account Creator - EOSIO + Antelope Network Dashboard",
-    "/faucet>heading": "Account Creator and Token Faucet",
+    "/faucet>heading": "{{networkName}} Account Creator and Token Faucet",
     "/ricardian-contract>sidebar": "BP Agreement",
     "/ricardian-contract>title": "BP Agreement - EOSIO + Antelope Network Dashboard",
     "/ricardian-contract>heading": "",
     "/block-distribution>sidebar": "Block Distribution",
     "/block-distribution>title": "Block Production Distribution - EOSIO + Antelope Network Dashboard",
-    "/block-distribution>heading": "Block Production Distribution",
+    "/block-distribution>heading": "Block Production Distribution in {{networkName}}",
     "/missed-blocks>sidebar": "Missed Blocks",
     "/missed-blocks>title": "Missed Blocks - EOSIO + Antelope Network Dashboard",
-    "/missed-blocks>heading": "Missed Blocks",
+    "/missed-blocks>heading": "Missed Blocks in {{networkName}}",
     "/stress-test>title": "Stress Test Dashboard - EOSIO + Antelope Network Dashboard",
     "/stress-test>sidebar": "Stress Test",
-    "/stress-test>heading": "Stress Test",
+    "/stress-test>heading": "{{networkName}} Stress Test",
     "/evm>title": "EVM Dashboard - EOSIO + Antelope Network Dashboard",
     "/evm>sidebar": "EVM Dashboard",
-    "/evm>heading": "EVM Dashboard",
+    "/evm>heading": "{{networkName}} EVM Dashboard",
     "/evm-rpc-endpoints>title": "EVM RPC Endpoints - EOSIO + Antelope Network Dashboard",
     "/evm-rpc-endpoints>sidebar": "EVM RPC Endpoints",
-    "/evm-rpc-endpoints>heading": "EVM RPC Endpoints",
+    "/evm-rpc-endpoints>heading": "{{networkName}} EVM RPC Endpoints",
     "/endpoints>sidebar": "API Endpoints",
     "/endpoints>title": "API Endpoints - EOSIO + Antelope Network Dashboard",
-    "/endpoints>heading": "API Endpoints",
+    "/endpoints>heading": "{{networkName}} API Endpoints",
     "/endpoints-stats>sidebar": "API Endpoints Stats",
     "/endpoints-stats>title": "API Endpoints Stats- EOSIO + Antelope Network Dashboard",
-    "/endpoints-stats>heading": "API Endpoints Stats",
+    "/endpoints-stats>heading": "{{networkName}} API Endpoints Stats",
     "/about>sidebar": "About",
     "/about>title": "About - EOSIO + Antelope Network Dashboard",
     "/about>heading": "About",
@@ -456,8 +456,8 @@
     "avgBlockTime": "Average block time",
     "gasPrice": "Gas price",
     "avgGasUsage": "Average gas usage",
-    "totalIncoming": "Total (TOKEN) incoming",
-    "totalOutgoing": "Total (TOKEN) outgoing",
+    "totalIncoming": "Total {{token}} incoming",
+    "totalOutgoing": "Total {{token}} outgoing",
     "incoming": "Incoming",
     "outgoing": "Outgoing",
     "ATH": "TPS All Time High",
@@ -468,8 +468,8 @@
     "tooltip": {
       "gasPrice": "Fixed virtual fuel used to execute smart contracts in EVM",
       "avgGasUsage": "Average gas used in the last 100 blocks",
-      "totalIncoming": "Amount of transfer transactions to (ACCOUNT)",
-      "totalOutgoing": "Amount of transfer transactions from (ACCOUNT)",
+      "totalIncoming": "Amount of transfer transactions to {{accountName}}",
+      "totalOutgoing": "Amount of transfer transactions from {{accountName}}",
       "ATH": "Maximum number of transactions per second (TPS)",
       "lastBlock": "Ethereum block height, the number of confirmed blocks",
       "totalTxs": "Amount of transactions since the first block"
diff --git a/webapp/src/language/en.telos-testnet.json b/webapp/src/language/en.telos-testnet.json
index 881f04e5..7a03322d 100644
--- a/webapp/src/language/en.telos-testnet.json
+++ b/webapp/src/language/en.telos-testnet.json
@@ -31,7 +31,6 @@
     "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
     "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
     "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
-    "/evm>heading": "Telos EVM Dashboard",
     "/evm>moreDescription": "Monitor Telos EVM statistics (tEVM), such as transaction amount history, gas price and total wallets created.",
     "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM endpoints, with their health status and latency in milliseconds."
   }
diff --git a/webapp/src/language/en.telos.json b/webapp/src/language/en.telos.json
index 58648221..10a4a79b 100644
--- a/webapp/src/language/en.telos.json
+++ b/webapp/src/language/en.telos.json
@@ -31,7 +31,6 @@
     "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
     "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
     "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
-    "/evm>heading": "Telos EVM Dashboard",
     "/evm>moreDescription": "Monitor Telos EVM statistics (tEVM), such as transaction amount history, gas price and total wallets created.",
     "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM endpoints, with their health status and latency in milliseconds."
   }
diff --git a/webapp/src/language/es.json b/webapp/src/language/es.json
index b145780e..15a5d1d3 100644
--- a/webapp/src/language/es.json
+++ b/webapp/src/language/es.json
@@ -64,49 +64,50 @@
   "routes": {
     "/>sidebar": "Panel",
     "/>title": "EOSIO Panel",
-    "/>heading": "Bienvenido",
+    "/>heading": "Bienvenido a {{networkName}}",
     "/cpu-benchmark>sidebar": "Benchmark de CPU",
     "/cpu-benchmark>title": "Benchmark de CPU - Panel",
-    "/cpu-benchmark>heading": "Benchmark de CPU",
+    "/cpu-benchmark>heading": "Benchmark de CPU en {{networkName}}",
     "/block-producers>sidebar": "Productores de Bloques",
     "/block-producers>title": "Productores de Bloques - Panel",
-    "/block-producers>heading": "Productores de Bloques",
+    "/block-producers>heading": "Productores de Bloques en {{networkName}}",
     "/undiscoverable-bps>sidebar": "Productores Indetectables",
     "/undiscoverable-bps>title": "Productores de Bloques Indetectables - Panel",
-    "/undiscoverable-bps>heading": "Productores de Bloques Pagados e Indetectables",
+    "/undiscoverable-bps>heading": "Productores de Bloques Pagados e Indetectables en {{networkName}}",
     "/rewards-distribution>sidebar": "Distribución de recompensas",
     "/rewards-distribution>title": "Distribución de recompensas - Panel",
-    "/rewards-distribution>heading": "Distribución de recompensas",
+    "/rewards-distribution>heading": "Distribución de recompensas de {{networkName}}",
     "/nodes>sidebar": "Nodos",
     "/nodes>title": "Nodos - Panel",
-    "/nodes>heading": "Nodos",
+    "/nodes>heading": "Nodos en {{networkName}}",
     "/nodes-distribution>sidebar": "Geo Distribución",
     "/nodes-distribution>title": "Distribución Geográfica de Nodos",
-    "/nodes-distribution>heading": "Distribución Geográfica",
+    "/nodes-distribution>heading": "Distribución Geográfica de los nodos de {{networkName}}",
     "/stress-test>title": "Panel de Prueba de Estrés",
     "/stress-test>sidebar": "Prueba de Estrés",
-    "/stress-test>heading": "Prueba de Estrés",
+    "/stress-test>heading": "Prueba de Estrés en {{networkName}}",
     "/accounts>sidebar": "Cuentas y Contratos",
     "/accounts>title": "Cuentas y Contratos - Panel",
-    "/accounts>heading": "Cuentas y Contratos",
+    "/accounts>heading": "Cuentas y Contratos de {{networkName}}",
     "/bpjson>sidebar": "BP JSON",
     "/bpjson>title": "BP JSON - Panel",
     "/bpjson>heading": "BP JSON",
     "/faucet>sidebar": "Crear Cuenta y Faucet",
     "/faucet>title": "Crear una Cuenta y Grifo de Tokens - EOSIO + Antelope Network Dashboard",
-    "/faucet>heading": "Crear una Cuenta y Obtener Tokens",
+    "/faucet>heading": "Crear una Cuenta de {{networkName}} y Obtenga Tokens",
     "/ricardian-contract>sidebar": "Acuerdo de Productor de Bloques",
     "/ricardian-contract>title": "Acuerdo de Productor de Bloques - Antelope Tools",
     "/ricardian-contract>heading": "",
     "/block-distribution>sidebar": "Distribución de bloques",
     "/block-distribution>title": "Distribución de bloques - Antelope Tools",
-    "/block-distribution>heading": "Distribución de bloques",
+    "/block-distribution>heading": "Distribución de bloques en {{networkName}}",
+    "/missed-blocks>heading": "$t(missedBlocks) en {{networkName}}",
     "/endpoints>sidebar": "URL's",
     "/endpoints>title": "URL's - Antelope Tools",
-    "/endpoints>heading": "URL's",
+    "/endpoints>heading": "URL's de {{networkName}}",
     "/endpoints-stats>sidebar": "Estadísticas de URL's",
     "/endpoints-stats>title": "Estadísticas de URL's - Antelope Tools",
-    "/endpoints-stats>heading": "Estadísticas de puntos finales",
+    "/endpoints-stats>heading": "Estadísticas de puntos finales de {{networkName}}",
     "/about>sidebar": "Acerca de",
     "/about>title": "Acerca de - Panel",
     "/about>heading": "Acerca de",
@@ -475,8 +476,8 @@
     "avgBlockTime": "Tiempo promedio de bloque",
     "gasPrice": "Precio de gas",
     "avgGasUsage": "Uso promedio de gas",
-    "totalIncoming": "Total (TOKEN) entrantes",
-    "totalOutgoing": "Total (TOKEN) salientes",
+    "totalIncoming": "Total {{token}} entrantes",
+    "totalOutgoing": "Total {{token}} salientes",
     "incoming": "Entrantes",
     "outgoing": "Salientes",
     "ATH": "TPS Máximo histórico",
@@ -487,8 +488,8 @@
     "tooltip": {
       "gasPrice": "Combustible virtual usado para ejecutar contratos inteligentes en EVM",
       "avgGasUsage": "Gas promedio utilizado en los últimos 100 bloques",
-      "totalIncoming": "Cantidad de transacciones transfer hacia (ACCOUNT)",
-      "totalOutgoing": "Cantidad de transacciones transfer desde (ACCOUNT)",
+      "totalIncoming": "Cantidad de transacciones transfer hacia {{accountName}}",
+      "totalOutgoing": "Cantidad de transacciones transfer desde {{accountName}}",
       "ATH": "Cantidad máxima registrada de transacciones por segundo (TPS)",
       "lastBlock": "Ethereum block height, el número de bloques confirmados",
       "totalTxs": "Cantidad de transacciones desde el primer bloque"
diff --git a/webapp/src/layouts/Dashboard.js b/webapp/src/layouts/Dashboard.js
index a7951426..d5a7b5eb 100644
--- a/webapp/src/layouts/Dashboard.js
+++ b/webapp/src/layouts/Dashboard.js
@@ -25,7 +25,6 @@ const drawerWidth = 70
 const openDrawerWidth = drawerWidth * (24 / 7)
 const INIT_VALUES = {
   dynamicTitle: '',
-  networkTitle: '',
   pathname: null,
 }
 const useStyles = makeStyles((theme) => styles(theme))
@@ -66,8 +65,9 @@ const Dashboard = ({ children }) => {
         dynamicTitle:
           location.pathname === '/management'
             ? managementCardTitle
-            : t(`${location.pathname}>heading`),
-        networkTitle: location.pathname === '/' ? eosConfig.networkLabel : '',
+            : t(`${location.pathname}>heading`, {
+                networkName: eosConfig.networkLabel,
+              }),
         pathname: location.pathname,
         pageTitle: `${location.pathname}>title`,
       })
@@ -105,17 +105,18 @@ const Dashboard = ({ children }) => {
         <div className={classes.mainContent}>
           <div className={classes.subHeader}>
             <div className={classes.boxHeader}>
-              <Typography
-                variant="h3"
-                className={clsx(
-                  classes.textAlignReadMore,
-                  classes.marginBottom,
-                )}
-              >
-                {routeName.pathname
-                  ? `${routeName.dynamicTitle} ${routeName.networkTitle}`
-                  : ''}
-              </Typography>
+              {routeName.pathname && (
+                <Typography
+                  variant="h3"
+                  component="h1"
+                  className={clsx(
+                    classes.textAlignReadMore,
+                    classes.marginBottom,
+                  )}
+                >
+                  {routeName.dynamicTitle}
+                </Typography>
+              )}
               <Typography className={classes.textAlignReadMore}>
                 {i18n.exists(`routes:${location.pathname}>moreDescription`)
                   ? t(`${location.pathname}>moreDescription`)
diff --git a/webapp/src/routes/EVMDashboard/index.js b/webapp/src/routes/EVMDashboard/index.js
index 38411cb3..6e089ec4 100644
--- a/webapp/src/routes/EVMDashboard/index.js
+++ b/webapp/src/routes/EVMDashboard/index.js
@@ -158,16 +158,20 @@ const EVMDashboard = () => {
           loading={loading}
         />
         <SimpleDataCard
-          title={t('totalIncoming').replace('(TOKEN)', eosConfig.tokenSymbol)}
-          helperText={t('tooltip.totalIncoming').replace('(ACCOUNT)', evmConfig.account)}
+          title={t('totalIncoming', { token: eosConfig.tokenSymbol })}
+          helperText={t('tooltip.totalIncoming', {
+            accountName: evmConfig.account,
+          })}
           value={
             formatWithThousandSeparator(EVMStats?.total_incoming_token) || 0
           }
           loading={loading}
         />
         <SimpleDataCard
-          title={t('totalOutgoing').replace('(TOKEN)', eosConfig.tokenSymbol)}
-          helperText={t('tooltip.totalOutgoing').replace('(ACCOUNT)', evmConfig.account)}
+          title={t('totalOutgoing', { token: eosConfig.tokenSymbol })}
+          helperText={t('tooltip.totalOutgoing', {
+            accountName: evmConfig.account,
+          })}
           value={
             formatWithThousandSeparator(EVMStats?.total_outgoing_token) || 0
           }

From 01886da25a85ce64ba6197cad7aa8cf8b9a7456b Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Wed, 13 Sep 2023 12:01:02 -0600
Subject: [PATCH 08/18] fix(webapp): fix skipped heading level

---
 webapp/src/components/AccountInfo/index.js                 | 7 ++++---
 webapp/src/layouts/Dashboard.js                            | 2 +-
 webapp/src/routes/About/index.js                           | 6 +++---
 webapp/src/routes/BlockDistribution/index.js               | 2 +-
 webapp/src/routes/CPUBenchmark/index.js                    | 2 +-
 webapp/src/routes/EVMEndpointsList/index.js                | 2 +-
 webapp/src/routes/EndpointsStats/EndpointStatsTable.js     | 2 +-
 webapp/src/routes/EndpointsStats/index.js                  | 2 +-
 webapp/src/routes/Faucet/index.js                          | 4 ++--
 webapp/src/routes/Help/index.js                            | 2 +-
 webapp/src/routes/Home/BlockProducerInfo.js                | 2 +-
 webapp/src/routes/MissedBlocks/index.js                    | 2 +-
 .../routes/RewardsDistribution/RewardsDistributionStats.js | 6 +++---
 webapp/src/routes/RewardsDistribution/styles.js            | 4 ++--
 14 files changed, 23 insertions(+), 22 deletions(-)

diff --git a/webapp/src/components/AccountInfo/index.js b/webapp/src/components/AccountInfo/index.js
index dc483b48..6824f780 100644
--- a/webapp/src/components/AccountInfo/index.js
+++ b/webapp/src/components/AccountInfo/index.js
@@ -32,7 +32,7 @@ const AccordionWrapper = ({ children, title, ...props }) => {
           root: classes.accordionSummary,
         }}
       >
-        <Typography variant="h6" color="primary">
+        <Typography component="h4" variant="h6" color="primary">
           {title}
         </Typography>
       </AccordionSummary>
@@ -126,6 +126,7 @@ const AccountInfo = ({
                 />
               </div>
               <Typography
+                component="h2"
                 variant="h4"
                 color="primary"
                 className={classes.accountName}
@@ -134,7 +135,7 @@ const AccountInfo = ({
               </Typography>
             </div>
             <div className={classes.border}>
-              <Typography variant="h6" color="primary" className="columTitle">
+              <Typography component="h3" variant="h6" color="primary" className="columTitle">
                 {t('resources')}
               </Typography>
               <div className="resourceUsage">
@@ -156,7 +157,7 @@ const AccountInfo = ({
               </div>
             </div>
             <div className={classes.border}>
-              <Typography variant="h6" color="primary" className="columTitle">
+              <Typography component="h3" variant="h6" color="primary" className="columTitle">
                 {t('keys')}
               </Typography>
               <div className="keys">
diff --git a/webapp/src/layouts/Dashboard.js b/webapp/src/layouts/Dashboard.js
index d5a7b5eb..efd2353f 100644
--- a/webapp/src/layouts/Dashboard.js
+++ b/webapp/src/layouts/Dashboard.js
@@ -105,7 +105,7 @@ const Dashboard = ({ children }) => {
         <div className={classes.mainContent}>
           <div className={classes.subHeader}>
             <div className={classes.boxHeader}>
-              {routeName.pathname && (
+              {routeName.pathname && routeName.dynamicTitle && (
                 <Typography
                   variant="h3"
                   component="h1"
diff --git a/webapp/src/routes/About/index.js b/webapp/src/routes/About/index.js
index 342c0f3a..ca9a069c 100644
--- a/webapp/src/routes/About/index.js
+++ b/webapp/src/routes/About/index.js
@@ -28,15 +28,15 @@ const About = () => {
             <Typography variant="body2" paragraph>
               {t('body.paragraph1')}
             </Typography>
-            <Typography variant="h4">{t('subtitle1')}</Typography>
+            <Typography component="h2" variant="h4">{t('subtitle1')}</Typography>
             <Typography variant="body2" paragraph>
               {t('body1.paragraph1')}
             </Typography>
-            <Typography variant="h4">{t('subtitle2')}</Typography>
+            <Typography component="h2" variant="h4">{t('subtitle2')}</Typography>
             <Typography variant="body2" paragraph>
               {t('body2.paragraph1')}
             </Typography>
-            <Typography variant="h4">{t('subtitle3')}</Typography>
+            <Typography component="h2" variant="h4" id='where-does-the-data-come-from'>{t('subtitle3')}</Typography>
             {eosConfig.networkName !== 'lacchain' ? (
               <>
                 <Typography variant="body2" paragraph>
diff --git a/webapp/src/routes/BlockDistribution/index.js b/webapp/src/routes/BlockDistribution/index.js
index 0af5a059..0ac9e7b3 100644
--- a/webapp/src/routes/BlockDistribution/index.js
+++ b/webapp/src/routes/BlockDistribution/index.js
@@ -98,7 +98,7 @@ const BlockDistribution = () => {
     <Card className={classes.cardShadow}>
       <CardContent>
         <div className={classes.textDiv}>
-          <Typography component="p" variant="h6">
+          <Typography component="h2" variant="h6">
             {t('title')}
           </Typography>
           <div className={classes.formControl}>
diff --git a/webapp/src/routes/CPUBenchmark/index.js b/webapp/src/routes/CPUBenchmark/index.js
index fdbac2dc..872322a1 100644
--- a/webapp/src/routes/CPUBenchmark/index.js
+++ b/webapp/src/routes/CPUBenchmark/index.js
@@ -183,7 +183,7 @@ const CPUBenchmark = () => {
     <Card className={classes.cardShadow}>
       <CardContent>
         <div className={classes.textDiv}>
-          <Typography component="p" variant="h6">
+          <Typography component="h2" variant="h6">
             {t('title')}
           </Typography>
           <FormControl variant="standard">
diff --git a/webapp/src/routes/EVMEndpointsList/index.js b/webapp/src/routes/EVMEndpointsList/index.js
index 6f03ba26..35de3ab0 100644
--- a/webapp/src/routes/EVMEndpointsList/index.js
+++ b/webapp/src/routes/EVMEndpointsList/index.js
@@ -36,7 +36,7 @@ const EVMEndpointsList = () => {
     <Card className={classes.cardShadow}>
       <CardContent>
         <div className={classes.titleContainer}>
-          <Typography component="p" variant="h6">
+          <Typography component="h2" variant="h6">
             {t('title')}
           </Typography>
           <HealthInfoModal />
diff --git a/webapp/src/routes/EndpointsStats/EndpointStatsTable.js b/webapp/src/routes/EndpointsStats/EndpointStatsTable.js
index 7a662bbc..8017fc1c 100644
--- a/webapp/src/routes/EndpointsStats/EndpointStatsTable.js
+++ b/webapp/src/routes/EndpointsStats/EndpointStatsTable.js
@@ -18,7 +18,7 @@ const EndpointsTable = ({ endpoints, title }) => {
 
   return (
     <>
-      <Typography component="p" variant="h6">
+      <Typography component="h2" variant="h6">
         {title}
       </Typography>
       <TableContainer>
diff --git a/webapp/src/routes/EndpointsStats/index.js b/webapp/src/routes/EndpointsStats/index.js
index d5410c00..91002872 100644
--- a/webapp/src/routes/EndpointsStats/index.js
+++ b/webapp/src/routes/EndpointsStats/index.js
@@ -72,7 +72,7 @@ const EndpointsStats = () => {
       </Card>
       <Card className={`${classes.cardByProducer} ${classes.cardShadow}`}>
         <CardContent>
-          <Typography component="p" variant="h6">
+          <Typography component="h2" variant="h6">
             {t('byProducer')}
           </Typography>
           {producersNames?.length && (
diff --git a/webapp/src/routes/Faucet/index.js b/webapp/src/routes/Faucet/index.js
index dd7172eb..f3edc6f2 100644
--- a/webapp/src/routes/Faucet/index.js
+++ b/webapp/src/routes/Faucet/index.js
@@ -170,7 +170,7 @@ const Faucet = () => {
       <div className={classes.card}>
         <Card>
           <CardContent>
-            <Typography variant="h5">{t('createAccount')}</Typography>
+            <Typography component="h2" variant="h5">{t('createAccount')}</Typography>
             <div className={classes.formControl}>
               <div>
                 <TextField
@@ -232,7 +232,7 @@ const Faucet = () => {
       <div className={classes.card}>
         <Card>
           <CardContent>
-            <Typography variant="h5">{`${t('issueTokens')} (500 ${eosConfig.tokenSymbol})`}</Typography>
+            <Typography component="h2" variant="h5">{`${t('issueTokens')} (500 ${eosConfig.tokenSymbol})`}</Typography>
             <div className={classes.formControl}>
               <div>
                 <TextField
diff --git a/webapp/src/routes/Help/index.js b/webapp/src/routes/Help/index.js
index 16d57634..e9031178 100644
--- a/webapp/src/routes/Help/index.js
+++ b/webapp/src/routes/Help/index.js
@@ -20,7 +20,7 @@ const Help = () => {
   return (
     <Card className={classes.cardShadow}>
       <CardContent>
-        <Typography variant="h4" className={classes.title}>
+        <Typography component="h2" variant="h4" className={classes.title}>
           {t('title')}
         </Typography>
         <Typography variant="body2" align="justify" paragraph>
diff --git a/webapp/src/routes/Home/BlockProducerInfo.js b/webapp/src/routes/Home/BlockProducerInfo.js
index 9f947d26..85b17ec9 100644
--- a/webapp/src/routes/Home/BlockProducerInfo.js
+++ b/webapp/src/routes/Home/BlockProducerInfo.js
@@ -114,7 +114,7 @@ const BlockProducerInfo = ({ t, classes }) => {
           <Card className={classes.cardShadow}>
             <CardContent>
               <CardTooltip helperText={t('tooltip.bpSchedule')}>   
-                <Typography component="p" variant="h6">
+                <Typography component="h2" variant="h6">
                   {t('bpSchedule')}
                 </Typography>
               </CardTooltip> 
diff --git a/webapp/src/routes/MissedBlocks/index.js b/webapp/src/routes/MissedBlocks/index.js
index b4898feb..15d0068c 100644
--- a/webapp/src/routes/MissedBlocks/index.js
+++ b/webapp/src/routes/MissedBlocks/index.js
@@ -115,7 +115,7 @@ const BlockDistribution = () => {
     <Card className={classes.cardShadow}>
       <CardContent>
         <div className={classes.textDiv}>
-          <Typography component="p" variant="h6">
+          <Typography component="h2" variant="h6">
             {t('title')}
           </Typography>
           <FormControl variant="standard">
diff --git a/webapp/src/routes/RewardsDistribution/RewardsDistributionStats.js b/webapp/src/routes/RewardsDistribution/RewardsDistributionStats.js
index 698c740a..fb8d601d 100644
--- a/webapp/src/routes/RewardsDistribution/RewardsDistributionStats.js
+++ b/webapp/src/routes/RewardsDistribution/RewardsDistributionStats.js
@@ -32,7 +32,7 @@ const RewardsDistributionStats = ({ summary, setting, handlePopoverOpen }) => {
       <div className={classes.cardHeader}>
         <Card className={`${classes.cardContent} ${classes.cardShadow}`}>
           <CardContent className={`${classes.cards} ${classes.totalDailyCard}`}>
-            <Typography component="h4">{t('dailyRewards')}</Typography>
+            <Typography component="h2">{t('dailyRewards')}</Typography>
             <div className={classes.verticallyCenter}>
               <Typography variant="h6" component="p">
                 {!summary?.dailyRewards > 0 && (
@@ -67,7 +67,7 @@ const RewardsDistributionStats = ({ summary, setting, handlePopoverOpen }) => {
       <div className={classes.cardHeader}>
         <Card className={`${classes.cardContent} ${classes.cardShadow}`}>
           <CardContent className={classes.cards}>
-            <Typography component="h4">
+            <Typography component="h2">
               {t('topCountryDailyRewards')}
             </Typography>
             <Typography variant="h6" component="p">
@@ -109,7 +109,7 @@ const RewardsDistributionStats = ({ summary, setting, handlePopoverOpen }) => {
         <Card className={`${classes.cardContent} ${classes.cardShadow}`}>
           <CardContent className={classes.cards}>
             <div className={classes.notLocated}>
-              <Typography component="h4">{t('paidProducers')}</Typography>
+              <Typography component="h2">{t('paidProducers')}</Typography>
               {!!summary?.producersWithoutProperBpJson.quantity && (
                 <Button
                   className={classes.nonCompliantButton}
diff --git a/webapp/src/routes/RewardsDistribution/styles.js b/webapp/src/routes/RewardsDistribution/styles.js
index 34032faa..dd593b7c 100644
--- a/webapp/src/routes/RewardsDistribution/styles.js
+++ b/webapp/src/routes/RewardsDistribution/styles.js
@@ -103,7 +103,7 @@ export default (theme, lowestRewardsColor, highestRewardsColor) => ({
     display: 'flex',
     flexDirection: 'column',
     justifyContent: 'space-between',
-    '& h4': {
+    '& h2': {
       fontWeight: 'bold'
     },
   },
@@ -153,7 +153,7 @@ export default (theme, lowestRewardsColor, highestRewardsColor) => ({
     display: 'flex',
     flexWrap: 'wrap',
     justifyContent: 'space-between',
-    '& h4': {
+    '& h2': {
       width: 'calc(100% - 125px)',
       paddingBottom: theme.spacing(2),
     },

From d02bc8831bbdffb1933f19d6883b9ba8b1f1d003 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Wed, 13 Sep 2023 13:35:37 -0600
Subject: [PATCH 09/18] chore(webapp): add tEVM to texts

---
 webapp/src/language/en.json               | 2 +-
 webapp/src/language/en.telos-testnet.json | 2 +-
 webapp/src/language/en.telos.json         | 2 +-
 webapp/src/language/es.json               | 2 +-
 webapp/src/language/es.telos-testnet.json | 2 +-
 webapp/src/language/es.telos.json         | 2 +-
 6 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index fd191727..423accb4 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -476,7 +476,7 @@
     }
   },
   "evmEndpointsRoute": {
-    "title": "EVM RPC endpoints list",
+    "title": "EVM endpoints list",
     "rpcEndpoint": "RPC Endpoint",
     "latency": "Latency",
     "lastBlock": "Last block",
diff --git a/webapp/src/language/en.telos-testnet.json b/webapp/src/language/en.telos-testnet.json
index 7a03322d..715a8dce 100644
--- a/webapp/src/language/en.telos-testnet.json
+++ b/webapp/src/language/en.telos-testnet.json
@@ -32,6 +32,6 @@
     "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
     "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
     "/evm>moreDescription": "Monitor Telos EVM statistics (tEVM), such as transaction amount history, gas price and total wallets created.",
-    "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM endpoints, with their health status and latency in milliseconds."
+    "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM (tEVM) endpoints, with their health status and latency in milliseconds."
   }
 }
diff --git a/webapp/src/language/en.telos.json b/webapp/src/language/en.telos.json
index 10a4a79b..1f8f33a8 100644
--- a/webapp/src/language/en.telos.json
+++ b/webapp/src/language/en.telos.json
@@ -32,6 +32,6 @@
     "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
     "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
     "/evm>moreDescription": "Monitor Telos EVM statistics (tEVM), such as transaction amount history, gas price and total wallets created.",
-    "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM endpoints, with their health status and latency in milliseconds."
+    "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM (tEVM) endpoints, with their health status and latency in milliseconds."
   }
 }
diff --git a/webapp/src/language/es.json b/webapp/src/language/es.json
index 15a5d1d3..4736b0a3 100644
--- a/webapp/src/language/es.json
+++ b/webapp/src/language/es.json
@@ -496,7 +496,7 @@
     }
   },
   "evmEndpointsRoute": {
-    "title": "Lista de puntos finales RPC de EVM",
+    "title": "Lista de puntos finales de EVM",
     "rpcEndpoint": "Punto final RPC",
     "latency": "Latencia",
     "lastBlock": "Último bloque",
diff --git a/webapp/src/language/es.telos-testnet.json b/webapp/src/language/es.telos-testnet.json
index 4ce6a4b4..95829b9e 100644
--- a/webapp/src/language/es.telos-testnet.json
+++ b/webapp/src/language/es.telos-testnet.json
@@ -30,6 +30,6 @@
     "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
     "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red.",
     "/evm>moreDescription": "Supervise las estadísticas del Telos EVM (tEVM), como el histórico de la cantidad de transacciones, el precio del gas y las wallets creadas totales.",
-    "/evm-rpc-endpoints>moreDescription": "Una lista de puntos finales de Telos EVM, con sus estado de salud y latencia en milisegundos."
+    "/evm-rpc-endpoints>moreDescription": "Una lista de puntos finales de Telos EVM (tEVM), con sus estado de salud y latencia en milisegundos."
   }
 }
diff --git a/webapp/src/language/es.telos.json b/webapp/src/language/es.telos.json
index 085c6ee1..72554fc0 100644
--- a/webapp/src/language/es.telos.json
+++ b/webapp/src/language/es.telos.json
@@ -30,6 +30,6 @@
     "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
     "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red.",
     "/evm>moreDescription": "Supervise las estadísticas del Telos EVM (tEVM), como el histórico de la cantidad de transacciones, el precio del gas y las wallets creadas totales.",
-    "/evm-rpc-endpoints>moreDescription": "Una lista de puntos finales de Telos EVM, con sus estado de salud y latencia en milisegundos."
+    "/evm-rpc-endpoints>moreDescription": "Una lista de puntos finales de Telos EVM (tEVM), con sus estado de salud y latencia en milisegundos."
   }
 }

From 0e231c392f5dd9d5b75aa9db5c16cf44f3ec931a Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Wed, 13 Sep 2023 14:41:02 -0600
Subject: [PATCH 10/18] chore(webapp): add network name in about page

---
 .../src/components/RicardianContract/index.js |  5 +++-
 .../components/RicardianContract/styles.js    |  3 ---
 webapp/src/language/en.json                   | 16 ++++++-------
 webapp/src/language/es.json                   |  4 ++--
 webapp/src/routes/About/index.js              | 24 +++++++++++++++----
 5 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/webapp/src/components/RicardianContract/index.js b/webapp/src/components/RicardianContract/index.js
index 960a2bef..e830f160 100644
--- a/webapp/src/components/RicardianContract/index.js
+++ b/webapp/src/components/RicardianContract/index.js
@@ -30,7 +30,10 @@ const RicardianContract = ({ abi, hash }) => {
         <div key={`ricardian-item-${name}-${version}`}>
           <div className={classes.boxTitle}>
             <img
-              alt="icon"
+              width={25}
+              height={25}
+              alt=""
+              loading="lazy"
               src={_icon || defaultIcon}
               onError={useDefaultLogo}
             />
diff --git a/webapp/src/components/RicardianContract/styles.js b/webapp/src/components/RicardianContract/styles.js
index 129152f3..8f282516 100644
--- a/webapp/src/components/RicardianContract/styles.js
+++ b/webapp/src/components/RicardianContract/styles.js
@@ -14,9 +14,6 @@ export default (theme) => ({
     alignItems: 'center',
     marginTop: theme.spacing(6),
     marginBottom: theme.spacing(1),
-    '& img': {
-      width: 25,
-    },
   },
   boxText: {
     display: 'flex',
diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index 423accb4..415d420d 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -56,19 +56,19 @@
     "/>heading": "Welcome to {{networkName}}",
     "/cpu-benchmark>sidebar": "CPU Benchmarks",
     "/cpu-benchmark>title": "CPU Benchmarks - EOSIO + Antelope Network Dashboard",
-    "/cpu-benchmark>heading": "Block Producer Nodes CPU Benchmarks in {{networkName}}",
+    "/cpu-benchmark>heading": "Block Producer Nodes CPU Benchmarks on {{networkName}}",
     "/block-producers>sidebar": "Block Producers",
     "/block-producers>title": "Block Producers - EOSIO + Antelope Network Dashboard",
-    "/block-producers>heading": "Block Producers in {{networkName}}",
+    "/block-producers>heading": "Block Producers on {{networkName}}",
     "/undiscoverable-bps>sidebar": "Undiscoverable BPs",
     "/undiscoverable-bps>title": "Undiscoverable Block Producers or Sock Puppet BPs - EOSIO + Antelope Network Dashboard",
-    "/undiscoverable-bps>heading": "Undiscoverable Paid Block Producers in {{networkName}}",
+    "/undiscoverable-bps>heading": "Undiscoverable Paid Block Producers on {{networkName}}",
     "/rewards-distribution>sidebar": "Rewards Distribution",
     "/rewards-distribution>title": "Rewards Distribution - EOSIO + Antelope Network Dashboard",
     "/rewards-distribution>heading": "Rewards Distribution of {{networkName}}",
     "/nodes>sidebar": "Nodes",
     "/nodes>title": "Nodes - EOSIO + Antelope Network Dashboard",
-    "/nodes>heading": "Nodes in {{networkName}}",
+    "/nodes>heading": "Nodes on {{networkName}}",
     "/nodes-distribution>sidebar": "Geo Distribution",
     "/nodes-distribution>title": "Geographic Distribution of Nodes - EOSIO + Antelope Network Dashboard",
     "/nodes-distribution>heading": "Geographic Distribution of {{networkName}} Nodes",
@@ -86,10 +86,10 @@
     "/ricardian-contract>heading": "",
     "/block-distribution>sidebar": "Block Distribution",
     "/block-distribution>title": "Block Production Distribution - EOSIO + Antelope Network Dashboard",
-    "/block-distribution>heading": "Block Production Distribution in {{networkName}}",
+    "/block-distribution>heading": "Block Production Distribution on {{networkName}}",
     "/missed-blocks>sidebar": "Missed Blocks",
     "/missed-blocks>title": "Missed Blocks - EOSIO + Antelope Network Dashboard",
-    "/missed-blocks>heading": "Missed Blocks in {{networkName}}",
+    "/missed-blocks>heading": "Missed Blocks on {{networkName}}",
     "/stress-test>title": "Stress Test Dashboard - EOSIO + Antelope Network Dashboard",
     "/stress-test>sidebar": "Stress Test",
     "/stress-test>heading": "{{networkName}} Stress Test",
@@ -234,7 +234,7 @@
   },
   "aboutRoute": {
     "body": {
-      "paragraph1": "The Antelope Tools gathers data and enables easy visualization of node status and stats for EOSIO blockchains. It also allows you to visualize the blockchain consensus mechanism in real-time along with other network-specific information, such as the distribution of block producer rewards on the EOS public mainnet and a list of registered entities on the LACChain public-permissioned network. The Antelope Tools is an open-source tool for the EOSIO community to access data, support voting for Block Producers, and fine-tune their infrastructure."
+      "paragraph1": "The Antelope Tools gathers data and enables easy visualization of node status and stats for EOSIO blockchains. It also allows you to visualize the blockchain consensus mechanism in real-time along with other network-specific information, such as the distribution of block producer rewards on the public {{networkName}} and a list of registered entities on the LACChain public-permissioned network. The Antelope Tools is an open-source tool for the EOSIO community to access data, support voting for Block Producers, and fine-tune their infrastructure."
     },
     "subtitle1": "Why Use Antelope Tools?",
     "body1": {
@@ -242,7 +242,7 @@
     },
     "subtitle2": "Why It's Important?",
     "body2": {
-      "paragraph1": "On the EOS network, token holders must vote for Block Producers based on available information. On permissioned networks such as LACChain, the node operators are responsible for the network running smoothly. We believe that monitoring the network is essential to improve and measure node transparency. Antelope Tools's main objective is to help you visualize objective and reliable information about each node and its activity."
+      "paragraph1": "On the {{networkName}} network, token holders must vote for Block Producers based on available information. On permissioned networks such as LACChain, the node operators are responsible for the network running smoothly. We believe that monitoring the network is essential to improve and measure node transparency. Antelope Tools's main objective is to help you visualize objective and reliable information about each node and its activity."
     },
     "subtitle3": "Where Does the Data Come From?",
     "body3": {
diff --git a/webapp/src/language/es.json b/webapp/src/language/es.json
index 4736b0a3..1588dd71 100644
--- a/webapp/src/language/es.json
+++ b/webapp/src/language/es.json
@@ -235,7 +235,7 @@
   },
   "aboutRoute": {
     "body": {
-      "paragraph1": "Antelope Tools recolecta datos y permite una visualización fácil del estado de los nodos y estadísticas de las blockchains de EOSIO. Esto también permite visualizar el método de consenso en tiempo real junto con información específica de la red, tales como la distribución de recompensas de los productores de bloques en la mainnet de EOS y una lista de entidades registradas en la red con permiso público LACChain. Antelope Tools es una herramienta open-source para que la comunidad de EOSIO acceda a los datos, apoye las votaciones por los productores de bloques y afine su infraestructura."
+      "paragraph1": "Antelope Tools recolecta datos y permite una visualización fácil del estado de los nodos y estadísticas de las blockchains de EOSIO. Esto también permite visualizar el método de consenso en tiempo real junto con información específica de la red, tales como la distribución de recompensas de los productores de bloques en {{networkName}} y una lista de entidades registradas en la red con permiso público LACChain. Antelope Tools es una herramienta open-source para que la comunidad de EOSIO acceda a los datos, apoye las votaciones por los productores de bloques y afine su infraestructura."
     },
     "title": "EOSIO Tablero",
     "subtitle1": "¿Por qué usar Antelope Tools?",
@@ -244,7 +244,7 @@
     },
     "subtitle2": "¿Por qué es importante?",
     "body2": {
-      "paragraph1": "En la red EOS, los poseedores de tokens deben votar por los Productores de Bloques basándose en la información disponible. En las redes con permiso, como LACChain, los operadores de nodos son responsables de que la red funcione sin problemas. Creemos que la supervisión de la red es esencial para mejorar y medir la transparencia de los nodos. El objetivo principal de Antelope Tools es ayudar a visualizar información objetiva y fiable sobre cada nodo y su actividad."
+      "paragraph1": "En la red {{networkName}}, los poseedores de tokens deben votar por los Productores de Bloques basándose en la información disponible. En las redes con permiso, como LACChain, los operadores de nodos son responsables de que la red funcione sin problemas. Creemos que la supervisión de la red es esencial para mejorar y medir la transparencia de los nodos. El objetivo principal de Antelope Tools es ayudar a visualizar información objetiva y fiable sobre cada nodo y su actividad."
     },
     "subtitle3": "¿De dónde se obtienen los datos?",
     "body3": {
diff --git a/webapp/src/routes/About/index.js b/webapp/src/routes/About/index.js
index ca9a069c..ca52c8a3 100644
--- a/webapp/src/routes/About/index.js
+++ b/webapp/src/routes/About/index.js
@@ -16,6 +16,11 @@ const useStyles = makeStyles(styles)
 const About = () => {
   const classes = useStyles()
   const { t } = useTranslation('aboutRoute')
+  const networkNameLabel = (
+    eosConfig.networkName !== 'lacchain' ? eosConfig.networkLabel : 'EOS'
+  )
+    .replace(' Mainnet', '')
+    .replace(' Testnet', '')
 
   return (
     <Card className={classes.cardShadow}>
@@ -26,17 +31,26 @@ const About = () => {
           </div>
           <div className={classes.boxInfo}>
             <Typography variant="body2" paragraph>
-              {t('body.paragraph1')}
+              {t('body.paragraph1', { networkName: networkNameLabel })}
+            </Typography>
+            <Typography component="h2" variant="h4">
+              {t('subtitle1')}
             </Typography>
-            <Typography component="h2" variant="h4">{t('subtitle1')}</Typography>
             <Typography variant="body2" paragraph>
               {t('body1.paragraph1')}
             </Typography>
-            <Typography component="h2" variant="h4">{t('subtitle2')}</Typography>
+            <Typography component="h2" variant="h4">
+              {t('subtitle2')}
+            </Typography>
             <Typography variant="body2" paragraph>
-              {t('body2.paragraph1')}
+              {t('body2.paragraph1', { networkName: networkNameLabel })}
+            </Typography>
+            <Typography
+              component="h2"
+              variant="h4"
+            >
+              {t('subtitle3')}
             </Typography>
-            <Typography component="h2" variant="h4" id='where-does-the-data-come-from'>{t('subtitle3')}</Typography>
             {eosConfig.networkName !== 'lacchain' ? (
               <>
                 <Typography variant="body2" paragraph>

From 201e8295cccc9f5b8748b471316621cfa59008b3 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Thu, 14 Sep 2023 10:03:21 -0600
Subject: [PATCH 11/18] chore(webapp): move duplicated text to the general
 language json

---
 webapp/src/language/en.json                | 17 ++++++++++++++++-
 webapp/src/language/en.jungle.json         | 15 ---------------
 webapp/src/language/en.lacchain.json       | 12 ------------
 webapp/src/language/en.libre-testnet.json  | 17 +----------------
 webapp/src/language/en.libre.json          | 17 +----------------
 webapp/src/language/en.mainnet.json        | 15 ---------------
 webapp/src/language/en.proton-testnet.json | 17 +----------------
 webapp/src/language/en.proton.json         | 17 +----------------
 webapp/src/language/en.telos-testnet.json  | 15 ---------------
 webapp/src/language/en.telos.json          | 15 ---------------
 webapp/src/language/en.ultra-testnet.json  | 16 +---------------
 webapp/src/language/en.wax-testnet.json    | 17 +----------------
 webapp/src/language/en.wax.json            | 17 +----------------
 webapp/src/language/es.json                | 17 ++++++++++++++++-
 webapp/src/language/es.jungle.json         | 14 --------------
 webapp/src/language/es.lacchain.json       | 14 +-------------
 webapp/src/language/es.libre-testnet.json  | 17 +----------------
 webapp/src/language/es.libre.json          | 17 +----------------
 webapp/src/language/es.mainnet.json        | 15 ---------------
 webapp/src/language/es.proton-testnet.json | 17 +----------------
 webapp/src/language/es.proton.json         | 17 +----------------
 webapp/src/language/es.telos-testnet.json  | 15 ---------------
 webapp/src/language/es.telos.json          | 15 ---------------
 webapp/src/language/es.ultra-testnet.json  | 17 +----------------
 webapp/src/language/es.wax-testnet.json    | 17 +----------------
 webapp/src/language/es.wax.json            | 17 +----------------
 26 files changed, 47 insertions(+), 369 deletions(-)

diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index 415d420d..b1bdf2d0 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -123,7 +123,22 @@
     "readMore": "Read more",
     "readLess": "Read less",
     "moreDescription": "This is a read more text component for users that either need a bit of help or are new to the system. A clear but not too extensive set of terms and instructions can help users get going without having to over write titles or labels like the one on the search card below. Take a look! A third line is also possible and probably more than enough.",
-    "setLanguage>sidebar": "Change to Spanish - ES"
+    "setLanguage>sidebar": "Change to Spanish - ES",
+    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
+    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
+    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
+    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
+    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
+    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
+    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
+    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
+    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
+    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
+    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
+    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
+    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
+    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
+    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
   },
   "homeRoute": {
     "currentProducer": "Current Producer",
diff --git a/webapp/src/language/en.jungle.json b/webapp/src/language/en.jungle.json
index 19755905..d3159f99 100644
--- a/webapp/src/language/en.jungle.json
+++ b/webapp/src/language/en.jungle.json
@@ -16,21 +16,6 @@
     "/endpoints-stats>title": "API Endpoints Stats - Jungle4 Testnet Network Dashboard",
     "/about>title": "About - Jungle4 Testnet Network Dashboard",
     "/help>title": "Help - Jungle4 Testnet Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
     "/evm>moreDescription": "Monitor EVM statistics, such as transaction amount history, gas price and total wallets created."
   }
 }
diff --git a/webapp/src/language/en.lacchain.json b/webapp/src/language/en.lacchain.json
index cfbd8d09..fdddd386 100644
--- a/webapp/src/language/en.lacchain.json
+++ b/webapp/src/language/en.lacchain.json
@@ -15,31 +15,19 @@
     "/node-config>sidebar": "Node config",
     "/node-config>title": "Node config  - LACChain EOSIO + Antelope Network Dashboard",
     "/node-config>heading": "Configure a new node",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
     "/ricardian-contract>sidebar": "Validator Agreement",
     "/ricardian-contract>heading": "",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
     "/>title": "LACChain EOSIO Network Monitor and Infrastructure Dashboard",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
     "/cpu-benchmark>title": "CPU Benchmarks  - LACChain EOSIO + Antelope Network Dashboard",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
     "/block-producers>title": "Block Producers - LACChain EOSIO + Antelope Network Dashboard",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
     "/rewards-distribution>title": "Rewards Distribution - LACChain EOSIO + Antelope Network Dashboard",
     "/nodes>title": "LACChain EOSIO Nodes Status Monitor",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
     "/nodes-distribution>title": "Geographic Distribution of Nodes - LACChain EOSIO + Antelope Network Dashboard",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
     "/accounts>title": "Accounts and Contracts - LACChain EOSIO + Antelope Network Dashboard",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
     "/bpjson>title": "BP JSON - LACChain EOSIO + Antelope Network Dashboard",
     "/ricardian-contract>title": "BP Agreement - LACChain EOSIO + Antelope Network Dashboard",
     "/block-distribution>title": "Block Production Distribution - LACChain EOSIO + Antelope Network Dashboard",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
     "/missed-blocks>title": "Missed Blocks - LACChain EOSIO + Antelope Network Dashboard",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
     "/endpoints>title": "API Endpoints - LACChain EOSIO + Antelope Network Dashboard",
     "/endpoints-stats>title": "API Endpoints Stats- LACChain EOSIO + Antelope Network Dashboard",
     "/about>title": "About - LACChain EOSIO + Antelope Network Dashboard",
diff --git a/webapp/src/language/en.libre-testnet.json b/webapp/src/language/en.libre-testnet.json
index f7120176..1175e936 100644
--- a/webapp/src/language/en.libre-testnet.json
+++ b/webapp/src/language/en.libre-testnet.json
@@ -16,21 +16,6 @@
     "/endpoints-stats>title": "API Endpoints Stats- Libre Testnet Network Dashboard",
     "/about>title": "About - Libre Testnet Network Dashboard",
     "/help>title": "Help - Libre Testnet Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/faucet>moreDescription": "This tool allows you to create an account and get LIBRE testnet tokens.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/faucet>moreDescription": "This tool allows you to create an account and get LIBRE testnet tokens."
   }
 }
diff --git a/webapp/src/language/en.libre.json b/webapp/src/language/en.libre.json
index 5ae2c4ab..1aec1274 100644
--- a/webapp/src/language/en.libre.json
+++ b/webapp/src/language/en.libre.json
@@ -16,21 +16,6 @@
     "/endpoints-stats>title": "API Endpoints Stats- Libre Mainnet Network Dashboard",
     "/about>title": "About - Libre Mainnet Network Dashboard",
     "/help>title": "Help - Libre Mainnet Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/faucet>moreDescription": "This tool allows you to create an account and get LIBRE testnet tokens.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/faucet>moreDescription": "This tool allows you to create an account and get LIBRE testnet tokens."
   }
 }
diff --git a/webapp/src/language/en.mainnet.json b/webapp/src/language/en.mainnet.json
index e978b1b8..ad1909d5 100644
--- a/webapp/src/language/en.mainnet.json
+++ b/webapp/src/language/en.mainnet.json
@@ -15,21 +15,6 @@
     "/endpoints-stats>title": "API Endpoints Stats- EOS Network Monitor",
     "/about>title": "About - EOS Network Monitor",
     "/help>title": "Help - EOS Network Monitor",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
     "/evm>moreDescription": "Monitor EVM statistics, such as transaction amount history, gas price and total wallets created."
   }
 }
diff --git a/webapp/src/language/en.proton-testnet.json b/webapp/src/language/en.proton-testnet.json
index 255f6449..be0a7afd 100644
--- a/webapp/src/language/en.proton-testnet.json
+++ b/webapp/src/language/en.proton-testnet.json
@@ -15,21 +15,6 @@
     "/endpoints>title": "API Endpoints - Proton Testnet Network Dashboard",
     "/endpoints-stats>title": "API Endpoints Stats- Proton Testnet Network Dashboard",
     "/about>title": "About - Proton Testnet Network Dashboard",
-    "/help>title": "Help - Proton Testnet Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/help>title": "Help - Proton Testnet Network Dashboard"
   }
 }
diff --git a/webapp/src/language/en.proton.json b/webapp/src/language/en.proton.json
index ffeeca7e..d7bd4ea1 100644
--- a/webapp/src/language/en.proton.json
+++ b/webapp/src/language/en.proton.json
@@ -15,21 +15,6 @@
     "/endpoints>title": "API Endpoints - Proton Network Dashboard",
     "/endpoints-stats>title": "API Endpoints Stats- Proton Network Dashboard",
     "/about>title": "About - Proton Network Dashboard",
-    "/help>title": "Help - Proton Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/help>title": "Help - Proton Network Dashboard"
   }
 }
diff --git a/webapp/src/language/en.telos-testnet.json b/webapp/src/language/en.telos-testnet.json
index 715a8dce..2d81190d 100644
--- a/webapp/src/language/en.telos-testnet.json
+++ b/webapp/src/language/en.telos-testnet.json
@@ -16,21 +16,6 @@
     "/endpoints-Stats>title": "API Endpoints Stats- Telos Testnet Network Dashboard",
     "/about>title": "About - Telos Testnet Network Dashboard",
     "/help>title": "Help - Telos Testnet Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
     "/evm>moreDescription": "Monitor Telos EVM statistics (tEVM), such as transaction amount history, gas price and total wallets created.",
     "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM (tEVM) endpoints, with their health status and latency in milliseconds."
   }
diff --git a/webapp/src/language/en.telos.json b/webapp/src/language/en.telos.json
index 1f8f33a8..6418285e 100644
--- a/webapp/src/language/en.telos.json
+++ b/webapp/src/language/en.telos.json
@@ -16,21 +16,6 @@
     "/endpoints-stats>title": "API Endpoints Stats- Telos Network Dashboard",
     "/about>title": "About - Telos Network Dashboard",
     "/help>title": "Help - Telos Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
     "/evm>moreDescription": "Monitor Telos EVM statistics (tEVM), such as transaction amount history, gas price and total wallets created.",
     "/evm-rpc-endpoints>moreDescription": "A list of Telos EVM (tEVM) endpoints, with their health status and latency in milliseconds."
   }
diff --git a/webapp/src/language/en.ultra-testnet.json b/webapp/src/language/en.ultra-testnet.json
index 132ae4d4..763c92b8 100644
--- a/webapp/src/language/en.ultra-testnet.json
+++ b/webapp/src/language/en.ultra-testnet.json
@@ -17,21 +17,7 @@
     "/endpoints-Stats>title": "API Endpoints Stats- Ultra Testnet Dashboard",
     "/about>title": "About - Ultra Testnet Dashboard",
     "/help>title": "Help - Ultra Testnet Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
     "/faucet>moreDescription": "This tool allows you to create an account and get UOS testnet tokens.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Find information on the Ultra Test Network and its current status.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/>moreDescription": "Find information on the Ultra Test Network and its current status."
   }
 }
diff --git a/webapp/src/language/en.wax-testnet.json b/webapp/src/language/en.wax-testnet.json
index 9c4dbb52..391fa89c 100644
--- a/webapp/src/language/en.wax-testnet.json
+++ b/webapp/src/language/en.wax-testnet.json
@@ -15,21 +15,6 @@
     "/endpoints>title": "API Endpoints - WAX Testnet Network Dashboard",
     "/endpoints-Stats>title": "API Endpoints Stats - WAX Testnet Network Dashboard",
     "/about>title": "About - WAX Testnet Network Dashboard",
-    "/help>title": "Help - WAX Testnet Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/help>title": "Help - WAX Testnet Network Dashboard"
   }
 }
diff --git a/webapp/src/language/en.wax.json b/webapp/src/language/en.wax.json
index 736c1bfa..4aa70c46 100644
--- a/webapp/src/language/en.wax.json
+++ b/webapp/src/language/en.wax.json
@@ -15,21 +15,6 @@
     "/endpoints>title": "API Endpoints - WAX Network Dashboard",
     "/endpoints-Stats>title": "API Endpoints Stats- WAX Network Dashboard",
     "/about>title": "About - WAX Network Dashboard",
-    "/help>title": "Help - WAX Network Dashboard",
-    "/rewards-distribution>moreDescription": "A geographic visualization of daily block producer rewards and a list of undiscoverable paid block producers.",
-    "/undiscoverable-bps>moreDescription": "A list of the paid block producers on the network which do not provide information in their BP.json files.",
-    "/bpjson>moreDescription": "A tool for block producers to provide details of their organizations and nodes to comply with the BP information standard.",
-    "/node-config>moreDescription": "Use this tool to obtain example config files to help configure a new node on the network.",
-    "/ricardian-contract>moreDescription": "The on-chain ricardian contract that describes the validator node agreement of this network.",
-    "/>moreDescription": "Monitor the infrastructure of blockchain networks using Antelope + EOSIO blockchain technology.",
-    "/cpu-benchmark>moreDescription": "A visualization of CPU usage in microseconds by block producer nodes accounts, with lowest, highest, and average usage data.",
-    "/block-producers>moreDescription": "A list of the block producers in the network – blockchain accounts registered to run nodes on the network. It includes information from chain tables and their bp.json files.",
-    "/nodes>moreDescription": "A list of all the nodes run by block producers comprising the network with specific information such as endpoints and location.",
-    "/endpoints>moreDescription": "An updated list of public API endpoints provided by node operators and their health status.",
-    "/endpoints-stats>moreDescription": "Response time statistics from Costa Rica and the availability of a producer's endpoints.",
-    "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
-    "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
-    "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/help>title": "Help - WAX Network Dashboard"
   }
 }
diff --git a/webapp/src/language/es.json b/webapp/src/language/es.json
index 1588dd71..64009219 100644
--- a/webapp/src/language/es.json
+++ b/webapp/src/language/es.json
@@ -124,7 +124,22 @@
     "readMore": "Ver más",
     "readLess": "Ver menos",
     "moreDescription": "Este es un componente de lectura de texto para los usuarios que necesitan un poco de ayuda o son nuevos en el sistema. Un conjunto claro pero no demasiado extenso de términos e instrucciones puede ayudar a los usuarios a comenzar sin tener que escribir demasiado sobre títulos o etiquetas como la que se encuentra en la tarjeta de búsqueda a continuación. ¡Echar un vistazo! Una tercera línea también es posible y probablemente más que suficiente.",
-    "setLanguage>sidebar": "Cambiar a Inglés - EN"
+    "setLanguage>sidebar": "Cambiar a Inglés - EN",
+    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.", 
+    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
+    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
+    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
+    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
+    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
+    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
+    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
+    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
+    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
+    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
+    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
+    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
+    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
+    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
   },
   "homeRoute": {
     "currentProducer": "Productor de Bloque Actual",
diff --git a/webapp/src/language/es.jungle.json b/webapp/src/language/es.jungle.json
index 8d4ce17b..4dd4c67c 100644
--- a/webapp/src/language/es.jungle.json
+++ b/webapp/src/language/es.jungle.json
@@ -15,20 +15,6 @@
     "/about>title": "Acerca de - Panel",
     "/help>title": "Ayuda - Panel",
     "/rewards-distribution>moreDescription": "Una lista de entidades que forman parte de la red. Pueden ser entidades asociadas o no asociadas.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red.",
     "/evm>moreDescription": "Supervise las estadísticas del EVM, como el histórico de la cantidad de transacciones, el precio del gas y las wallets creadas totales."
   }
 }
diff --git a/webapp/src/language/es.lacchain.json b/webapp/src/language/es.lacchain.json
index 27c42ed5..4733b207 100644
--- a/webapp/src/language/es.lacchain.json
+++ b/webapp/src/language/es.lacchain.json
@@ -30,19 +30,7 @@
     "/help>title": "Ayuda - Panel",
     "/entities>moreDescription": "Una lista de entidades que forman parte de la red. Pueden ser entidades socias o no socias.",
     "/lacchain/network>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/management>moreDescription": "Inicie sesión para administrar su cuenta LACChain.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/management>moreDescription": "Inicie sesión para administrar su cuenta LACChain."
   },
   "common": {
     "producerName": "Nombre de la entidad",
diff --git a/webapp/src/language/es.libre-testnet.json b/webapp/src/language/es.libre-testnet.json
index 83a24346..50d52b3d 100644
--- a/webapp/src/language/es.libre-testnet.json
+++ b/webapp/src/language/es.libre-testnet.json
@@ -14,21 +14,6 @@
     "/endpoints-stats>title": "Estadísticas de URL's - Libre Testnet",
     "/about>title": "Acerca de - Panel",
     "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/faucet>moreDescription": "Esta herramienta permite crear cuentas y transferir tokens.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/faucet>moreDescription": "Esta herramienta permite crear cuentas y transferir tokens."
   }
 }
diff --git a/webapp/src/language/es.libre.json b/webapp/src/language/es.libre.json
index 4beaeee5..bd2c9d7f 100644
--- a/webapp/src/language/es.libre.json
+++ b/webapp/src/language/es.libre.json
@@ -14,21 +14,6 @@
     "/endpoints>title-stats": "URL's - Libre Mainnet",
     "/about>title": "Acerca de - Panel",
     "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/faucet>moreDescription": "Esta herramienta permite crear cuentas y transferir tokens.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/faucet>moreDescription": "Esta herramienta permite crear cuentas y transferir tokens."
   }
 }
diff --git a/webapp/src/language/es.mainnet.json b/webapp/src/language/es.mainnet.json
index e4e2f2c1..8513defa 100644
--- a/webapp/src/language/es.mainnet.json
+++ b/webapp/src/language/es.mainnet.json
@@ -14,21 +14,6 @@
     "/endpoints-stats>title": "Estadísticas de URL's - EOS Mainnet",
     "/about>title": "Acerca de - Panel",
     "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red.",
     "/evm>moreDescription": "Supervise las estadísticas del EVM, como el histórico de la cantidad de transacciones, el precio del gas y las wallets creadas totales."
   }
 }
diff --git a/webapp/src/language/es.proton-testnet.json b/webapp/src/language/es.proton-testnet.json
index edf7808f..a8d4b8ba 100644
--- a/webapp/src/language/es.proton-testnet.json
+++ b/webapp/src/language/es.proton-testnet.json
@@ -13,21 +13,6 @@
     "/endpoints>title": "URL's - Proton Testnet",
     "/endpoints-stats>title": "Estadísticas de URL's - Proton Testnet",
     "/about>title": "Acerca de - Panel",
-    "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/help>title": "Ayuda - Panel"
   }
 }
diff --git a/webapp/src/language/es.proton.json b/webapp/src/language/es.proton.json
index e9b43bad..6cecbefb 100644
--- a/webapp/src/language/es.proton.json
+++ b/webapp/src/language/es.proton.json
@@ -13,21 +13,6 @@
     "/endpoints>title": "URL's - Proton",
     "/endpoints-stats>title": "Estadísticas de URL's - Proton",
     "/about>title": "Acerca de - Panel",
-    "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/help>title": "Ayuda - Panel"
   }
 }
diff --git a/webapp/src/language/es.telos-testnet.json b/webapp/src/language/es.telos-testnet.json
index 95829b9e..32fc9cc2 100644
--- a/webapp/src/language/es.telos-testnet.json
+++ b/webapp/src/language/es.telos-testnet.json
@@ -14,21 +14,6 @@
     "/endpoints-stats>title": "Estadísticas de URL's - Telos Testnet",
     "/about>title": "Acerca de - Panel",
     "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red.",
     "/evm>moreDescription": "Supervise las estadísticas del Telos EVM (tEVM), como el histórico de la cantidad de transacciones, el precio del gas y las wallets creadas totales.",
     "/evm-rpc-endpoints>moreDescription": "Una lista de puntos finales de Telos EVM (tEVM), con sus estado de salud y latencia en milisegundos."
   }
diff --git a/webapp/src/language/es.telos.json b/webapp/src/language/es.telos.json
index 72554fc0..507f6c02 100644
--- a/webapp/src/language/es.telos.json
+++ b/webapp/src/language/es.telos.json
@@ -14,21 +14,6 @@
     "/endpoints-stats>title": "Estadísticas de URL's - Telos",
     "/about>title": "Acerca de - Panel",
     "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red.",
     "/evm>moreDescription": "Supervise las estadísticas del Telos EVM (tEVM), como el histórico de la cantidad de transacciones, el precio del gas y las wallets creadas totales.",
     "/evm-rpc-endpoints>moreDescription": "Una lista de puntos finales de Telos EVM (tEVM), con sus estado de salud y latencia en milisegundos."
   }
diff --git a/webapp/src/language/es.ultra-testnet.json b/webapp/src/language/es.ultra-testnet.json
index 7256d068..ca6cdb3e 100644
--- a/webapp/src/language/es.ultra-testnet.json
+++ b/webapp/src/language/es.ultra-testnet.json
@@ -15,21 +15,6 @@
     "/endpoints-stats>title": "Estadísticas de URL's - Ultra",
     "/about>title": "Acerca de - Panel",
     "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/faucet>moreDescription": "Esta herramienta permite crear cuentas y transferir tokens.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/faucet>moreDescription": "Esta herramienta permite crear cuentas y transferir tokens."
   }
 }
diff --git a/webapp/src/language/es.wax-testnet.json b/webapp/src/language/es.wax-testnet.json
index 50dac078..71b5ee29 100644
--- a/webapp/src/language/es.wax-testnet.json
+++ b/webapp/src/language/es.wax-testnet.json
@@ -13,21 +13,6 @@
     "/endpoints>title": "URL's - WAX Testnet",
     "/endpoints-stats>title": "Estadísticas de URL's - WAX Testnet",
     "/about>title": "Acerca de - Panel",
-    "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/help>title": "Ayuda - Panel"
   }
 }
diff --git a/webapp/src/language/es.wax.json b/webapp/src/language/es.wax.json
index f30014d8..6a02cfe4 100644
--- a/webapp/src/language/es.wax.json
+++ b/webapp/src/language/es.wax.json
@@ -13,21 +13,6 @@
     "/endpoints>title": "URL's - WAX",
     "/endpoints-stats>title": "Estadísticas de URL's - WAX",
     "/about>title": "Acerca de - Panel",
-    "/help>title": "Ayuda - Panel",
-    "/rewards-distribution>moreDescription": "Distribución diaria de recompensas de BP por ubicación geográfica de los productores de bloques pagados.",
-    "/undiscoverable-bps>moreDescription": "Una lista de los productores de bloques en la red que son pagados y no proveen información en sus archivos bp.json.",
-    "/bpjson>moreDescription": "Una representación visual de los nodos actuales de la red.",
-    "/node-config>moreDescription": "Utilice esta herramienta para obtener archivos de configuración de ejemplo para ayudar a configurar un nuevo nodo en la red.",
-    "/ricardian-contract>moreDescription": "Lea más sobre el Acuerdo de nodo de validación de esta red. Contáctenos si tiene alguna consulta.",
-    "/>moreDescription": "Encuentre datos de redes blockchain utilizando la tecnología EOSIO. Vea más redes aquí: https://antelope.tools/.",
-    "/cpu-benchmark>moreDescription": "Una visualización del uso de CPU en microsegundos por cuentas de nodos productores de bloques, con datos de uso más bajos, más altos y promedio.",
-    "/block-producers>moreDescription": "Una lista de los productores de bloques en la red: cuentas de blockchain registradas para ejecutar nodos en la red. Incluye información de tablas en cadena y sus archivos bp.json.",
-    "/nodes>moreDescription": "Una lista de todos los nodos ejecutados por entidades que componen la red con información específica como puntos finales y ubicación.",
-    "/endpoints>moreDescription": "Una lista actualizada de los puntos finales de la API pública proporcionada por los operadores de nodos en la red.",
-    "/endpoints-stats>moreDescription": "Estadísticas del tiempo de respuesta desde Costa Rica y la disponibilidad de los puntos finales de un productor",
-    "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
-    "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
-    "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/help>title": "Ayuda - Panel"
   }
 }

From 9b40479ed07b9161067be9a7cc845df91f6a4fb3 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Mon, 18 Sep 2023 10:14:07 -0600
Subject: [PATCH 12/18] feat(webapp): add separate meta description per page

---
 webapp/public/index.html                 | 16 ----------------
 webapp/src/components/PageTitle/index.js | 14 +++++++++++---
 webapp/src/language/en.json              |  4 +++-
 webapp/src/layouts/Dashboard.js          | 10 +++++++++-
 4 files changed, 23 insertions(+), 21 deletions(-)

diff --git a/webapp/public/index.html b/webapp/public/index.html
index 5f09517a..0d37a092 100644
--- a/webapp/public/index.html
+++ b/webapp/public/index.html
@@ -16,14 +16,6 @@
     <meta name="theme-color" content="#ffffff" />
     <meta name="_token" content="" />
     <meta name="robots" content="noodp" />
-    <meta
-      name="title"
-      content="Antelope Tools network monitors real-time infrastructure data for multiple Antelope and EOSIO chains."
-    />
-    <meta
-      name="description"
-      content="Antelope Tools Dashboard is a network monitor featuring real-time data on block producer nodes and blockchain infrastructure for multiple Antelope and EOSIO chains."
-    />
     <meta
       property="image"
       content="https://eos.antelope.tools/maskable_icon.png"
@@ -31,10 +23,6 @@
     <meta property="og:type" content="website" />
     <meta property="twitter:card" content="summary_large_image" />
     <meta property="twitter:url" content="%PUBLIC_URL%/" />
-    <meta
-      property="og:title"
-      content="Antelope Tools network monitor real-time infrastructure data for multiple Antelope and EOSIO chains."
-    />
     <meta
       property="og:image"
       content="https://eos.antelope.tools/maskable_icon.png"
@@ -42,10 +30,6 @@
     <meta content="image/*" property="og:image:type" />
     <meta property="og:url" content="%PUBLIC_URL%/" />
     <meta property="og:site_name" content="Dashboard" />
-    <meta
-      property="og:description"
-      content="Antelope Tools Dashboard is a network monitor featuring real-time data on block producer nodes and blockchain infrastructure for multiple Antelope and EOSIO chains."
-    />
 
     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
     <link
diff --git a/webapp/src/components/PageTitle/index.js b/webapp/src/components/PageTitle/index.js
index bf1ec551..c1b84ef1 100644
--- a/webapp/src/components/PageTitle/index.js
+++ b/webapp/src/components/PageTitle/index.js
@@ -4,18 +4,26 @@ import PropTypes from 'prop-types'
 
 import { generalConfig } from '../../config'
 
-const PageTitle = ({ title }) => (
+const PageTitle = ({ title, metaTitle, metaDescription }) => (
   <Helmet>
     <title>{title}</title>
+    <meta name="title" content={metaTitle} />
+    <meta name="description" content={metaDescription} />
+    <meta property="og:title" content={metaTitle} />
+    <meta property="og:description" content={metaDescription} />
   </Helmet>
 )
 
 PageTitle.propTypes = {
-  title: PropTypes.string
+  title: PropTypes.string,
+  metaTitle: PropTypes.string,
+  metaDescription: PropTypes.string,
 }
 
 PageTitle.defaultProps = {
-  title: generalConfig.title
+  title: generalConfig.title,
+  metaTitle: '',
+  metaDescription: '',
 }
 
 export default PageTitle
diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index b1bdf2d0..7834d2d3 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -48,7 +48,9 @@
     "noOptions": "No matches",
     "updatedAt": "Updated at",
     "nextUpdateAt": "Next update at",
-    "secondsAgo": "Seconds Ago"
+    "secondsAgo": "Seconds Ago",
+    "metaTitle": "Antelope Tools network monitors real-time infrastructure data for multiple Antelope and EOSIO chains.",
+    "metaDescription": "Antelope Tools Dashboard is a network monitor featuring real-time data on block producer nodes and blockchain infrastructure for multiple Antelope and EOSIO chains."
   },
   "routes": {
     "/>sidebar": "Dashboard",
diff --git a/webapp/src/layouts/Dashboard.js b/webapp/src/layouts/Dashboard.js
index efd2353f..193ac6ef 100644
--- a/webapp/src/layouts/Dashboard.js
+++ b/webapp/src/layouts/Dashboard.js
@@ -81,7 +81,15 @@ const Dashboard = ({ children }) => {
     <div className={classes.root}>
       <CssBaseline />
       <GlobalStyle />
-      <PageTitle title={t(routeName.pageTitle)} />
+      <PageTitle
+        title={t(routeName.pageTitle)}
+        metaTitle={routeName.dynamicTitle || t('metaTitle')}
+        metaDescription={
+          (i18n.exists(`routes:${location.pathname}>moreDescription`)
+            ? t(`${location.pathname}>moreDescription`)
+            : t('metaDescription')) || t('metaDescription')
+        }
+      />
       <div className={classes.header}>
         <Header onDrawerToggle={handleDrawerToggle} />
       </div>

From 39e355a378cdd6ab7d406f3e902e635e74802afb Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Mon, 18 Sep 2023 15:59:26 -0600
Subject: [PATCH 13/18] fix(webapp): use hook to validate bp logos

---
 .../src/components/InformationCard/styles.js  |  1 +
 webapp/src/components/ProducerAvatar/index.js | 11 +++++++---
 webapp/src/components/ProducersChart/index.js |  3 +--
 .../src/hooks/customHooks/useBPLogoState.js   | 20 +++++++++++++++++++
 webapp/src/utils/index.js                     |  1 -
 webapp/src/utils/validate-image.js            | 11 ----------
 6 files changed, 30 insertions(+), 17 deletions(-)
 create mode 100644 webapp/src/hooks/customHooks/useBPLogoState.js
 delete mode 100644 webapp/src/utils/validate-image.js

diff --git a/webapp/src/components/InformationCard/styles.js b/webapp/src/components/InformationCard/styles.js
index 1051c17b..0544558f 100644
--- a/webapp/src/components/InformationCard/styles.js
+++ b/webapp/src/components/InformationCard/styles.js
@@ -61,6 +61,7 @@ export default (theme) => ({
     '& img': {
       width: 82,
       height: 82,
+      aspectRatio: '1 / 1',
     },
     '& .bpName': {
       fontSize: 28,
diff --git a/webapp/src/components/ProducerAvatar/index.js b/webapp/src/components/ProducerAvatar/index.js
index ec384052..b1bfe540 100644
--- a/webapp/src/components/ProducerAvatar/index.js
+++ b/webapp/src/components/ProducerAvatar/index.js
@@ -3,15 +3,20 @@ import PropTypes from 'prop-types'
 
 import { generalConfig } from '../../config'
 import { onImgError } from '../../utils'
-import isLogoValid from '../../utils/validate-image'
+import useBPLogoState from 'hooks/customHooks/useBPLogoState'
 
 const ProducerAvatar = ({ logo, name, classes }) => {
+  const defaultLogo = generalConfig.defaultProducerLogo
+  const [{ src, logoRef }, { handleLoad }] = useBPLogoState(logo, defaultLogo)
+
   return (
     <img
       loading="lazy"
       className={classes?.avatar}
-      src={isLogoValid(logo) ? logo : generalConfig.defaultProducerLogo}
-      onError={onImgError(generalConfig.defaultProducerLogo)}
+      src={src}
+      ref={logoRef}
+      onLoad={handleLoad}
+      onError={onImgError(defaultLogo)}
       alt={`${name} logo`}
     />
   )
diff --git a/webapp/src/components/ProducersChart/index.js b/webapp/src/components/ProducersChart/index.js
index 01b4003f..55cad4a4 100644
--- a/webapp/src/components/ProducersChart/index.js
+++ b/webapp/src/components/ProducersChart/index.js
@@ -9,7 +9,6 @@ import { useTheme } from '@mui/material/styles'
 import { useTranslation } from 'react-i18next'
 
 import { formatWithThousandSeparator, onImgError } from '../../utils'
-import isLogoValid from '../../utils/validate-image'
 import { eosConfig, generalConfig } from '../../config'
 
 import styles from './styles'
@@ -158,7 +157,7 @@ const CustomBarLabel = memo(
                 width="100"
                 height="100"
                 href={
-                  isLogoValid(payload.logo)
+                  payload.logo?.startsWith('https')
                     ? payload.logo
                     : generalConfig.defaultProducerLogo
                 }
diff --git a/webapp/src/hooks/customHooks/useBPLogoState.js b/webapp/src/hooks/customHooks/useBPLogoState.js
new file mode 100644
index 00000000..64768095
--- /dev/null
+++ b/webapp/src/hooks/customHooks/useBPLogoState.js
@@ -0,0 +1,20 @@
+import { useState, useRef } from 'react'
+
+const useBPLogoState = ( logo, defaultLogo ) => {
+  const [src, setSrc] = useState(logo?.startsWith('https') ? logo : defaultLogo)
+  const logoRef = useRef(null)
+
+  const handleLoad = () => {
+    if (!logoRef?.current) return
+
+    const { naturalHeight, naturalWidth } = logoRef.current
+
+    if (naturalHeight < 100 || naturalHeight !== naturalWidth) {
+      setSrc(defaultLogo)
+    }
+  }
+
+  return [{ src, logoRef }, { handleLoad }]
+}
+
+export default useBPLogoState
diff --git a/webapp/src/utils/index.js b/webapp/src/utils/index.js
index 2041205c..5a0a7465 100644
--- a/webapp/src/utils/index.js
+++ b/webapp/src/utils/index.js
@@ -5,7 +5,6 @@ export * from './formatData'
 export * from './get-blocknum-url'
 export * from './get-range-options'
 export * from './get-transaction-url'
-export * from './validate-image'
 export * from './validate-url'
 export * from './get-evmblocknum-url'
 export * from './get-endpoint-health-status'
diff --git a/webapp/src/utils/validate-image.js b/webapp/src/utils/validate-image.js
deleted file mode 100644
index 2b0b515d..00000000
--- a/webapp/src/utils/validate-image.js
+++ /dev/null
@@ -1,11 +0,0 @@
-const isLogoValid = (imgUrl) => {
-  if (!imgUrl || !imgUrl.startsWith('https')) return false
-
-  const img = new Image()
-
-  img.src = imgUrl
-
-  return img.width >= 100 && img.height === img.width
-}
-
-export default isLogoValid

From 9e3d85151be4754899ddd275e2f158dec2bcfe76 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 19 Sep 2023 09:28:25 -0600
Subject: [PATCH 14/18] fix(webapp): missing logos in nodes page

---
 webapp/src/gql/producer.gql.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/webapp/src/gql/producer.gql.js b/webapp/src/gql/producer.gql.js
index 1e17debe..1c3dfe60 100644
--- a/webapp/src/gql/producer.gql.js
+++ b/webapp/src/gql/producer.gql.js
@@ -63,6 +63,7 @@ export const NODES_SUBSCRIPTION = gql`
       owner
       rank
       producer_key
+      bp_json
       nodes {
         type
         full

From 00b46bedf42055f951709022012808cff7ae3a60 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 19 Sep 2023 10:47:40 -0600
Subject: [PATCH 15/18] chore(webapp): remove unneeded hook to translate nodes
 types

---
 webapp/src/components/NodesSummary/index.js   | 13 +------------
 webapp/src/components/SimpleDataCard/index.js |  2 +-
 webapp/src/language/en.json                   |  6 +-----
 webapp/src/language/es.json                   |  6 +-----
 4 files changed, 4 insertions(+), 23 deletions(-)

diff --git a/webapp/src/components/NodesSummary/index.js b/webapp/src/components/NodesSummary/index.js
index cfb42cbe..2af675bf 100644
--- a/webapp/src/components/NodesSummary/index.js
+++ b/webapp/src/components/NodesSummary/index.js
@@ -2,7 +2,6 @@
 import React, { memo, useEffect, useState } from 'react'
 import PropTypes from 'prop-types'
 import { useQuery } from '@apollo/client'
-import { useTranslation } from 'react-i18next'
 
 import { NODES_SUMMARY_QUERY } from '../../gql'
 import { eosConfig } from '../../config'
@@ -27,8 +26,6 @@ const NODES_ORDER = [
 
 const NodesSummary = ({ t }) => {
   const { data, loading } = useQuery(NODES_SUMMARY_QUERY)
-  const { i18n } = useTranslation('translations')
-  const [currentLanguaje, setCurrentLanguaje] = useState('')
   const [total, setTotal] = useState()
   const [nodes, setNodes] = useState()
 
@@ -65,10 +62,6 @@ const NodesSummary = ({ t }) => {
     setNodes(sortedNodes)
   }, [data])
 
-  useEffect(() => {
-    setCurrentLanguaje(i18n.language.substring(0, 2))
-  }, [i18n.language])
-
   return (
     <>
       <SimpleDataCard
@@ -89,11 +82,7 @@ const NodesSummary = ({ t }) => {
                 ? t(`tooltip.${node.type}`)
                 : ''
             }
-            title={
-              currentLanguaje === 'es'
-                ? t('nodes') + ' ' + t(node.type)
-                : t(node.type) + ' ' + t('nodes')
-            }
+            title={t('nodeType', { nodeType: node.type })}
             value={node.value || 0}
             loading={loading}
           />
diff --git a/webapp/src/components/SimpleDataCard/index.js b/webapp/src/components/SimpleDataCard/index.js
index b7ff96f1..ccb88e7a 100644
--- a/webapp/src/components/SimpleDataCard/index.js
+++ b/webapp/src/components/SimpleDataCard/index.js
@@ -53,7 +53,7 @@ const SimpleDataCard = ({
             </div>
           )}
           {isNotLoading ? (
-            value ? (
+            value.toString() ? (
               <Typography
                 component="p"
                 variant="h6"
diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index 7834d2d3..4e089040 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -165,11 +165,6 @@
     "transactionsPerSecond": "Transactions per Second",
     "transactionsPerBlock": "Transactions per Block",
     "nodes": "Nodes",
-    "full": "Full",
-    "seed": "Seed",
-    "query": "Query",
-    "producer": "Producer",
-    "query, seed": "Query, Seed",
     "undefined": "Undefined",
     "unknown": "Unknown",
     "uniqueLocations": "Unique Locations",
@@ -181,6 +176,7 @@
     "cpuUsage": "CPU Usage",
     "netUsage": "NET Usage",
     "average": "Average",
+    "nodeType":"{{nodeType}} $t(nodes)",
     "tooltip": {
       "lastBlock": "The last confirmed block produced",
       "bpSchedule": "Current top 21 block producers",
diff --git a/webapp/src/language/es.json b/webapp/src/language/es.json
index 64009219..649b62ea 100644
--- a/webapp/src/language/es.json
+++ b/webapp/src/language/es.json
@@ -163,11 +163,6 @@
     "transactionsPerSecond": "Transacciones por segundo",
     "transactionsPerBlock": "Transacciones por bloque",
     "nodes": "Nodos",
-    "full": "Tipo Full",
-    "seed": "Tipo Seed",
-    "query": "Tipo Query",
-    "producer": "Tipo Producer",
-    "query, seed": "Query, Seed",
     "undefined": "No Identificados",
     "unknown": "No Identificados",
     "transactions": "Transacciones",
@@ -180,6 +175,7 @@
     "cpuUsage": "Uso del CPU",
     "netUsage": "Uso de NET",
     "average": "Promedio",
+    "nodeType":"$t(nodes) Tipo {{nodeType}}",
     "tooltip": {
       "lastBlock": "El último bloque confirmado producido",
       "bpSchedule": "Top 21 Productores de bloques actuales",

From c8f64a74862fd48ed69af32c794b4ffae07e879e Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 19 Sep 2023 10:59:04 -0600
Subject: [PATCH 16/18] chore(webapp): add stress test missing description text

---
 webapp/src/language/en.json | 3 ++-
 webapp/src/language/es.json | 3 ++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index 4e089040..b69c200a 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -140,7 +140,8 @@
     "/nodes-distribution>moreDescription": "A visualization of the geographic distribution of the nodes in this network.",
     "/accounts>moreDescription": "This tool helps find information about accounts and interact with contracts on the network. Enter an account name and obtain account information, smart contract actions, and table data.",
     "/block-distribution>moreDescription": "A visualization of the distribution of blocks produced by the nodes in the network.",
-    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network."
+    "/missed-blocks>moreDescription": "A list of scheduled, produced, and missed blocks by each account in the network.",
+    "/stress-test>moreDescription": "Monitor current and historical data about transactions, such as resource utilization and all-time high TPS."
   },
   "homeRoute": {
     "currentProducer": "Current Producer",
diff --git a/webapp/src/language/es.json b/webapp/src/language/es.json
index 649b62ea..82f31e8e 100644
--- a/webapp/src/language/es.json
+++ b/webapp/src/language/es.json
@@ -139,7 +139,8 @@
     "/nodes-distribution>moreDescription": "Una visualización de la distribución geográfica de los nodos de esta red.",
     "/accounts>moreDescription": "Esta herramienta le ayuda a buscar información sobre cuentas y contratos de la red. Escriba el nombre de un contrato o cuenta en el espacio provisto para comenzar a buscar. Obtendrá los datos de las acciones del contrato, tablas de contrato, alcance, límites superior e inferior y límites.",
     "/block-distribution>moreDescription": "Una visualización de la distribución de bloques producida por los nodos de la red.",
-    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red."
+    "/missed-blocks>moreDescription": "Una lista de bloques programados, producidos y perdidos por cada cuenta en la red.",
+    "/stress-test>moreDescription": "Supervise datos actuales e históricos sobre las transacciones, como la utilización de los recursos y el TPS máximo histórico"
   },
   "homeRoute": {
     "currentProducer": "Productor de Bloque Actual",

From c0af4e679ec0555488729f2595a95f52b34a0bc8 Mon Sep 17 00:00:00 2001
From: codefactor-io <support@codefactor.io>
Date: Tue, 19 Sep 2023 19:00:19 +0000
Subject: [PATCH 17/18] [CodeFactor] Apply fixes

---
 webapp/src/hooks/customHooks/useBPLogoState.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/src/hooks/customHooks/useBPLogoState.js b/webapp/src/hooks/customHooks/useBPLogoState.js
index 64768095..d63ab0d8 100644
--- a/webapp/src/hooks/customHooks/useBPLogoState.js
+++ b/webapp/src/hooks/customHooks/useBPLogoState.js
@@ -1,6 +1,6 @@
 import { useState, useRef } from 'react'
 
-const useBPLogoState = ( logo, defaultLogo ) => {
+const useBPLogoState = (logo, defaultLogo) => {
   const [src, setSrc] = useState(logo?.startsWith('https') ? logo : defaultLogo)
   const logoRef = useRef(null)
 

From a2b2736785267ac6a2d5533315cd9247b7a06c66 Mon Sep 17 00:00:00 2001
From: Torresmorah <torresmorah@gmail.com>
Date: Tue, 19 Sep 2023 15:11:45 -0600
Subject: [PATCH 18/18] chore(webapp): add default meta description and twitter
 tags

---
 webapp/public/index.html | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/webapp/public/index.html b/webapp/public/index.html
index 0d37a092..cb5b5b58 100644
--- a/webapp/public/index.html
+++ b/webapp/public/index.html
@@ -16,6 +16,14 @@
     <meta name="theme-color" content="#ffffff" />
     <meta name="_token" content="" />
     <meta name="robots" content="noodp" />
+    <meta
+      name="title"
+      content="Antelope Tools network monitors real-time infrastructure data for multiple Antelope and EOSIO chains."
+    />
+    <meta
+      name="description"
+      content="Antelope Tools Dashboard is a network monitor featuring real-time data on block producer nodes and blockchain infrastructure for multiple Antelope and EOSIO chains."
+    />
     <meta
       property="image"
       content="https://eos.antelope.tools/maskable_icon.png"
@@ -23,6 +31,26 @@
     <meta property="og:type" content="website" />
     <meta property="twitter:card" content="summary_large_image" />
     <meta property="twitter:url" content="%PUBLIC_URL%/" />
+    <meta 
+      property="twitter:title" 
+      content="Antelope Tools network monitors real-time infrastructure data for multiple Antelope and EOSIO chains."
+    />
+    <meta 
+      property="twitter:description" 
+      content="Antelope Tools Dashboard is a network monitor featuring real-time data on block producer nodes and blockchain infrastructure for multiple Antelope and EOSIO chains."
+    />
+    <meta
+      property="twitter:image"
+      content="https://eos.antelope.tools/maskable_icon.png"
+    />
+    <meta
+      property="og:title"
+      content="Antelope Tools network monitors real-time infrastructure data for multiple Antelope and EOSIO chains."
+    />
+    <meta
+      property="og:description"
+      content="Antelope Tools Dashboard is a network monitor featuring real-time data on block producer nodes and blockchain infrastructure for multiple Antelope and EOSIO chains."
+    />
     <meta
       property="og:image"
       content="https://eos.antelope.tools/maskable_icon.png"