💄 MaturityPool: move totals to tooltip and rearrange columns

exactly · May 21, 2024 · fb4b36c · fb4b36c
1 parent f722000
commit fb4b36c
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 16 deletions.
diff --git a/components/asset/MaturityPool/MaturityPoolsTable/index.tsx b/components/asset/MaturityPool/MaturityPoolsTable/index.tsx
@@ -50,12 +50,11 @@ const MaturityPoolsTable: FC<MaturityPoolsTableProps> = ({ symbol }) => {
               title={t('Maturity')}
               tooltipTitle={t('All fixed pools are due at {{hour}}.', { hour: getHourUTC2Local() })}
             />
-            <HeadCell title={t('Deposits')} />
-            <HeadCell title={t('Borrows')} />
             <HeadCell
               title={t('Deposit APR')}
               tooltipTitle={t('The fixed interest APR for a deposit up to the optimal deposit size.')}
             />
+            <TableCell />
             <HeadCell
               title={t('Borrow APR')}
               tooltipTitle={t('The fixed borrowing interest APR at current utilization level.')}
@@ -75,19 +74,17 @@ const MaturityPoolsTable: FC<MaturityPoolsTableProps> = ({ symbol }) => {
               <TableCell component="th" scope="row" width={120} sx={{ pl: 1.5 }}>
                 {parseTimestamp(maturity, "MMM DD, 'YY")}
               </TableCell>
-              <TableCell align="left" width={80}>
-                ${totalDeposited}
-              </TableCell>
-              <TableCell align="left" width={75}>
-                ${totalBorrowed}
-              </TableCell>
-              <TableCell align="left" width={65}>
-                {toPercentage(depositAPR > minAPRValue ? depositAPR : undefined)}
-              </TableCell>
-              <TableCell align="left" width={50}>
-                {toPercentage(borrowAPR > minAPRValue ? borrowAPR : undefined)}
+              <TableCell>
+                <Tooltip
+                  title={`${t('Total deposited: ')}${totalDeposited}`}
+                  sx={{ display: 'flex', flexDirection: 'row', gap: 1 }}
+                  placement="top"
+                  arrow
+                >
+                  <Typography>{toPercentage(depositAPR > minAPRValue ? depositAPR : undefined)}</Typography>
+                </Tooltip>
               </TableCell>
-              <TableCell align="right" size="small" sx={{ cursor: 'default' }}>
+              <TableCell>
                 <Button
                   data-testid={`fixed-${maturity}-deposit-${symbol}`}
                   disabled={depositAPR < minAPRValue}
@@ -105,6 +102,18 @@ const MaturityPoolsTable: FC<MaturityPoolsTableProps> = ({ symbol }) => {
                 >
                   {t('Deposit')}
                 </Button>
+              </TableCell>
+              <TableCell>
+                <Tooltip
+                  title={`${t('Total borrowed: ')}${totalBorrowed}`}
+                  sx={{ display: 'flex', flexDirection: 'row', gap: 1 }}
+                  placement="top"
+                  arrow
+                >
+                  <Typography>{toPercentage(borrowAPR > minAPRValue ? borrowAPR : undefined)}</Typography>
+                </Tooltip>
+              </TableCell>
+              <TableCell size="small" sx={{ cursor: 'default' }}>
                 <Button
                   data-testid={`fixed-${maturity}-borrow-${symbol}`}
                   disabled={borrowAPR < minAPRValue}

diff --git a/i18n/es/translation.json b/i18n/es/translation.json
@@ -73,7 +73,6 @@
   "Amount of tokens {{action}} in the pool": "Monto de tokens {{action}} en el pool",
   "Value": "Valor",
   "Collateral": "Colateral",
-  "You are connected to a different network": "Estás conectado a una red diferente",
   "You can't disable collateral on this asset because you have an active borrow": "No puedes deshabilitar el colateral en este activo porque tienes un préstamo pendiente",
   "Disabling this collateral will make your health factor less than 1": "Desactivar este colateral hara que su factor de salud sea menor a 1",
   "Disabling this asset as collateral affects your borrowing power and Health Factor": "Desactivar este activo como colateral afectará su poder de prestamo y factor de salud",
@@ -633,5 +632,7 @@
   "Repay Amount": "Monto a Pagar",
   "Join the waitlist": "Únete a la lista de espera",
   "The first onchain debit & credit card.": "La primer tarjeta de débito y crédito onchain.",
-  "Please set this asset as collateral in your dashboard": "Por favor, establece este activo como colateral en tu panel de control"
+  "Please set this asset as collateral in your dashboard": "Por favor, establece este activo como colateral en tu panel de control",
+  "Total deposited: ": "Total depositado",
+  "Total borrowed: ": "Total prestado"
 }