Merge pull request #45 from CudoVentures/cudos-dev

Cudos dev

package.json

@@ -74,6 +74,7 @@
     "tsconfig-paths": "^4.0.0",
     "typescript": "^4.6.3",
     "vite": "^2.9.9",
+    "vite-plugin-svgr": "^2.2.1",
     "vite-tsconfig-paths": "^3.5.0"
   },
   "jest": {

src/App.tsx

@@ -51,18 +51,22 @@ const App = () => {
   }, []);
 
   useEffect(() => {
-    window.addEventListener("keplr_keystorechange",
-      async () => {
-        await connectAccount(KEPLR_LEDGER)
-        return
-      });
 
-    //@ts-ignore
-    window.cosmostation.cosmos.on("accountChanged",
-      async () => {
-        await connectAccount(COSMOSTATION_LEDGER)
-        return
-      });
+    if (window.keplr) {
+      window.addEventListener("keplr_keystorechange",
+        async () => {
+          await connectAccount(KEPLR_LEDGER)
+          return
+        });
+    }
+
+    if (window.cosmostation) {
+      window.cosmostation.cosmos.on("accountChanged",
+        async () => {
+          await connectAccount(COSMOSTATION_LEDGER)
+          return
+        });
+    }
 
   }, [connectAccount])
 

src/components/Dialog/AddressBook/AddAddressButtons.tsx

