Merge pull request #1299 from edenia/dev

Production Release

.github/workflows/deploy-jungle-testnet.yaml

@@ -52,7 +52,7 @@ jobs:
           REACT_APP_SYNC_TOLERANCE_INTERVAL: 180000
           REACT_APP_TOKEN_SYMBOL: 'EOS'
           REACT_APP_NETWORK_URL:  '[{"label":"EOS","value":"https://eos.antelope.tools","mainnet":true,"pair":"eos","icon":"eos","order":5},{"label":"Proton","value":"https://proton.antelope.tools","mainnet":true,"pair":"proton","icon":"proton","order":3},{"label":"WAX","value":"https://wax.antelope.tools","mainnet":true,"pair":"wax","icon":"wax","order":4},{"label":"Telos","value":"https://telos.antelope.tools","mainnet":true,"pair":"telos","icon":"telos","order":1},{"label":"Libre","value":"https://libre.antelope.tools","mainnet":true,"pair":"libre","icon":"libre","order":2},{"label":"LACChain EOSIO","value":"https://lacchain.antelope.tools","mainnet":true,"pair":null,"icon":"lacchain","order":6},{"label":"Jungle4 Testnet","value":"https://jungle.antelope.tools","mainnet":false,"pair":"eos","icon":"jungle","order":5},{"label":"Proton Testnet","value":"https://proton-testnet.antelope.tools","mainnet":false,"pair":"proton","icon":"proton","order":3},{"label":"WAX Testnet","value":"https://wax-testnet.antelope.tools","mainnet":false,"pair":"wax","icon":"wax","order":4},{"label":"Telos Testnet","value":"https://telos-testnet.antelope.tools","mainnet":false,"pair":"telos","icon":"telos","order":1},{"label":"Libre Testnet","value":"https://libre-testnet.antelope.tools","mainnet":false,"pair":"libre","icon":"libre","order":2},{"label":"Ultra Testnet","value":"https://ultra-testnet.antelope.tools","mainnet":false,"pair":"ultra","icon":"ultra","order":6}]'
-          REACT_APP_DISABLED_MENU_ITEMS: '["/missed-blocks","/block-distribution","/cpu-benchmark","/stress-test","/evm","/evm-rpc-endpoints"]'
+          REACT_APP_DISABLED_MENU_ITEMS: '["/missed-blocks","/block-distribution","/stress-test","/evm","/evm-rpc-endpoints"]'
           REACT_APP_BLOCK_EXPLORER_URL: 'https://jungle4.eosq.eosnation.io/tx/(transaction)'
           REACT_APP_STATE_HISTORY_ENABLED: 'false'
           REACT_APP_GOOGLE_ANALITIC_PAGE_ID: 'G-E6Y0EC9FT8'
@@ -83,6 +83,7 @@ jobs:
           HAPI_EOS_BASE_ACCOUNT: ${{ secrets.HAPI_EOS_BASE_ACCOUNT }}
           HAPI_EOS_BASE_ACCOUNT_PASSWORD: ${{ secrets.HAPI_EOS_BASE_ACCOUNT_PASSWORD }}
           HAPI_EOS_MECHANICS_ACCOUNT: ${{ secrets.HAPI_EOS_MECHANICS_ACCOUNT }}
+          HAPI_EOS_MECHANICS_CUSTOM_PERMISSION: 'benchmark'
           HAPI_EOS_MECHANICS_PASSWORD: ${{ secrets.HAPI_EOS_MECHANICS_PASSWORD }}
           HAPI_EOS_WALLET_URL: http://dashboard-wallet:8888
           HAPI_EOS_BP_JSON_ON_CHAIN: false

webapp/public/sitemap.jungle.xml

@@ -31,6 +31,10 @@
       <loc>https://jungle.antelope.tools/undiscoverable-bps</loc>
       <lastmod>2023-09-07</lastmod>
    </url>
+   <url>
+      <loc>https://jungle.antelope.tools/cpu-benchmark</loc>
+      <lastmod>2023-09-10</lastmod>
+   </url>
    <url>
       <loc>https://jungle.antelope.tools/ricardian-contract</loc>
       <lastmod>2023-09-07</lastmod>

webapp/public/sitemap.proton.xml

@@ -32,6 +32,10 @@
       <loc>https://proton.antelope.tools/nodes-distribution</loc>
       <lastmod>2023-09-07</lastmod>
    </url>
+   <url>
+      <loc>https://proton.antelope.tools/cpu-benchmark</loc>
+      <lastmod>2023-09-07</lastmod>
+   </url>
    <url>
       <loc>https://proton.antelope.tools/ricardian-contract</loc>
       <lastmod>2023-09-07</lastmod>

webapp/src/components/CopyToClipboard/index.js

