Merge pull request #1191 from edenia/dev

Production release
edenia · May 18, 2023 · d3d2e77 · d3d2e77
2 parents c57e31c + 9a19428
commit d3d2e77
Show file tree

Hide file tree

Showing 43 changed files with 330 additions and 186 deletions.
diff --git a/hapi/src/services/cpu.service.js b/hapi/src/services/cpu.service.js
@@ -22,6 +22,22 @@ const saveBenchmark = async payload => {
   return data.insert_cpu_one
 }
 
+const cleanOldBenchmarks = async () => {
+  const date = new Date()
+
+  date.setFullYear(date.getFullYear() - 1)
+
+  const mutation = `
+    mutation ($date: timestamptz) {
+      delete_cpu (where: {created_at: {_lt: $date}}) {
+        affected_rows
+      }
+    }
+  `
+
+  await hasuraUtil.request(mutation, { date })
+}
+
 const worker = async () => {
   if (!eosConfig.eosmechanics.account || !eosConfig.eosmechanics.password) {
     return
@@ -69,5 +85,6 @@ const getBenchmark = async (range = '3 Hours') => {
 
 module.exports = {
   worker,
-  getBenchmark
+  getBenchmark,
+  cleanOldBenchmarks
 }
diff --git a/hapi/src/workers/producers.worker.js b/hapi/src/workers/producers.worker.js
@@ -62,6 +62,7 @@ const start = async () => {
 
   if (eosConfig.eosmechanics.account && eosConfig.eosmechanics.password) {
     run('CPU WORKER', cpuService.worker, workersConfig.cpuWorkerInterval)
+    run('CPU WORKER CLEANUP', cpuService.cleanOldBenchmarks, 86400)
   }
 
   if (eosConfig.stateHistoryPluginEndpoint) {

diff --git a/webapp/src/components/Header/AuthButton.js b/webapp/src/components/Header/AuthButton.js
@@ -2,13 +2,22 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import { Menu, Button } from '@mui/material'
 import { useTranslation } from 'react-i18next'
+import Typography from '@mui/material/Typography'
 import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight'
 import AccountIcon from '@mui/icons-material/AccountCircle'
-import FingerprintIcon from '@mui/icons-material/Fingerprint'
+import AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'
 import ExitIcon from '@mui/icons-material/ExitToApp'
 
 import useAuthBottonState from './useAuthBottonState'
 
+const LogOutButton = ({ handleSignOut, classes }) => {
+  return (
+    <div className={classes.logoutContainer}>
+      <ExitIcon onClick={handleSignOut} className={classes.loginBtn} />
+    </div>
+  )
+}
+
 const AuthButton = ({ classes }) => {
   const { t } = useTranslation()
   const [{ state }, { handleCloseMenu, handleSignOut, login }] =
@@ -17,28 +26,34 @@ const AuthButton = ({ classes }) => {
   return (
     <React.Fragment>
       <div className={classes.authBox}>
-        {state?.ual?.activeUser ? (
-          <>
-            <Button className={classes.userBtn} startIcon={<AccountIcon />}>
-              {state?.ual?.accountName || ''}
-            </Button>
+        <div className={classes.accountContainer}>
+          {state?.ual?.activeUser ? (
+            <>
+              <AccountIcon className={classes.userBtn} />
+              <Typography component="span" variant="h5">
+                {state?.ual?.accountName || ''}
+              </Typography>
+            </>
+          ) : (
             <Button
-              startIcon={<ExitIcon />}
-              onClick={handleSignOut}
-              className={classes.loginBtn}
+              onClick={() => login('anchor')}
+              className={`${classes.loginBtn} ${classes.connectWalletBtn}`}
             >
-              {t('logout')}
+              <AccountBalanceWalletIcon />
+              <Typography component="span" variant="h5">
+                {t('connectWallet')}
+              </Typography>
             </Button>
-          </>
-        ) : (
-          <Button
-            onClick={() => login('anchor')}
-            className={classes.loginBtn}
-            startIcon={<FingerprintIcon />}
-          >
-            {t('login')}
-          </Button>
-        )}
+          )}
+        </div>
+        <LogOutButton
+          handleSignOut={() => {
+            if (state?.ual?.activeUser) {
+              handleSignOut()
+            }
+          }}
+          classes={classes}
+        />
       </div>
       <Menu
         className={classes.menuBox}

diff --git a/webapp/src/components/Header/index.js b/webapp/src/components/Header/index.js
@@ -66,19 +66,22 @@ const LanguageMenu = () => {
   }, [i18n.language])
 
   return (
-    <>
+    <Hidden smDown implementation="css">
       <Button
         startIcon={<LanguageIcon />}
         onClick={toggleMenu}
         className={classes.btnLanguage}
       >
-        {currentLanguaje.toUpperCase()}
+        <span>
+          {currentLanguaje.toUpperCase()}
+        </span>
       </Button>
       <Menu
         id="menu-appbar"
         anchorEl={anchorMenu}
         open={Boolean(anchorMenu)}
         onClose={closeMenu}
+        className={classes.cardShadow}
       >
         {languages.map((language) => (
           <MenuItem
@@ -89,7 +92,7 @@ const LanguageMenu = () => {
           </MenuItem>
         ))}
       </Menu>
-    </>
+    </Hidden>
   )
 }
 

diff --git a/webapp/src/components/Header/styles.js b/webapp/src/components/Header/styles.js
@@ -8,13 +8,24 @@ export default (theme) => ({
   },
   btnLanguage: {
     fontWeight: '600 !important',
+    [theme.breakpoints.down('sm')]: {
+      minWidth: 'auto !important',
+      width: '36px',
+      '& .MuiButton-startIcon': {
+        margin: '0 !important',
+      },
+    },
   },
   imgHeaderLogo: {
     width: '145px',
-    marginTop: '8px',
+    marginTop: theme.spacing(2),
+    [theme.breakpoints.down('sm')]: {
+      width: '70%',
+      marginLeft: theme.spacing(2.5),
+    },
   },
   appBar: {
-    backgroundColor: '#fff !important',
+    backgroundColor: `${theme.palette.common.white} !important`,
     color: theme.header.color,
     boxShadow: '0px 1px 3px 1px rgba(0, 0, 0, 0.15) !important',
     height: '100%',
@@ -29,9 +40,36 @@ export default (theme) => ({
   userBox: {
     display: 'flex',
     alignItems: 'center',
+    gap: theme.spacing(2),
     '& button': {
       color: '#757575',
     },
+    [theme.breakpoints.down('sm')]: {
+      maxWidth: '250px',
+      gap: 0,
+      justifyContent: 'end',
+    },
+  },
+  accountContainer: {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    fontWeight: 'bold',
+    fontStyle: 'normal',
+    lineHeight: `${theme.spacing(2)} !important`,
+    textAlign: 'center',
+    letterSpacing: '1px !important',
+    padding: theme.spacing(0, 2, 0),
+    [theme.breakpoints.down('sm')]: {
+      padding: '0 4px 0',
+    },
+    '& span': {
+      paddingLeft: theme.spacing(1),
+      fontSize: '1rem',
+      [theme.breakpoints.down('sm')]: {
+        fontSize: '14px',
+      },
+    },
   },
   iconsHeader: {
     display: 'flex',
@@ -67,13 +105,25 @@ export default (theme) => ({
     },
   },
   loginBtn: {
-    fontStyle: 'normal',
-    lineHeight: '16px !important',
+    color: `${theme.palette.common.white} !important`,
+    cursor: 'pointer',
+  },
+  connectWalletBtn: {
+    [theme.breakpoints.down('sm')]: {
+      padding: `${theme.spacing(2, 1, 2, 1)} !important`,
+    },
+  },
+  logoutContainer: {
+    display: 'flex',
     alignItems: 'center',
     textAlign: 'center',
-    letterSpacing: '1px !important',
-    textTransform: 'capitalize !important',
-    fontWeight: '600 !important',
+    padding: theme.spacing(2),
+    border: `0 solid ${theme.palette.common.white}`,
+    borderLeft: `0.8px solid ${theme.palette.common.white}`,
+    background: 'transparent',
+    [theme.breakpoints.down('sm')]: {
+      padding: theme.spacing(2, 1, 2, 1),
+    },
   },
   userBtn: {
     textTransform: 'lowercase !important',
@@ -85,5 +135,20 @@ export default (theme) => ({
       marginRight: theme.spacing(1),
     },
   },
-  authBox: { display: 'flex', alignItems: 'center', textAlign: 'center' },
+  authBox: {
+    display: 'flex',
+    alignItems: 'center',
+    textAlign: 'center',
+    background: '#1675CA',
+    borderRadius: '10px',
+    transition: 'ease-in-out all 0.5s',
+    '&:hover': {
+      boxShadow: '0px 0px 3px 3px #1675CA',
+    },
+  },
+  cardShadow: {
+    '& .MuiPaper-root': {
+      boxShadow: '0px 1px 5px rgba(0, 0, 0, 0.15) !important',
+    },
+  },
 })
diff --git a/webapp/src/components/Header/useAuthBottonState.js b/webapp/src/components/Header/useAuthBottonState.js
@@ -1,15 +1,16 @@
-import { useNavigate } from 'react-router-dom'
+import { useNavigate, useLocation } from 'react-router-dom'
 
 import { useSharedState } from '../../context/state.context'
 
 const useAuthBottonState = () => {
   const [state, { login, logout, handleOpenMenu, handleCloseMenu }] =
     useSharedState()
   const navigate = useNavigate()
+  const location = useLocation()
 
   const handleSignOut = () => {
     logout()
-    navigate('/')
+    navigate(location.pathname)
   }
 
   return [{ state }, { handleOpenMenu, handleCloseMenu, handleSignOut, login }]

diff --git a/webapp/src/components/Sidebar/index.js b/webapp/src/components/Sidebar/index.js
@@ -3,19 +3,22 @@ import PropTypes from 'prop-types'
 import {
   Collapse,
   Drawer as MuiDrawer,
+  Hidden,
   List as MuiList,
   ListItem as MuiListItem,
   Typography,
   IconButton,
   Tooltip,
 } from '@mui/material'
 import MenuIcon from '@mui/icons-material/Menu'
+import LanguageIcon from '@mui/icons-material/Language'
 import { makeStyles } from '@mui/styles'
 import { rgba } from 'polished'
 import { useLocation } from 'react-router-dom'
 import { useTranslation } from 'react-i18next'
 import PerfectScrollbar from 'react-perfect-scrollbar'
 import 'react-perfect-scrollbar/dist/css/styles.css'
+import moment from 'moment'
 
 import routes from '../../routes'
 
@@ -51,6 +54,7 @@ const Sidebar = ({ classes, staticContext, onDrawerToggle, ...rest }) => {
   }
 
   const [openRoutes, setOpenRoutes] = useState(() => initOpenRoutes())
+  const { i18n } = useTranslation('translations')
 
   const toggle = (index) => {
     // Collapse all elements
@@ -68,6 +72,31 @@ const Sidebar = ({ classes, staticContext, onDrawerToggle, ...rest }) => {
     )
   }
 
+  const LanguageSelector = () => {
+    return (
+      <>
+        <MuiListItem className={classesStyle.listItem}>
+          <Typography className={classesStyle.sidebarSection}>
+            {t('options')}
+          </Typography>
+          <SidebarCategory
+            isCollapsable={false}
+            name={t('setLanguage>sidebar')}
+            icon={<LanguageIcon />}
+            activeclassname="active"
+            showOnlyIcons={!rest.open}
+            classes={classesStyle}
+            onClick={() => {
+              moment.locale(i18n.language === 'es' ? 'en' : 'es')
+              i18n.changeLanguage(i18n.language === 'es' ? 'en' : 'es')
+            }}
+          />
+        </MuiListItem>
+        <div className={classesStyle.divider} />
+      </>
+    )
+  }
+
   return (
     <MuiDrawer
       variant="permanent"
@@ -177,6 +206,9 @@ const Sidebar = ({ classes, staticContext, onDrawerToggle, ...rest }) => {
               </Tooltip>
             ))}
           <div className={classesStyle.divider} />
+          <Hidden smUp>
+            <LanguageSelector />
+          </Hidden>
         </MuiList>
       </PerfectScrollbar>
     </MuiDrawer>

diff --git a/webapp/src/components/Sidebar/styles.js b/webapp/src/components/Sidebar/styles.js
@@ -25,6 +25,7 @@ export default (theme, rgba) => ({
     flexDirection: 'column !important',
     alignItems: 'start !important',
     justifyContent: 'center !important',
+    cursor: 'pointer'
   },
   brand: {
     fontSize: theme.typography.h5.fontSize,