Merge pull request #278 from edenia/dev

Production Release

public/locales/cn/common.json

@@ -11,6 +11,10 @@
   "searchName": "按名称搜索",
   "buttonLabel": "委托票权",
   "buttonLabelDelegate": "委托",
+  "days": "days",
+  "hrs": "hrs",
+  "mins": "mins",
+  "secs": "secs",
   "routes": {
     "/": "主页",
     "voters": "投票成员",
@@ -142,13 +146,15 @@
     "yourRewards": "Your Rewards",
     "legend": "The reward isn't activated now. If you want to urge BPs to activate direct inflation reward, please indicate how much inflation should be dedicated system-wide none-vote-buy reward. Choose: 0%, 0.25%, 0.5%, 0.75%, 1%.",
     "delegateVoteMessage": "Vote Delegaded Successfully",
+    "undelegateVoteMessage": "Vote Undelegaded Successfully",
     "somethingWrong": "Something went wrong, try again.",
     "claimMessage": "Reward Claimed",
     "recipientMessage": "Recipient Changed",
     "account": "Account",
     "active": "Active",
-    "undelegate": "Undelegate",
+    "undelegated": "Undelegate",
     "signupMessage": "Your account needs one more step to access this page, please click on the validate button to continue.",
-    "distributionLabel": "Estimated time to next distribution"
+    "distributionLabel": "Estimated time to next distribution",
+    "close": "Close"
   }
 }

public/locales/en/common.json

@@ -11,6 +11,10 @@
   "searchName": "Search by name",
   "buttonLabel": "Delegate Vote",
   "buttonLabelDelegate": "Delegate",
+  "days": "days",
+  "hrs": "hrs",
+  "mins": "mins",
+  "secs": "secs",
   "routes": {
     "/": "Home",
     "voters": "Members",
@@ -142,13 +146,15 @@
     "yourRewards": "Your Rewards",
     "legend": "The reward isn't activated now. If you want to urge BPs to activate direct inflation reward, please indicate how much inflation should be dedicated system-wide none-vote-buy reward. Choose: 0%, 0.25%, 0.5%, 0.75%, 1%.",
     "delegateVoteMessage": "Vote Delegaded Successfully",
+    "undelegateVoteMessage": "Vote Undelegaded Successfully",
     "somethingWrong": "Something went wrong, try again.",
     "claimMessage": "Reward Claimed",
     "recipientMessage": "Recipient Changed",
     "account": "Account",
     "active": "Active",
-    "undelegate": "Undelegate",
+    "undelegated": "Undelegate",
     "signupMessage": "Your account needs one more step to access this page, please click on the validate button to continue.",
-    "distributionLabel": "Estimated time to next distribution"
+    "distributionLabel": "Estimated time to next distribution",
+    "close": "Close"
   }
 }

public/locales/es/common.json

@@ -11,6 +11,10 @@
   "searchName": "Buscar por nombre",
   "buttonLabel": "Delegar voto",
   "buttonLabelDelegate": "Delegar",
+  "days": "días",
+  "hrs": "hrs",
+  "mins": "mins",
+  "secs": "segs",
   "routes": {
     "/": "Hogar",
     "voters": "Miembros",
@@ -142,13 +146,15 @@
     "yourRewards": "Tus recompensas",
     "legend": "La recompensa no está activada ahora. Si desea instar a los BP a activar la recompensa de inflación directa, indique cuánta inflación debe dedicarse a la recompensa de compra sin voto en todo el sistema. Elija: 0%, 0.25% , 0,5%, 0,75%, 1%.",
     "delegateVoteMessage": "Voto Delegado Exitosamente",
+    "undelegateVoteMessage": "Voto sin Delegar Exitosamente",
     "somethingWrong": "Algo salió mal, inténtalo de nuevo",
     "claimMessage": "Recompensa Reclamada",
     "recipientMessage": "Destinatario cambiado",
     "account": "Cuenta",
     "active": "Activo",
-    "undelegado": "Anular el delegado",
+    "undelegated": "Anular el delegado",
     "signupMessage": "Tu cuenta necesita un paso más para poder acceder a esta página, por favor has click en en boton de validar para poder continuar.",
-    "distributionLabel": "tiempo estimado para la siguiente distribución"
+    "distributionLabel": "tiempo estimado para la siguiente distribución",
+    "close": "Cerrar"
   }
 }