@@ -116,7 +116,8 @@ const AddAddressButtons = () => {
             if (!fail) {
                 const newAddressBook = { ...addressBook, [userAddress]: userName }
                 dispatch(updateUser({
-                    addressBook: newAddressBook
+                    addressBook: newAddressBook,
+                    newAddedAddress: userAddress
                 }))
 
                 const { address } = await getConnectedUserAddressAndName(connectedLedger!)

src/components/Dialog/FundWallet/FundWallet.tsx

@@ -19,7 +19,7 @@ import AssetsTable from 'components/AssetsTable/AssetsTable'
 import { CancelRoundedIcon, ModalContainer } from '../styles'
 import { initialState as initialModalState } from 'store/modals'
 import { Box, Button, Input, Tooltip, Typography } from '@mui/material'
-import { handleFullBalanceToPrecision, separateFractions } from 'utils/regexFormatting'
+import { formatSendAmount, handleFullBalanceToPrecision, separateFractions } from 'utils/regexFormatting'
 import { getSigningClient } from 'utils/config'
 import { MultiSendUser } from 'utils/multiSendTableHelper'
 import { chainIDToAlias } from 'components/Layout/Networkinfo'
@@ -33,6 +33,7 @@ import {
     GENERAL_FAILURE_MSG, 
     GENERAL_FAILURE_TITLE, 
     INSUFFICIENT_BALANCE, 
+    MINIMUM_GAS_FEE, 
     NATIVE_TOKEN_DENOM, 
     WALLET_FUNDING_FAILURE_TITLE, 
     WALLET_FUNDING_LOADING_TITLE,
@@ -105,6 +106,7 @@ const FundWallet = () => {
 
     const generateFundWalletMsg = async () => {
         try {
+            await estimateFee()
             const { msg, fee } = await getFundWalletMsgAndFees()
             setMsg(msg)
             setFees(fee)
@@ -221,13 +223,13 @@ const FundWallet = () => {
     }
 
     const maxingOut = () => {
+        if (new BigNumber(chosenBalance!.amount!).isLessThan(amountToAcudos(MINIMUM_GAS_FEE))) {
+            return
+        }
+
+        const amount = formatSendAmount(chosenBalance!)
+        setAmountToSend(amount)
         setMaxOut(true)
-        const tempAmount = parseFloat(handleFullBalanceToPrecision(
-            chosenBalance!.amount!, 
-            2, 
-            chosenBalance!.denom!
-        ))
-        setAmountToSend(tempAmount)
     }
 
     const isAdminTransfer = () => {
@@ -290,6 +292,24 @@ const FundWallet = () => {
          )
      }
 
+    const estimateFee = async () => {
+        const currentBalance = new BigNumber(chosenBalance!.amount!)
+        if (isAdminTransfer() || currentBalance.isLessThan(amountToAcudos(MINIMUM_GAS_FEE))) {
+            return
+        }
+
+        let estimate = await getFundWalletMsgAndFees()
+        const fee = estimate.fee.amount[0].amount
+        const sendAmount = new BigNumber(amountToAcudos(amountToSend))
+        if (currentBalance.isLessThan(sendAmount.plus(fee))) {
+            const sendAmountAfterFee = formatSendAmount({
+                amount: sendAmount.minus(fee).toString(10),
+                denom: chosenBalance!.denom!
+            })
+            setAmountToSend(sendAmountAfterFee)
+        }
+    }
+
     return (
         <MuiDialog
         BackdropProps={defaultStyles.defaultBackDrop}

src/components/Dialog/SingleSend/index.tsx

@@ -18,7 +18,7 @@ import AssetsTable from 'components/AssetsTable/AssetsTable'
 import { CancelRoundedIcon, ModalContainer } from '../styles'
 import { initialState as initialModalState } from 'store/modals'
 import { Box, Button, Input, Tooltip, Typography } from '@mui/material'
-import { handleFullBalanceToPrecision, separateFractions } from 'utils/regexFormatting'
+import { formatSendAmount, handleFullBalanceToPrecision, separateFractions } from 'utils/regexFormatting'
 import { executeMsgs, getSingleSendMsgAndFees } from '../ReusableModal/helpers'
 import { isValidCudosAddress } from 'utils/validation'
 import { SelectFromAddrBookBtn, SelectFromAddrBookDropDown } from '../MultiSend/helperComponents'
@@ -32,6 +32,7 @@ import {
     GENERAL_FAILURE_TITLE,
     INSUFFICIENT_BALANCE,
     INVALID_DATA_PROMPT_MSG,
+    MINIMUM_GAS_FEE,
     NATIVE_TOKEN_DENOM,
     PROPOSAL_CREATION_FAILURE_TITLE,
     PROPOSAL_CREATION_LOADING_TITLE,
@@ -230,13 +231,13 @@ const SingleSend = () => {
     }
 
     const maxingOut = () => {
+        if (new BigNumber(chosenBalance!.amount!).isLessThan(amountToAcudos(MINIMUM_GAS_FEE))) {
+            return
+        }
+
+        const amount = formatSendAmount(chosenBalance!)
+        setAmountToSend(amount)
         setMaxOut(true)
-        const tempAmount = parseFloat(handleFullBalanceToPrecision(
-            chosenBalance!.amount!,
-            2,
-            chosenBalance!.denom!
-        ))
-        setAmountToSend(tempAmount)
     }
 
     const isAdminTransfer = () => {
@@ -258,7 +259,7 @@ const SingleSend = () => {
                 neededFees.isLessThanOrEqualTo(cudosBalance)
         }
 
-        return new BigNumber(transferAmount).plus(neededFees).isLessThanOrEqualTo(accountBalance)
+        return new BigNumber(transferAmount).isLessThanOrEqualTo(accountBalance)
     }
 
     const getTooltip = (): string => {

src/components/Layout/Footer.tsx

@@ -1,18 +1,13 @@
 import { Box, Grid, Typography } from '@mui/material'
 import { COLORS_DARK_THEME } from 'theme/colors'
+import { FOOTER } from 'utils/constants'
 import { styles } from './styles'
 
-const centerLinks = [
-  { text: 'All rights reserved 2022', url: 'https://www.cudos.org/' },
-  { text: 'cudos.org', url: 'https://www.cudos.org/' },
-  { text: 'v.02.00', url: 'https://github.com/CudoVentures/cudos-multisig-v2' },
-]
-
 const Footer = () => {
   return (
     <Box sx={styles.footerContainer} gap={6}>
-      <Box display="flex" alignItems="center">
-        {centerLinks.map((link) => (
+      <Box display="flex">
+        {FOOTER.LEFT_LINKS.map((link) => (
           <Grid
             item
             key={link.text}
@@ -40,8 +35,30 @@ const Footer = () => {
           </Grid>
         ))}
       </Box>
+      <Box
+        alignItems="center"
+        display="flex"
+        gap={3}
+        sx={{ marginLeft: 'auto' }}
+      >
+        {FOOTER.RIGHT_LINKS.map((link) => (
+          <Grid
+            key={link.url}
+            onClick={() => window.open(link.url, '_blank')?.focus()}
+            sx={({ palette }) => ({
+              cursor: 'pointer',
+              color: palette.text.secondary,
+              '&:hover': {
+                color: palette.primary.main
+              }
+            })}
+          >
+            {link.icon}
+          </Grid>
+        ))}
+      </Box>
     </Box>
   )
 }
 
-export default Footer
+export default Footer

src/components/Layout/index.tsx

@@ -1,12 +1,13 @@
 import { Box } from '@mui/material'
 import Footer from './Footer'
 import Header from './Header'
+import { styles } from './styles'
 
 const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) => {
   return (
-    <Box style={{height: '96.5vh', width: '99.7vw', display: 'grid'}}>
+    <Box style={styles.layoutHolder}>
       <Header />
-        <Box sx={{ padding: '0 1rem' }} flexGrow={1}>
+        <Box sx={{ overflow: 'auto', padding: '0 1rem' }} flexGrow={1}>
           {children}
         </Box>
       <Footer />

src/components/Layout/styles.ts

@@ -3,20 +3,26 @@ import { styled, Box } from '@mui/material'
 import theme from '../../theme'
 
 export const styles = {
+  layoutHolder: {
+    height: '96.5vh',
+    width: '99.7vw',
+    display: 'grid',
+    alignContent: 'space-between'
+  },
   anchorStyle: {
-    alignItems: 'center', 
-    textDecoration: 'none', 
+    alignItems: 'center',
+    textDecoration: 'none',
     display: 'flex'
   },
   networkInfoHolder: {
-    width: 'max-content', 
-    marginRight: '20px', 
-    display: 'flex', 
+    width: 'max-content',
+    marginRight: '20px',
+    display: 'flex',
     alignItems: 'center'
   },
   avatarStyling: {
-    borderRadius: "0px", 
-    width: '18px', 
+    borderRadius: "0px",
+    width: '18px',
     height: '18px'
   },
   menuContainer: {
@@ -53,7 +59,7 @@ export const styles = {
     float: 'right',
     fontSize: '14px',
     height: '224px',
-    minWidth: '224px',
+    width: '100%',
     fontWeight: '500',
     display: 'flex',
     borderRadius: '0px 0px 20px 20px',
@@ -75,12 +81,13 @@ export const styles = {
   footerContainer: {
     display: 'flex',
     justifyContent: 'center',
-    alignItems: 'flex-end',
+    alignItems: 'center',
     bottom: 0,
     right: 0,
     left: 0,
     width: 'inherit',
-    padding: '20px 0 10px 0'
+    padding: '1rem 1rem 0 1rem',
+    marginBottom: '-20px'
   }
 } as const