From 99cfdab6013a8945ae06f55f4ba9552bbc3e27e7 Mon Sep 17 00:00:00 2001
From: Gala <calero.vg@gmail.com>
Date: Mon, 10 Oct 2022 11:48:22 +0200
Subject: [PATCH] using Consoles and some refactor

---
 .../settings-pages/general-settings/InfoSettings.tsx |  9 +++++----
 .../general-settings/ParametersSettings.tsx          | 12 ++++++++----
 nym-wallet/src/pages/terminal/index.tsx              |  4 ++--
 3 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx
index b2c2473e99..fedc986d8c 100644
--- a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx
+++ b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/InfoSettings.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
-import { Button, Divider, Typography, TextField, Grid, Alert, IconButton, CircularProgress } from '@mui/material';
+import { Button, Divider, Typography, TextField, Grid, Alert, IconButton, CircularProgress, Box } from '@mui/material';
 import { useTheme } from '@mui/material/styles';
 import CloseIcon from '@mui/icons-material/Close';
 import { isMixnode } from 'src/types';
@@ -9,6 +9,7 @@ import { updateMixnodeConfig } from 'src/requests';
 import { TBondedMixnode, TBondedGateway } from 'src/context/bonding';
 import { SimpleModal } from 'src/components/Modals/SimpleModal';
 import { bondedInfoParametersValidationSchema } from 'src/components/Bonding/forms/mixnodeValidationSchema';
+import { Console } from 'src/utils/console';
 
 export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBondedGateway }) => {
   const [open, setOpen] = useState(true);
@@ -46,7 +47,7 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon
         await updateMixnodeConfig(MixNodeConfigParams);
         setOpenConfirmationModal(true);
       } catch (error) {
-        console.error(error);
+        Console.error(error);
       }
     }
   };
@@ -76,8 +77,8 @@ export const InfoSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBon
             '& .MuiAlert-icon': { color: (theme) => theme.palette.nym.nymWallet.text.blue, mr: 1 },
           }}
         >
-          <strong>Your changes will be ONLY saved on the display.</strong> Remember to change the values on your node’s
-          config file too.
+          <Box sx={{ fontWeight: 600 }}>Your changes will be ONLY saved on the display.</Box> Remember to change the
+          values on your node’s config file too.
         </Alert>
       )}
       <Grid container>
diff --git a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx
index 8e80368ff1..c0c7ebff6c 100644
--- a/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx
+++ b/nym-wallet/src/pages/bonding/node-settings/settings-pages/general-settings/ParametersSettings.tsx
@@ -11,6 +11,7 @@ import {
   Alert,
   IconButton,
   CircularProgress,
+  Box,
 } from '@mui/material';
 import { useTheme } from '@mui/material/styles';
 import CloseIcon from '@mui/icons-material/Close';
@@ -19,6 +20,7 @@ import { updateMixnodeCostParams } from 'src/requests';
 import { TBondedMixnode, TBondedGateway } from 'src/context/bonding';
 import { SimpleModal } from 'src/components/Modals/SimpleModal';
 import { bondedNodeParametersValidationSchema } from 'src/components/Bonding/forms/mixnodeValidationSchema';
+import { Console } from 'src/utils/console';
 
 export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode | TBondedGateway }): JSX.Element => {
   const [open, setOpen] = useState(true);
@@ -54,7 +56,7 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode
         await updateMixnodeCostParams(MixNodeCostParams);
         setOpenConfirmationModal(true);
       } catch (error) {
-        console.error(error);
+        Console.error(error);
       }
     }
   };
@@ -85,7 +87,9 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode
             '& .MuiAlert-icon': { color: (theme) => theme.palette.nym.nymWallet.text.blue, mr: 1 },
           }}
         >
-          <strong>Profit margin can be changed once a month, your changes will be applied in the next interval</strong>
+          <Box sx={{ fontWeight: 600 }}>
+            Profit margin can be changed once a month, your changes will be applied in the next interval
+          </Box>
         </Alert>
       )}
       <Grid container direction="column">
@@ -118,7 +122,7 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode
                   InputProps={{
                     endAdornment: (
                       <InputAdornment position="end">
-                        <span>%</span>
+                        <Box>%</Box>
                       </InputAdornment>
                     ),
                   }}
@@ -156,7 +160,7 @@ export const ParametersSettings = ({ bondedNode }: { bondedNode: TBondedMixnode
                 InputProps={{
                   endAdornment: (
                     <InputAdornment position="end">
-                      <span>{bondedNode.bond.denom.toUpperCase()}</span>
+                      <Box>{bondedNode.bond.denom.toUpperCase()}</Box>
                     </InputAdornment>
                   ),
                 }}
diff --git a/nym-wallet/src/pages/terminal/index.tsx b/nym-wallet/src/pages/terminal/index.tsx
index 2fbb609c23..3bd322318e 100644
--- a/nym-wallet/src/pages/terminal/index.tsx
+++ b/nym-wallet/src/pages/terminal/index.tsx
@@ -110,11 +110,11 @@ const TerminalInner: React.FC = () => {
 
         {status ? (
           <Alert color="info" icon={<RefreshIcon />} sx={{ mb: 2 }}>
-            <strong>{status}</strong>
+            <Box sx={{ fontWeight: 600 }}>{status}</Box>
           </Alert>
         ) : (
           <Alert color="success" sx={{ mb: 2 }}>
-            <strong>Data loading complete</strong>
+            <Box sx={{ fontWeight: 600 }}>Data loading complete</Box>
           </Alert>
         )}