public/locales/ko/common.json

@@ -11,6 +11,10 @@
   "searchName": "이름으로 찾기",
   "buttonLabel": "투표 위임",
   "buttonLabelDelegate": "투표",
+  "days": "days",
+  "hrs": "hrs",
+  "mins": "mins",
+  "secs": "secs",
   "routes": {
     "/": "메인",
     "voters": "투표자 조회",
@@ -143,13 +147,15 @@
     "yourRewards": "Your Rewards",
     "legend": "The reward isn't activated now. If you want to urge BPs to activate direct inflation reward, please indicate how much inflation should be dedicated system-wide none-vote-buy reward. Choose: 0%, 0.25%, 0.5%, 0.75%, 1%.",
     "delegateVoteMessage": "Vote Delegaded Successfully",
+    "undelegateVoteMessage": "Vote Undelegaded Successfully",
     "somethingWrong": "Something went wrong, try again.",
     "claimMessage": "Reward Claimed",
     "recipientMessage": "Recipient Changed",
     "account": "Account",
     "active": "Active",
-    "undelegate": "Undelegate",
+    "undelegated": "Undelegate",
     "signupMessage": "Your account needs one more step to access this page, please click on the validate button to continue.",
-    "distributionLabel": "Estimated time to next distribution"
+    "distributionLabel": "Estimated time to next distribution",
+    "close": "Close"
   }
 }

src/components/AuthUAL/index.tsx

@@ -1,6 +1,6 @@
-import { Button, Spinner } from '@edenia/ui-kit'
+import { Button } from '@edenia/ui-kit'
 import { useTranslation } from 'next-i18next'
-import { useState, useEffect } from 'react'
+import { useEffect } from 'react'
 
 import useAuthUAL from './useAuthUAL.hook'
 import useStyles from './styles'
