Bug Fixes and Improvements (#611)

* Bugs Fixes and Improvements Signed-off-by: Manank Patni <manank321@gmail.com> * remove change network button from the dao page Signed-off-by: Manank Patni <manank321@gmail.com> * remove change network button from the dao page Signed-off-by: Manank Patni <manank321@gmail.com> --------- Signed-off-by: Manank Patni <manank321@gmail.com>
dOrgTech · Jul 22, 2023 · 609b70d · 609b70d
1 parent 6c8903c
commit 609b70d
Show file tree

Hide file tree

Showing 13 changed files with 148 additions and 118 deletions.
diff --git a/src/modules/common/ChangeNetworkButton.tsx b/src/modules/common/ChangeNetworkButton.tsx
@@ -1,6 +1,7 @@
 import { Box, capitalize, Grid, styled, Typography, Theme } from "@material-ui/core"
 import { ActionSheet, useActionSheet } from "modules/explorer/context/ActionSheets"
 import React from "react"
+import { useLocation } from "react-router-dom"
 import { Network } from "services/beacon"
 import { useTezos } from "services/beacon/hooks/useTezos"
 
@@ -41,16 +42,25 @@ export const ChangeNetworkButton = () => {
   const { network } = useTezos()
   const { open } = useActionSheet(ActionSheet.Network)
 
+  const location = useLocation()
+
+  const canShow =
+    location.pathname.indexOf("/explorer/dao/") === -1 && location.pathname.indexOf("/explorer/lite/dao/") === -1
+
   return (
-    <StyledConnectedButton onClick={() => open()}>
-      <Grid container style={{ gap: 5 }} alignItems="center" wrap="nowrap">
-        <Grid item>
-          <ColorDot color={networkDotColorMap[network]} />
-        </Grid>
-        <Grid item>
-          <NetworkText>{capitalize(network)}</NetworkText>
-        </Grid>
-      </Grid>
-    </StyledConnectedButton>
+    <>
+      {canShow ? (
+        <StyledConnectedButton onClick={() => open()}>
+          <Grid container style={{ gap: 5 }} alignItems="center" wrap="nowrap">
+            <Grid item>
+              <ColorDot color={networkDotColorMap[network]} />
+            </Grid>
+            <Grid item>
+              <NetworkText>{capitalize(network)}</NetworkText>
+            </Grid>
+          </Grid>
+        </StyledConnectedButton>
+      ) : null}
+    </>
   )
 }
diff --git a/src/modules/creator/deployment/steps/Distribution.tsx b/src/modules/creator/deployment/steps/Distribution.tsx
@@ -108,6 +108,9 @@ const validateForm = (values: TokenDistributionSettings) => {
     if (values.totalAmount && values.totalAmount.minus(new BigNumber(getTotal(values.holders))) < new BigNumber(0)) {
       errors.totalAmount = "Available balance has to be greater that the total supply"
     }
+    if (values.totalAmount && values.totalAmount.gt(new BigNumber(getTotal(values.holders)))) {
+      errors.totalAmount = "Total Supply not fully allocated"
+    }
   })
 
   return errors