@@ -9,7 +9,7 @@ import styles from './styles'
 
 const useStyles = makeStyles(styles)
 
-const CopyToClipboard = ({ text }) => {
+const CopyToClipboard = ({ text, helperText }) => {
   const classes = useStyles()
   const { t } = useTranslation('copyToClipboardComponent')
   const [status, setStatus] = useState('copyToClipboard')
@@ -21,17 +21,19 @@ const CopyToClipboard = ({ text }) => {
 
   return (
     <Tooltip
-      title={t(status)}
+      title={helperText ?? t(status)}
+      arrow
       onMouseLeave={() => {
         setStatus('copyToClipboard')
       }}
-      arrow
+      classes={{ popper: classes.tooltip }}
     >
       <Button
         size="small"
         variant="outlined"
         color="primary"
         onClick={copyText}
+        disabled={!text}
         className={classes.icon}
         startIcon={<FileCopyOutlinedIcon />}
       >

webapp/src/components/CopyToClipboard/styles.js

@@ -3,4 +3,11 @@ export default (theme) => ({
     alignSelf: 'center',
     marginBottom: `${theme.spacing(2)} !important`,
   },
+  tooltip: {
+    maxWidth: '150px',
+    textAlign: 'center',
+    '& .MuiTooltip-tooltip': {
+      fontSize: '0.8em !important',
+    },
+  },
 })

webapp/src/components/EndpointsTable/index.js

@@ -1,8 +1,7 @@
-import React, { useState } from 'react'
+import React from 'react'
 import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import { makeStyles } from '@mui/styles'
-import Button from '@mui/material/Button'
 import Table from '@mui/material/Table'
 import TableBody from '@mui/material/TableBody'
 import TableCell from '@mui/material/TableCell'
@@ -11,35 +10,22 @@ import TableHead from '@mui/material/TableHead'
 import TableRow from '@mui/material/TableRow'
 import Typography from '@mui/material/Typography'
 import { Tooltip as MUITooltip } from '@mui/material'
-import ListAltIcon from '@mui/icons-material/ListAlt'
 import { Link as RouterLink } from 'react-router-dom'
 import Link from '@mui/material/Link'
 import QueryStatsIcon from '@mui/icons-material/QueryStats'
 
+import CopyToClipboard from '../CopyToClipboard'
 import HealthCheck from '../HealthCheck'
-import HealthCheckInfo from 'components/HealthCheck/HealthCheckInfo'
+import HealthCheckInfo from '../HealthCheck/HealthCheckInfo'
 import { getStatus } from 'utils'
 
 import styles from './styles'
-import Tooltip from '../Tooltip'
-import EndpointsTextList from '../EndpointsTextList'
 
 const useStyles = makeStyles(styles)
 
-const EndpointsTable = ({ producers }) => {
+const EndpointsTable = ({ producers, textLists }) => {
   const classes = useStyles()
   const { t } = useTranslation('endpointsListRoute')
-  const [anchorEl, setAnchorEl] = useState(null)
-  const [type, setType] = useState('')
-
-  const handlePopoverOpen = (target, type) => {
-    setAnchorEl(target)
-    setType(type)
-  }
-
-  const handlePopoverClose = () => {
-    setAnchorEl(null)
-  }
 
   const CellList = ({ producer, endpointType }) => {
     return (
@@ -65,17 +51,6 @@ const EndpointsTable = ({ producers }) => {
 
   return (
     <>
-      <Tooltip
-        anchorEl={anchorEl}
-        open={anchorEl !== null}
-        onClose={handlePopoverClose}
-        anchorOrigin={{
-          vertical: 'top',
-          horizontal: 'left',
-        }}
-      >
-        <EndpointsTextList type={type} />
-      </Tooltip>
       <TableContainer>
         <Table>
           <TableHead>
@@ -84,49 +59,19 @@ const EndpointsTable = ({ producers }) => {
               <TableCell>
                 <div className={classes.titleCell}>
                   {t('api')}
-                  <Button
-                    size="small"
-                    variant="outlined"
-                    color="primary"
-                    startIcon={<ListAltIcon />}
-                    onClick={(e) => {
-                      handlePopoverOpen(e.target, 'api')
-                    }}
-                  >
-                    {t('showList')}
-                  </Button>
+                  <CopyToClipboard text={textLists?.api} helperText={t('copyToClipboard')} />
                 </div>
               </TableCell>
               <TableCell>
                 <div className={classes.titleCell}>
                   {t('ssl')}
-                  <Button
-                    size="small"
-                    variant="outlined"
-                    color="primary"
-                    startIcon={<ListAltIcon />}
-                    onClick={(e) => {
-                      handlePopoverOpen(e.target, 'ssl')
-                    }}
-                  >
-                    {t('showList')}
-                  </Button>
+                  <CopyToClipboard text={textLists?.ssl} helperText={t('copyToClipboard')} />
                 </div>
               </TableCell>
               <TableCell>
                 <div className={classes.titleCell}>
                   {t('p2p')}
-                  <Button
-                    size="small"
-                    variant="outlined"
-                    color="primary"
-                    startIcon={<ListAltIcon />}
-                    onClick={(e) => {
-                      handlePopoverOpen(e.target, 'p2p')
-                    }}
-                  >
-                    {t('showList')}
-                  </Button>
+                  <CopyToClipboard text={textLists?.p2p} helperText={t('copyToClipboard')} />
                 </div>
               </TableCell>
             </TableRow>
@@ -167,6 +112,7 @@ const EndpointsTable = ({ producers }) => {
 
 EndpointsTable.propTypes = {
   producers: PropTypes.array,
+  textLists: PropTypes.object,
 }
 
 export default EndpointsTable

webapp/src/components/EndpointsTable/styles.js

@@ -18,7 +18,7 @@ export default (theme) => ({
     alignItems: 'center',
     '& .MuiButton-root': {
       alignSelf: 'center',
-      marginLeft: theme.spacing(2),
+      margin: `${theme.spacing(0, 0, 0, 2)} !important`,
     }
   },
 })

webapp/src/components/HealthCheck/HealthCheckInfo.js

@@ -16,11 +16,11 @@ const HealthCheckInfo = ({ healthCheck }) => {
       </Typography>
       {healthCheck.head_block_time && healthCheck.response?.status === 200 && (
         <>
-          <Typography>{t('headBlockTime')}</Typography>
+          <Typography>{t('headBlockTime')}:</Typography>
           {moment(healthCheck.head_block_time).format('lll') || 'N/A'}
         </>
       )}
-      <Typography>{t('updatedAt')}</Typography>
+      <Typography>{t('updatedAt')}:</Typography>
       {moment(healthCheck.updated_at).format('lll') || 'N/A'}
     </>
   )

webapp/src/components/NodeCard/EndpointsChips.js

@@ -63,11 +63,11 @@ const EndpointsChips = ({ node }) => {
           <span>{`${workingEndpoints}/${totalEndpoints}`}</span>
         )}
         <HealthCheck status={healthStatus}>
-          <Typography>{t('status')}</Typography>
+          <Typography>{t('status')}:</Typography>
           <Typography>
             {getStatusMessage(healthStatus, failingEndpoints)}
           </Typography>
-          <Typography>{t('updatedAt')}</Typography>
+          <Typography>{t('updatedAt')}:</Typography>
           {moment(updatedAt).format('lll') || 'N/A'}
         </HealthCheck>
       </div>

webapp/src/gql/producer.gql.js

@@ -38,6 +38,19 @@ export const PRODUCERS_QUERY = gql`
     }
   }
 `
+
+export const PRODUCERS_COUNT_QUERY = gql`
+  query producer(
+    $where: producer_bool_exp
+  ) {
+    info: producer_aggregate(where: $where) {
+      producers: aggregate {
+        count
+      }
+    }
+  }
+`
+
 export const NODES_SUBSCRIPTION = gql`
   subscription ($offset: Int = 0, $limit: Int = 21, $where: producer_bool_exp) {
     producers: producer(

webapp/src/hooks/customHooks/useBlockProducerState.js

@@ -26,15 +26,26 @@ const CHIPS_FILTERS = [
 const CHIPS_NAMES = ['all', ...eosConfig.producerTypes]
 
 const useBlockProducerState = () => {
-  const [
-    { filters, pagination, producers },
-    { handleOnSearch, handleOnPageChange, setPagination },
-  ] = useSearchState({ query: PRODUCERS_QUERY })
+  const defaultVariables = {
+    limit: 20,
+    offset: 0,
+    endpointFilter: undefined,
+    where: {
+      owner: { _like: '%%' },
+      nodes: { endpoints: { value: { _gt: '' } } },
+    }
+  }
+  const [variables, setVariables] = useState(defaultVariables)
+  const [loadProducers, { data: { info, producers } = {} }] = useLazyQuery(PRODUCERS_QUERY, { variables })
   const { data: dataHistory } = useSubscription(MISSED_BLOCKS_SUBSCRIPTION)
   const [loadStats, { loading = true, data: { eosrate_stats: stats } = {} }] =
     useLazyQuery(EOSRATE_STATS_QUERY)
   const [items, setItems] = useState([])
   const [missedBlocks, setMissedBlocks] = useState({})
+  const [
+    { filters, pagination },
+    { handleOnSearch, handleOnPageChange, setPagination },
+  ] = useSearchState({ loadProducers, info, variables, setVariables })
 
   useEffect(() => {
     loadStats({})