@@ -10,19 +10,16 @@ const AuthButton: React.FC<{
   setMessage(value: any): void
 }> = ({ btnLabel, setMessage }) => {
   const [{ state }, { login }] = useAuthUAL()
-  const [loader, setLoader] = useState<boolean>(false)
   const { t } = useTranslation()
   const classes = useStyles()
 
   const handleLogin = async () => {
-    setLoader(true)
     await login('anchor')
   }
 
   useEffect(() => {
     if (state?.validUser === undefined || state?.validUser) return
 
-    setLoader(false)
     setMessage({
       severity: 'warning',
       message: t('home.noEdenMember'),
@@ -35,8 +32,6 @@ const AuthButton: React.FC<{
       {!state?.ual?.activeUser && (
         <Button onClick={handleLogin} label={btnLabel} variant='primary' />
       )}
-      <p />
-      {loader && <Spinner />}
     </div>
   )
 }

src/components/CountdownTimer/index.tsx

@@ -1,23 +1,51 @@
 import React from 'react'
+import { useTranslation } from 'next-i18next'
 import { Box } from '@mui/material'
 
 import useCountdown from 'hooks/useCountdown'
 import { PopoverMessage } from 'components'
 
+import useStyle from './styles'
+
 const CountdownTimer = ({
   date,
-  style,
   distributionLabel
 }: {
   date: number
-  style: string
+  style?: string
   distributionLabel: string
 }): JSX.Element => {
   const [days, hours, minutes, seconds] = useCountdown(date)
+  const { t } = useTranslation()
+  const classes = useStyle()
 
   return (
-    <Box display='flex' alignItems='center'>
-      <span className={style}>{`${days}:${hours}:${minutes}:${seconds} `}</span>
+    <Box className={classes.countdownContainer}>
+      {!!days && (
+        <>
+          <Box className={classes.timeItemBox}>
+            <span className={classes.items}>{days}</span>
+            <span className={classes.labels}>{t('days')}</span>
+          </Box>
+          <span className={classes.separator}>:</span>
+        </>
+      )}
+      <Box className={classes.timeItemBox}>
+        <span className={classes.items}>{hours}</span>
+        <span className={classes.labels}>{t('hrs')}</span>
+      </Box>
+      <span className={classes.separator}>:</span>
+
+      <Box className={classes.timeItemBox}>
+        <span className={classes.items}>{minutes}</span>
+        <span className={classes.labels}>{t('mins')}</span>
+      </Box>
+      <span className={classes.separator}>:</span>
+
+      <Box className={classes.timeItemBox}>
+        <span className={classes.items}>{seconds}</span>
+        <span className={classes.labels}>{t('secs')}</span>
+      </Box>
       <PopoverMessage message={distributionLabel} />
     </Box>
   )

src/components/CountdownTimer/styles.ts

@@ -0,0 +1,24 @@
+import { makeStyles } from '@mui/styles'
+
+const useStyle = makeStyles(theme => ({
+  timeItemBox: {
+    display: 'flex',
+    alignItems: 'center',
+    flexDirection: 'column'
+  },
+  countdownContainer: {
+    display: 'flex',
+    alignItems: 'center',
+    margin: `0 ${theme.spacing(1)}`
+  },
+  items: { fontSize: 17, lineHeight: 'initial', marginTop: '7px' },
+  separator: { fontSize: 17, lineHeight: 'initial', margin: '0 2px' },
+  labels: {
+    fontSize: 9,
+    textTransform: 'lowercase',
+    marginTop: '-3px',
+    lineHeight: 'initial'
+  }
+}))
+
+export default useStyle

src/components/Sidebar/index.tsx

@@ -1,5 +1,4 @@
 import React, { memo, useEffect, useState, useRef, useCallback } from 'react'
-import Image from 'next/image'
 import {
   Drawer,
   DrawerProps,
@@ -231,6 +230,9 @@ const Sidebar: React.FC<SidebarType> = ({ onClose, props }) => {
                 placement='bottom-start'
                 transition
                 disablePortal
+                nonce={undefined}
+                onResize={undefined}
+                onResizeCapture={undefined}
               >
                 {({ TransitionProps, placement }) => (
                   <Grow

src/hooks/useCountdown/index.ts

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react'
 
 const getReturnValues = countDown => {
-  if (countDown < 0) return [0, 0, 0, 0]
+  if (countDown < 0) return [0, '00', '00', '00']
 
   const days = Math.floor(countDown / (1000 * 60 * 60 * 24))
   const hours = Math.floor(
@@ -10,10 +10,15 @@ const getReturnValues = countDown => {
   const minutes = Math.floor((countDown % (1000 * 60 * 60)) / (1000 * 60))
   const seconds = Math.floor((countDown % (1000 * 60)) / 1000)
 
-  return [days, hours, minutes, seconds]
+  return [
+    days,
+    hours < 10 ? `0${hours}` : hours,
+    minutes < 10 ? `0${minutes}` : minutes,
+    seconds < 10 ? `0${seconds}` : seconds
+  ]
 }
 
-const useCountdown = (targetDate: number): Array<number> => {
+const useCountdown = (targetDate: number): Array<number | string> => {
   const countDownDate = new Date(targetDate).getTime()
   const [countDown, setCountDown] = useState(
     countDownDate - new Date().getTime()

src/hooks/useUAL/index.tsx

@@ -22,21 +22,25 @@ const useLightUAL = ({ appName, chains, authenticators }: UALType) => {
   const [loading, setLoading] = useState(false)
 
   const login = (type: string) => {
-    const ual = new UAL(chains, appName, authenticators)
-    const { availableAuthenticators } = ual.getAuthenticators()
-
-    const authenticator = getAuthenticatorInstance(
-      type,
-      availableAuthenticators
-    )
-
-    setLoading(true)
-    authenticateWithoutAccountInput({
-      ual,
-      appName,
-      availableAuthenticators,
-      authenticator
-    })
+    try {
+      const ual = new UAL(chains, appName, authenticators)
+      const { availableAuthenticators } = ual.getAuthenticators()
+
+      const authenticator = getAuthenticatorInstance(
+        type,
+        availableAuthenticators
+      )
+
+      setLoading(true)
+      authenticateWithoutAccountInput({
+        ual,
+        appName,
+        availableAuthenticators,
+        authenticator
+      })
+    } catch (error) {
+      console.log('error from login', error)
+    }
   }
 
   const restart = () => {
@@ -167,6 +171,7 @@ const useLightUAL = ({ appName, chains, authenticators }: UALType) => {
         })
         setLoading(false)
       } catch (err) {
+        console.log('error from authenticateWithoutAccountInput')
         setLoading(false)
       }
     },