diff --git a/src/modules/creator/deployment/steps/Summary.tsx b/src/modules/creator/deployment/steps/Summary.tsx
@@ -98,7 +98,7 @@ export const ContractSummary: React.FC = () => {
   }
 
   const {
-    mutation: { mutate, data, error }
+    mutation: { mutate, data }
   } = useTokenOriginate(state.data)
 
   useEffect(() => {
@@ -107,19 +107,10 @@ export const ContractSummary: React.FC = () => {
         type: ActionTypes.CLEAR_CACHE
       })
       history.push("/creator/success", { address: data.address })
-    }
-  }, [data, dispatch, history])
-
-  useEffect(() => {
-    if (error) {
+    } else if (data && !data.address) {
       setIsLoading(false)
-      openNotification({
-        message: "Error deploying token... try again later",
-        variant: "error",
-        autoHideDuration: 2000
-      })
     }
-  }, [error, openNotification])
+  }, [data, dispatch, history])
 
   useEffect(() => {
     dispatch({

diff --git a/src/modules/explorer/components/ChangeNetworkButton.tsx b/src/modules/explorer/components/ChangeNetworkButton.tsx
@@ -1,8 +1,9 @@
 import { Box, capitalize, Grid, styled, Typography, Theme } from "@material-ui/core"
-import React from "react"
+import React, { useEffect } from "react"
 import { Network } from "services/beacon"
 import { useTezos } from "services/beacon/hooks/useTezos"
 import { ActionSheet, useActionSheet } from "../context/ActionSheets"
+import { useLocation } from "react-router-dom"
 
 const StyledConnectedButton = styled(Box)(({ theme }: { theme: Theme }) => ({
   "& > *": {
@@ -40,16 +41,25 @@ export const ChangeNetworkButton = () => {
   const { network } = useTezos()
   const { open } = useActionSheet(ActionSheet.Network)
 
+  const location = useLocation()
+
+  const canShow =
+    location.pathname.indexOf("/explorer/dao/") === -1 && location.pathname.indexOf("/explorer/lite/dao/") === -1
+
   return (
-    <StyledConnectedButton onClick={() => open()}>
-      <Grid container style={{ gap: 5 }} alignItems="center" wrap="nowrap">
-        <Grid item>
-          <ColorDot color={networkDotColorMap[network]} />
-        </Grid>
-        <Grid item>
-          <NetworkText color="textPrimary">{capitalize(network)}</NetworkText>
-        </Grid>
-      </Grid>
-    </StyledConnectedButton>
+    <>
+      {canShow ? (
+        <StyledConnectedButton onClick={() => open()}>
+          <Grid container style={{ gap: 5 }} alignItems="center" wrap="nowrap">
+            <Grid item>
+              <ColorDot color={networkDotColorMap[network]} />
+            </Grid>
+            <Grid item>
+              <NetworkText color="textPrimary">{capitalize(network)}</NetworkText>
+            </Grid>
+          </Grid>
+        </StyledConnectedButton>
+      ) : null}
+    </>
   )
 }
diff --git a/src/modules/explorer/components/NetworkSheet.tsx b/src/modules/explorer/components/NetworkSheet.tsx
@@ -42,7 +42,6 @@ export const NetworkSheet: React.FC<Props> = props => {
               dispatch({
                 type: ActionTypes.CLEAR_CACHE
               })
-              window.location.href = `/explorer`
             }}
           >
             <Grid container justifyContent="center" alignItems="center" style={{ gap: 8 }}>

diff --git a/src/modules/explorer/components/Toolbar.tsx b/src/modules/explorer/components/Toolbar.tsx
@@ -11,7 +11,6 @@ import {
   useMediaQuery,
   Theme
 } from "@material-ui/core"
-import { useHistory } from "react-router-dom"
 
 import HomeButton from "assets/logos/homebase_logo.svg"
 import { useTezos } from "services/beacon/hooks/useTezos"
@@ -21,7 +20,6 @@ import { ProfileAvatar } from "modules/explorer/components/styled/ProfileAvatar"
 import { NavigationMenu } from "modules/explorer/components/NavigationMenu"
 import { ActionSheet, useActionSheet } from "../context/ActionSheets"
 import { SmallButton } from "../../common/SmallButton"
-import { EnvKey, getEnv } from "services/config"
 
 const Header = styled(Grid)(({ theme }) => ({
   width: "1000px",
@@ -105,8 +103,6 @@ export const Navbar: React.FC<{ disableMobileMenu?: boolean }> = ({ disableMobil
 
   const { open: openUserMenuSheet } = useActionSheet(ActionSheet.UserMenu)
 
-  const history = useHistory()
-
   return (
     <StyledAppBar>
       <StyledToolbar>
@@ -141,6 +137,7 @@ export const Navbar: React.FC<{ disableMobileMenu?: boolean }> = ({ disableMobil
                       <Grid item>
                         <ChangeNetworkButton />
                       </Grid>
+
                       <AddressBarWrapper item onClick={() => openUserMenuSheet()}>
                         <AddressContainer
                           container

diff --git a/src/modules/lite/explorer/components/ChangeNetworkButton.tsx b/src/modules/lite/explorer/components/ChangeNetworkButton.tsx
@@ -3,6 +3,7 @@ import React from "react"
 import { Network } from "services/beacon"
 import { useTezos } from "services/beacon/hooks/useTezos"
 import { ActionSheet, useActionSheet } from "../context/ActionSheets"
+import { useLocation } from "react-router-dom"
 
 const StyledConnectedButton = styled(Box)(({ theme }: { theme: Theme }) => ({
   "& > *": {
@@ -40,16 +41,25 @@ export const ChangeNetworkButton = () => {
   const { network } = useTezos()
   const { open } = useActionSheet(ActionSheet.Network)
 
+  const location = useLocation()
+
+  const canShow =
+    location.pathname.indexOf("/explorer/dao/") === -1 && location.pathname.indexOf("/explorer/lite/dao/") === -1
+
   return (
-    <StyledConnectedButton onClick={() => open()}>
-      <Grid container style={{ gap: 5 }} alignItems="center" wrap="nowrap">
-        <Grid item>
-          <ColorDot color={networkDotColorMap[network]} />
-        </Grid>
-        <Grid item>
-          <NetworkText color="textPrimary">{capitalize(network)}</NetworkText>
-        </Grid>
-      </Grid>
-    </StyledConnectedButton>
+    <>
+      {canShow ? (
+        <StyledConnectedButton onClick={() => open()}>
+          <Grid container style={{ gap: 5 }} alignItems="center" wrap="nowrap">
+            <Grid item>
+              <ColorDot color={networkDotColorMap[network]} />
+            </Grid>
+            <Grid item>
+              <NetworkText color="textPrimary">{capitalize(network)}</NetworkText>
+            </Grid>
+          </Grid>
+        </StyledConnectedButton>
+      ) : null}
+    </>
   )
 }
diff --git a/src/services/beacon/hooks/useTezos.ts b/src/services/beacon/hooks/useTezos.ts
@@ -1,7 +1,7 @@
 import { useQueryClient } from "react-query"
 import { useCallback, useContext } from "react"
 import { MichelCodecPacker, TezosToolkit } from "@taquito/taquito"
-import { connectWithBeacon, Network, rpcNodes, TezosActionType } from "services/beacon"
+import { connectWithBeacon, createTezos, Network, rpcNodes, TezosActionType } from "services/beacon"
 import { TezosContext } from "services/beacon/context"
 import { Tzip16Module } from "@taquito/tzip16"
 import mixpanel from "mixpanel-browser"
@@ -17,14 +17,6 @@ type WalletConnectReturn = {
   wallet: BeaconWallet | undefined
 }
 
-export const initTezosInstance = (network: Network) => {
-  const newTezos = new TezosToolkit(rpcNodes[network])
-  newTezos.setPackerProvider(new MichelCodecPacker())
-  newTezos.addExtension(new Tzip16Module())
-
-  return newTezos
-}
-
 export const useTezos = (): WalletConnectReturn => {
   const {
     state: { tezos, network, account, wallet },
@@ -37,7 +29,7 @@ export const useTezos = (): WalletConnectReturn => {
     async (newNetwork?: Network) => {
       const { wallet } = await connectWithBeacon(network)
 
-      const newTezos: TezosToolkit = initTezosInstance(network || newNetwork)
+      const newTezos: TezosToolkit = createTezos(network || newNetwork)
       newTezos.setProvider({ wallet })
 
       const account = await newTezos.wallet.pkh()
@@ -74,28 +66,35 @@ export const useTezos = (): WalletConnectReturn => {
     }, [dispatch, wallet]),
     changeNetwork: async (newNetwork: Network) => {
       mixpanel.register({ Network: newNetwork })
-
       localStorage.setItem("homebase:network", newNetwork)
-
-      if (!("_pkh" in tezos.wallet)) {
-        const Tezos = new TezosToolkit(rpcNodes[newNetwork])
-        Tezos.setPackerProvider(new MichelCodecPacker())
-        Tezos.addExtension(new Tzip16Module())
-
+      const newTezos: TezosToolkit = createTezos(newNetwork)
+      if (!account) {
         dispatch({
           type: TezosActionType.UPDATE_TEZOS,
           payload: {
             network: newNetwork,
-            tezos: Tezos,
-            account,
+            tezos: newTezos,
+            account: "",
             wallet: undefined
           }
         })
       } else {
-        await connect(newNetwork)
+        const { wallet } = await connectWithBeacon(newNetwork)
+        newTezos.setProvider({ wallet })
+        const newAccount = await newTezos.wallet.pkh()
+
+        dispatch({
+          type: TezosActionType.UPDATE_TEZOS,
+          payload: {
+            network: newNetwork,
+            tezos: newTezos,
+            account: newAccount,
+            wallet
+          }
+        })
       }
+
       queryClient.resetQueries()
-      location.reload()
     },
     account,
     network,

diff --git a/src/services/beacon/utils.ts b/src/services/beacon/utils.ts
@@ -31,23 +31,16 @@ export const getTezosNetwork = (): Network => {
   return envNetwork
 }
 
-let beaconWallet: BeaconWallet
-
-export const createWallet = (network: Network) => {
-  if (!beaconWallet) {
-    beaconWallet = new BeaconWallet({
-      name: "Homebase",
-      iconUrl: "https://tezostaquito.io/img/favicon.png",
-      preferredNetwork: network as NetworkType,
-      walletConnectOptions: {
-        projectId: "1641355e825aeaa926e843dd38b04f6f", // Project ID can be customised
-        relayUrl: "wss://relay.walletconnect.com" // WC2 relayUrl can be customised
-      }
-    })
-  }
-
-  return beaconWallet
-}
+export const createWallet = (network: Network) =>
+  new BeaconWallet({
+    name: "Homebase",
+    iconUrl: "https://tezostaquito.io/img/favicon.png",
+    preferredNetwork: network as NetworkType,
+    walletConnectOptions: {
+      projectId: "1641355e825aeaa926e843dd38b04f6f", // Project ID can be customised
+      relayUrl: "wss://relay.walletconnect.com" // WC2 relayUrl can be customised
+    }
+  })
 
 export const createTezos = (network: Network) => {
   const tezos = new TezosToolkit(rpcNodes[network])

diff --git a/src/services/contracts/baseDAO/hooks/useOriginate.ts b/src/services/contracts/baseDAO/hooks/useOriginate.ts
@@ -5,7 +5,7 @@ import { ContractAbstraction, ContractProvider, TezosToolkit, Wallet } from "@ta
 import { useMutation, useQueryClient } from "react-query"
 
 import { deployMetadataCarrier } from "services/contracts/metadataCarrier/deploy"
-import { initTezosInstance, useTezos } from "services/beacon/hooks/useTezos"
+import { useTezos } from "services/beacon/hooks/useTezos"
 import { BaseDAO, replacer } from ".."
 import { getDAO } from "services/services/dao/services"
 import mixpanel from "mixpanel-browser"