Feat/disable not connected chains improvements

components/Finder.tsx

@@ -1,40 +1,40 @@
 import { ReactNode } from 'react'
 
 import { Link } from '@chakra-ui/react'
-
-import { truncate } from '../libs/text'
+import { ChainId } from 'constants/index'
+import { truncate } from 'libs/text'
 
 type Props = {
   chainId: string
   txHash: string
   children?: ReactNode
 }
 
-const getUrl = (chainId, txHash) => {
+const getUrl = (chainId: string, txHash: string) => {
   switch (chainId) {
     case 'uni-6':
       return `https://testnet.mintscan.io/juno-testnet/txs/${txHash}`
-    case 'migaloo-1':
+    case ChainId.migaloo:
       return `https://explorer.silknodes.io/migaloo/tx/${txHash}`
-    case 'narwhal-1':
+    case ChainId.narwhal:
       return `https://testnet.migaloo.explorers.guru/transaction/${txHash}`
-    case 'pisco-1':
+    case ChainId.pisco:
       return `https://finder.terra.money/testnet/tx/${txHash}`
-    case 'juno-1':
+    case ChainId.juno:
       return `https://mintscan.io/juno/txs/${txHash}`
-    case 'phoenix-1':
+    case ChainId.terra:
       return `https://finder.terra.money/mainnet/tx/${txHash}`
-    case 'chihuahua-1':
+    case ChainId.chihuahua:
       return `https://www.mintscan.io/chihuahua/txs/${txHash}`
     case 'injective-888':
       return `https://testnet.explorer.injective.network/transaction/${txHash}`
-    case 'injective-1':
+    case ChainId.injective:
       return `https://explorer.injective.network/transaction/${txHash}`
-    case 'comdex-1':
+    case ChainId.comdex:
       return `https://mintscan.io/comdex/txs/${txHash}`
-    case 'pacific-1':
+    case ChainId.sei:
       return `https://ping.pub/sei/tx/${txHash}`
-    case 'columbus-5':
+    case ChainId.terrac:
       return `https://ping.pub/terra-luna/tx/${txHash}`
     default:
       return null

components/Icons/ShellWalletIcon.tsx

@@ -0,0 +1 @@
+export const ShellWalletIcon = () => (<img src="/logos/shell-icon.png" width={'27px'} />)

components/Icons/TerraStationWalletIcon.tsx

@@ -0,0 +1 @@
+export const TerraStationWalletIcon = () => (<img src="/logos/station-icon.png" width={'27px'} />)

components/Icons/WalletConnectIcon.tsx

@@ -0,0 +1,11 @@
+import { Image } from '@chakra-ui/react'
+
+export const WalletConnectIcon = () => (
+  <Image
+    src={'/logos/wallet-connect-icon.png'}
+    width="auto"
+    maxW="1.5rem"
+    maxH="1.5rem"
+    alt="token1-img"
+  />
+)

components/Navbar/Navbar.tsx

@@ -11,8 +11,8 @@ import {
   VStack,
   useDisclosure,
 } from '@chakra-ui/react'
-import BurgerIcon from 'components/icons/BurgerIcon'
-import { ACTIVE_BONDING_NETWORKS } from 'constants/index'
+import BurgerIcon from 'components/Icons/BurgerIcon'
+import { ACTIVE_BONDING_NETWORKS, ChainId } from 'constants/index'
 import { useRecoilValue } from 'recoil'
 import { chainState } from 'state/chainState'
 
@@ -80,7 +80,7 @@ const Navbar = () => {
           <Logo />
         </Box>
         <Card paddingX={10} gap={6}>
-          {(chainId === 'columbus-5' ? luncMenuLinks : ACTIVE_BONDING_NETWORKS.includes(chainId)
+          {(chainId === ChainId.terrac ? luncMenuLinks : ACTIVE_BONDING_NETWORKS.includes(chainId)
             ? menuLinks
             : bondingDisabledMenuLinks
           ).map((menu) => (

components/Pages/Dashboard/BondingActions/hooks/bondTokens.ts

@@ -1,6 +1,7 @@
 import { SigningCosmWasmClient } from '@cosmjs/cosmwasm-stargate/build/signingcosmwasmclient'
 import { coin } from '@cosmjs/stargate'
 import { Config } from 'components/Pages/Dashboard/hooks/useDashboardData'
+import { ChainId } from 'constants/index'
 import { TerraTreasuryService } from 'services/treasuryService'
 import { createExecuteMessage } from 'util/messages/createExecuteMessage'
 
@@ -27,18 +28,16 @@ export const bondTokens = async (
     contractAddress: config.whale_lair,
     message: handleMsg,
     funds: [coin(amount, denom)] })
-  let fee = 'auto'
-  if (await signingClient.getChainId() === 'columbus-5') {
+  let fee: any = 'auto'
+  if (await signingClient.getChainId() === ChainId.terrac) {
     const gas = Math.ceil(await signingClient.simulate(
       address, [execMsg], '',
     ) * 1.3)
     fee = await TerraTreasuryService.getInstance().getTerraClassicFee(
       amount, denom, gas,
     )
   }
-
   return await signingClient.signAndBroadcast(
-    // @ts-ignore
     address, [execMsg], fee, '',
   )
 }

components/Pages/Dashboard/BondingActions/hooks/claimRewards.ts

@@ -1,5 +1,6 @@
 import { SigningCosmWasmClient } from '@cosmjs/cosmwasm-stargate/build/signingcosmwasmclient'
 import { Config } from 'components/Pages/Dashboard/hooks/useDashboardData'
+import { ChainId } from 'constants/index'
 import { TerraTreasuryService } from 'services/treasuryService'
 import { createExecuteMessage } from 'util/messages/createExecuteMessage'
 
@@ -16,8 +17,8 @@ export const claimRewards = async (
     contractAddress: config.fee_distributor,
     message: handleMsg,
     funds: [] })
-  let fee = 'auto'
-  if (await signingClient.getChainId() === 'columbus-5') {
+  let fee: any = 'auto'
+  if (await signingClient.getChainId() === ChainId.terrac) {
     const gas = Math.ceil(await signingClient.simulate(
       address, [execMsg], '',
     ) * 1.3)
@@ -26,7 +27,6 @@ export const claimRewards = async (
     )
   }
   return await signingClient.signAndBroadcast(
-    // @ts-ignore
     address, [execMsg], fee, '',
   )
 }

components/Pages/Dashboard/BondingActions/hooks/createNewEpoch.ts

@@ -1,9 +1,9 @@
 import { SigningCosmWasmClient } from '@cosmjs/cosmwasm-stargate/build/signingcosmwasmclient'
 import { Config } from 'components/Pages/Dashboard/hooks/useDashboardData'
+import { ChainId } from 'constants/index'
+import { TerraTreasuryService } from 'services/treasuryService'
 import { createExecuteMessage } from 'util/messages/createExecuteMessage'
 
-import { TerraTreasuryService } from '../../../../../services/treasuryService'
-
 export const createNewEpoch = async (
   signingClient: SigningCosmWasmClient,
   config: Config,
@@ -17,8 +17,8 @@ export const createNewEpoch = async (
     contractAddress: config.fee_distributor,
     message: handleMsg,
     funds: [] })
-  let fee = 'auto'
-  if (await signingClient.getChainId() === 'columbus-5') {
+  let fee: any = 'auto'
+  if (await signingClient.getChainId() === ChainId.terrac) {
     const gas = Math.ceil(await signingClient.simulate(
       address, [execMsg], '',
     ) * 1.3)
@@ -27,7 +27,6 @@ export const createNewEpoch = async (
     )
   }
   return await signingClient.signAndBroadcast(
-    // @ts-ignore
     address, [execMsg], fee, '',
   )
 }

components/Pages/Dashboard/BondingActions/hooks/unbondTokens.ts

@@ -1,5 +1,6 @@
 import { SigningCosmWasmClient } from '@cosmjs/cosmwasm-stargate/build/signingcosmwasmclient'
 import { Config } from 'components/Pages/Dashboard/hooks/useDashboardData'
+import { ChainId } from 'constants/index'
 import { TerraTreasuryService } from 'services/treasuryService'
 import { createExecuteMessage } from 'util/messages/createExecuteMessage'
 
@@ -27,8 +28,8 @@ export const unbondTokens = async (
     contractAddress: config.whale_lair,
     message: handleMsg,
     funds: [] })
-  let fee = 'auto'
-  if (await signingClient.getChainId() === 'columbus-5') {
+  let fee: any = 'auto'
+  if (await signingClient.getChainId() === ChainId.terrac) {
     const gas = Math.ceil(await signingClient.simulate(
       address, [execMsg], '',
     ) * 1.3)
@@ -37,7 +38,6 @@ export const unbondTokens = async (
     )
   }
   return await signingClient.signAndBroadcast(
-    // @ts-ignore
     address, [execMsg], fee, '',
   )
 }

components/Pages/Dashboard/BondingActions/hooks/withdrawTokens.ts

@@ -1,5 +1,6 @@
 import { SigningCosmWasmClient } from '@cosmjs/cosmwasm-stargate/build/signingcosmwasmclient'
 import { Config } from 'components/Pages/Dashboard/hooks/useDashboardData'
+import { ChainId } from 'constants/index'
 import { TerraTreasuryService } from 'services/treasuryService'
 import { createExecuteMessage } from 'util/messages/createExecuteMessage'
 
@@ -19,8 +20,8 @@ export const withdrawTokens = async (
     contractAddress: config.whale_lair,
     message: handleMsg,
     funds: [] })
-  let fee = 'auto'
-  if (await signingClient.getChainId() === 'columbus-5') {
+  let fee: any = 'auto'
+  if (await signingClient.getChainId() === ChainId.terrac) {
     const gas = Math.ceil(await signingClient.simulate(
       address, [execMsg], '',
     ) * 1.3)
@@ -29,7 +30,6 @@ export const withdrawTokens = async (
     )
   }
   return await signingClient.signAndBroadcast(
-    // @ts-ignore
     address, [execMsg], fee, '',
   )
 }

components/Pages/Dashboard/RewardsComponent.tsx

@@ -94,7 +94,7 @@ const ProgressBar = ({ progress, currentEpochStartTimeInNano }) => {
         borderRadius="10px"
         position="relative"
         animation={
-          isImminent ? `${pulseAnimation} 1.8s ease-in-out infinite` : undefined
+          isImminent ? `${pulseAnimation} 1.8s ease-in-out infinite` : null
         }
       />
     </Box>

components/Pages/Dashboard/RewardsTooltip.tsx

@@ -15,6 +15,7 @@ export const RewardsTooltip = ({
   isWalletConnected,
   daysSinceLastClaim,
 }: Props) => {
+  const [isLabelOpen, setIsLabelOpen] = useState(false)
   const lastClaimed = () => {
     if (daysSinceLastClaim >= 21) {
       return '21+ days ago'
@@ -46,12 +47,12 @@ export const RewardsTooltip = ({
       label={
         isWalletConnected ? (
           <VStack
-            minW="250px"
+            minW="180px"
             minH="fit-content"
             borderRadius="10px"
             bg="blackAlpha.900"
-            px="4"
-            py="4"
+            px="2"
+            py="2"
             position="relative"
             border="none"
             justifyContent="center"
@@ -69,7 +70,9 @@ export const RewardsTooltip = ({
       } // Displaying nothing when wallet disconnected
       bg="transparent"
     >
-      <VStack alignItems="flex-start" minW={50}>
+      <VStack alignItems="flex-start" minW={50} onMouseEnter={() => setIsLabelOpen(true)}
+        onMouseLeave={() => setIsLabelOpen(false)}
+        onClick={() => setIsLabelOpen(!isLabelOpen)}>
         <Text ref={textRef} mb="-0.3rem" color="white">
           {dollarValue}
         </Text>

components/Pages/Trade/Incentivize/hooks/useClosePosition.ts

@@ -2,15 +2,15 @@ import { useMemo } from 'react'
 import { useMutation } from 'react-query'
 
 import { useChain } from '@cosmos-kit/react-lite'
+import { ChainId } from 'constants/index'
 import { useClients } from 'hooks/useClients'
 import useTxStatus from 'hooks/useTxStatus'
 import { usePoolFromListQueryById } from 'queries/usePoolsListQuery'
 import { useRecoilValue } from 'recoil'
+import { TerraTreasuryService } from 'services/treasuryService'
 import { chainState } from 'state/chainState'
 import { createExecuteMessage, validateTransactionSuccess } from 'util/messages/index'
 
-import { TerraTreasuryService } from '../../../../../services/treasuryService'
-
 type OpenPosition = {
   poolId: string
 }
@@ -64,8 +64,8 @@ export const useClosePosition = ({ poolId }: OpenPosition) => {
       console.log({ msg,
         flowId,
         poolId })
-      let fee:any = 'auto'
-      if (await signingClient.getChainId() === 'columbus-5') {
+      let fee: any = 'auto'
+      if (await signingClient.getChainId() === ChainId.terrac) {
         const gas = Math.ceil(await signingClient.simulate(
           address, msg, '',
         ) * 1.3)

components/Pages/Trade/Incentivize/hooks/useIncentivePoolInfo.ts

@@ -10,6 +10,7 @@ import { fetchTotalPoolSupply } from 'components/Pages/Trade/Pools/hooks/fetchTo
 import {
   AMP_WHALE_TOKEN_SYMBOL,
   B_WHALE_TOKEN_SYMBOL,
+  ChainId,
   WHALE_TOKEN_SYMBOL,
 } from 'constants/index'
 import usePrices from 'hooks/usePrices'
@@ -181,9 +182,9 @@ export const useIncentivePoolInfo = (
 
   useEffect(() => {
     const fetchPoolData = async () => {
-      currentChainPrefix = chainId === 'columbus-5' ? 'terra-classic' : currentChainPrefix
+      currentChainPrefix = chainId === ChainId.terrac ? 'terra-classic' : currentChainPrefix
       const poolData =
-        currentChainPrefix === 'terra' && chainId !== 'columbus-5'
+        currentChainPrefix === 'terra' && chainId !== ChainId.terrac
           ? await getPairAprAndDailyVolumeTerra(pools)
           : await getPairAprAndDailyVolume(pools, currentChainPrefix)
       setPoolsWithAprAnd24HrVolume(poolData)

components/Pages/Trade/Incentivize/hooks/useOpenFlow.ts

@@ -10,6 +10,7 @@ import {
 } from 'components/Pages/Dashboard/hooks/useDashboardData'
 import useEpoch from 'components/Pages/Trade/Incentivize/hooks/useEpoch'
 import useFactoryConfig from 'components/Pages/Trade/Incentivize/hooks/useFactoryConfig'
+import { ChainId } from 'constants/index'
 import { useClients } from 'hooks/useClients'
 import useSimulate from 'hooks/useSimulate'
 import { useTokenInfo } from 'hooks/useTokenInfo'
@@ -120,8 +121,8 @@ export const useOpenFlow = ({ poolId, token, startDate, endDate }: Props) => {
 
   const { mutate: submit, ...tx } = useMutation({
     mutationFn: async () => {
-      let fee:any = 'auto'
-      if (chainId === 'columbus-5') {
+      let fee: any = 'auto'
+      if (chainId === ChainId.terrac) {
         const gas = Math.ceil(await signingClient.simulate(
           address, msgs, '',
         ) * 1.3)

components/Pages/Trade/Liquidity/BondingDaysSlider.tsx

@@ -22,8 +22,13 @@ type Props = {
   show: boolean
 }
 
-const setBondingdays = (input: string, setBondingDays: any) => {
-  if (Number(input) <= 365 && Number(input) >= 1) {
+const setBondingdays = (
+  input: string, setBondingDays: any, bondingDays:number,
+) => {
+  if (Number(input).valueOf() === 0 && Number(bondingDays).valueOf() === 0) {
+    setBondingDays(Number(bondingDays).valueOf())
+  }
+  if (Number(input) <= 365 && Number(input) >= 0) {
     setBondingDays(input)
   }
   if (Number(input) > 365) {
@@ -51,10 +56,10 @@ export const BondingDaysSlider = ({
       <Box width="full">
         <Slider
           focusThumbOnChange={false}
-          defaultValue={0}
+          defaultValue={1}
           value={bondingDays}
           step={1}
-          min={0}
+          min={1}
           max={365}
           borderRadius={100}
           height={1.5}
@@ -75,14 +80,17 @@ export const BondingDaysSlider = ({
           maxWidth={''}
         >
           <NumberInput
-            defaultValue={0}
-            min={0}
+            defaultValue={1}
+            min={1}
             max={365}
+            textColor={'white'}
             size={'xs'}
-            value={bondingDays}
+            value={bondingDays.valueOf()}
             inputMode={'numeric'}
             onChange={(elem: string) => {
-              setBondingdays(elem, setBondingDays)
+              setBondingdays(
+                elem, setBondingDays, bondingDays,
+              )
             }}
           >
             <NumberInputField border={'hidden'} maxWidth={'70'} />