Feature/staking page (#172)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: add chain info in url

* fix: useQueriesDataSelector hooks

* feat: load pools without wallet connection

* fix: update logic of onChainChange function

* fix: remove duplicated coinhall api call

* fix: infinite loop issue on pools page

* fix: typo issue of error

* fix: update onChainChange function for wallet connect

* docs: replace secuirty email contacts

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* fix: loading issue on vaults (#128)

* feat:add chain info on add_liquidity/manage_liquidity features (#134)

* feat: add chain info on manage_liquidity url

* feat: add chain info on new_position url

* feat: add chain info on new_position url

* feat: enhance pool routing with chain info

* feat: enhance new_position url with chain info

* fix: replace currentChainId with currentChainName

* feat: implement swap default tokens

* fix: minor lint and style issue

* fix: lint and style issue

* fix: swapform alignment issue (#135)

* fix:flashloan misalignment issue (#136)

* fix: misalignment issue of flashloan json editor form

* fix: vertical alignment issue

* feat: wallet auto connect (#142)

* feat: injective integration; Test and mainnet (#121)

* feat(inj): Start on inj integration

* feat: Add injective testnet chain_info and pools

* feat: Injective integration chain and pool; swaps not working yet

* fix: Update testnet rpc for now with one that has cors issues

* feat: Add other vaults and pools

* working simulation on injective

* feat: updates for injective client integration; also run prettier

* feat:injective poc, frontend not working yet but a tx was done

* injective added

* fix:inj to cw20 direct

* fix: Inj to cw20 direct, cw20 to inj and router txes

* fix: fix: multiple messages in post, cw20 swap

* feat: Prep for injective mainnet

* feat: Injective Mainnet info; swaps working, withdraw lp, balances

* fix: Provide and withdraw LP now working

* fix: Update DEFAULT_GAS to 2million

* fix: Remove injective poc stuff

* fix: reduce gas limit

* fixed swp rate message and injective catch error

* fix few issues listed in slack

* fix: Update decimal conversion on provide lp

* fix funds issue on LP

* clean console and fix  banner and loading state

* fix depost message on vault

* coming soon, coinhall and atom price off fix

* fix mange lp cta cutting off

* fix flashloan on injective

* fix: Update codeowners, there needs to be two

* fix: Run prettier to fixup code

Co-authored-by: Vinod Hum <[email protected]>

* feat: add mobile not support modal on mobile devices (#140)

* feat: add price field on injective pools (#141)

* feat: add price field on injective pools

* feat: add dollar sign

* feat: load pools without wallet connection

* fix: remove duplicated coinhall api call

* fix: infinite loop issue on pools page

* fix: minor issue

* chore: fix codeowners

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: add chain info on flash loan page

* feat: add chain info on flashloan page

* feat: add routes with chain info for swap and flashloan pages

* feat: add chain info on vault new_position and manage_position routes

* feat: fix lint and style issues

* chore: fix lint and style issue

* fix: implement dynamic routing from chain change

* fix: route redirection issue on vault depositForm

* chore: add / in vault routes

* fix: vault route redirection issue with chain info

* fix: routing issue on vaults/new_position and vaults/manage_position routes

* fix: swap routing issue

* fix: issue on pools/manage_liquidity route

* fix: routing issue

* feat: implement automatic wallet connect feature

* feat: improve chain auto change feature

* fix: routing issue on flashloan page

* fix: routing issue

* fix: update getPathName function

* fix: update pool routing

* fix: remove unused code

* fix: lint issue

* fix: new_position routing issue

* fix: vault/new_position routing issue

* fix: used code

* fix: vaults/manage_position issue

* fix: /vaults routing issue

* fix: routing issue on pools/manage_liquidity

* fix: update wallet auto connect feature

* fix: lint issue

* fix: default routing issue

* fix: add initial disconnect feature

* fix: remove unused code

* fix: rename inj to injective

* fix: update disconnect logic

* fix: pool loading issue

* fix: swap default token issue on testnet

* fix: error for chihuahua testnet

* fix: default token issue of new_position feature on testnet

* fix: update defaultToknes for new_position

* fix: lint issue

* fix: cosmwasm client init issue

Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Vinod Hum <[email protected]>
Co-authored-by: sencom <[email protected]>

* leap integration (#147)

* leap integration

* fix multiple connect

* fix: logic of resetWalletConnection function

* fix: conflict and lint issues

* fix: price value issue on comdex pools

* fix: wallet reconnect issue

* fix: error message

* fix: wallet connect issue from page reload

* fix: redirect issue

* fix: remove dollar sign from comdex atom pool

* removed pools requted (#153)

* fix: leap wallet logo issue

* fix: leap wallet logo issue

* fix: typo issue on juno-axlUSDC pool

* fix: manage_liquidity routing issue

* fix: lint issue

* fix: add comdex default tokens

* fix: remove unused param

* fix ledger not working on keplr (#154)

* feat: add 24hr volume of injective pools (#149)

* feat: load pools without wallet connection

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: wallet auto connect (#142)

* feat: injective integration; Test and mainnet (#121)

* feat(inj): Start on inj integration

* feat: Add injective testnet chain_info and pools

* feat: Injective integration chain and pool; swaps not working yet

* fix: Update testnet rpc for now with one that has cors issues

* feat: Add other vaults and pools

* working simulation on injective

* feat: updates for injective client integration; also run prettier

* feat:injective poc, frontend not working yet but a tx was done

* injective added

* fix:inj to cw20 direct

* fix: Inj to cw20 direct, cw20 to inj and router txes

* fix: fix: multiple messages in post, cw20 swap

* feat: Prep for injective mainnet

* feat: Injective Mainnet info; swaps working, withdraw lp, balances

* fix: Provide and withdraw LP now working

* fix: Update DEFAULT_GAS to 2million

* fix: Remove injective poc stuff

* fix: reduce gas limit

* fixed swp rate message and injective catch error

* fix few issues listed in slack

* fix: Update decimal conversion on provide lp

* fix funds issue on LP

* clean console and fix  banner and loading state

* fix depost message on vault

* coming soon, coinhall and atom price off fix

* fix mange lp cta cutting off

* fix flashloan on injective

* fix: Update codeowners, there needs to be two

* fix: Run prettier to fixup code

Co-authored-by: Vinod Hum <[email protected]>

* feat: add mobile not support modal on mobile devices (#140)

* feat: add price field on injective pools (#141)

* feat: add price field on injective pools

* feat: add dollar sign

* feat: load pools without wallet connection

* fix: remove duplicated coinhall api call

* fix: infinite loop issue on pools page

* fix: minor issue

* chore: fix codeowners

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: add chain info on flash loan page

* feat: add chain info on flashloan page

* feat: add routes with chain info for swap and flashloan pages

* feat: add chain info on vault new_position and manage_position routes

* feat: fix lint and style issues

* chore: fix lint and style issue

* fix: implement dynamic routing from chain change

* fix: route redirection issue on vault depositForm

* chore: add / in vault routes

* fix: vault route redirection issue with chain info

* fix: routing issue on vaults/new_position and vaults/manage_position routes

* fix: swap routing issue

* fix: issue on pools/manage_liquidity route

* fix: routing issue

* feat: implement automatic wallet connect feature

* feat: improve chain auto change feature

* fix: routing issue on flashloan page

* fix: routing issue

* fix: update getPathName function

* fix: update pool routing

* fix: remove unused code

* fix: lint issue

* fix: new_position routing issue

* fix: vault/new_position routing issue

* fix: used code

* fix: vaults/manage_position issue

* fix: /vaults routing issue

* fix: routing issue on pools/manage_liquidity

* fix: update wallet auto connect feature

* fix: lint issue

* fix: default routing issue

* fix: add initial disconnect feature

* fix: remove unused code

* fix: rename inj to injective

* fix: update disconnect logic

* fix: pool loading issue

* fix: swap default token issue on testnet

* fix: error for chihuahua testnet

* fix: default token issue of new_position feature on testnet

* fix: update defaultToknes for new_position

* fix: lint issue

* fix: cosmwasm client init issue

Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Vinod Hum <[email protected]>
Co-authored-by: sencom <[email protected]>

* feat: add 24hr volume of injective pools

* feat: add apr value on injective pools

* fix: trading volume of injective pools

* fix: 24hr volume issue on injective network

* feat: update useFeeVolume hooks

* fix: infinite loading issue

* fix: update injective subquery url

* feat: refactor to improve token price fetch

* fix: conflict issue

* feat: remove unused component

* fix: update refetchBackground mode

* fix: infinite loading issue

Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Vinod Hum <[email protected]>
Co-authored-by: sencom <[email protected]>

* cosmos station wallet added (#152)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: add chain info in url

* fix: useQueriesDataSelector hooks

* feat: load pools without wallet connection

* fix: update logic of onChainChange function

* fix: remove duplicated coinhall api call

* fix: infinite loop issue on pools page

* fix: typo issue of error

* fix: update onChainChange function for wallet connect

* docs: replace secuirty email contacts

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* fix: loading issue on vaults (#128)

* feat:add chain info on add_liquidity/manage_liquidity features (#134)

* feat: add chain info on manage_liquidity url

* feat: add chain info on new_position url

* feat: add chain info on new_position url

* feat: enhance pool routing with chain info

* feat: enhance new_position url with chain info

* fix: replace currentChainId with currentChainName

* feat: implement swap default tokens

* fix: minor lint and style issue

* fix: lint and style issue

* fix: swapform alignment issue (#135)

* fix:flashloan misalignment issue (#136)

* fix: misalignment issue of flashloan json editor form

* fix: vertical alignment issue

* feat: wallet auto connect (#142)

* feat: injective integration; Test and mainnet (#121)

* feat(inj): Start on inj integration

* feat: Add injective testnet chain_info and pools

* feat: Injective integration chain and pool; swaps not working yet

* fix: Update testnet rpc for now with one that has cors issues

* feat: Add other vaults and pools

* working simulation on injective

* feat: updates for injective client integration; also run prettier

* feat:injective poc, frontend not working yet but a tx was done

* injective added

* fix:inj to cw20 direct

* fix: Inj to cw20 direct, cw20 to inj and router txes

* fix: fix: multiple messages in post, cw20 swap

* feat: Prep for injective mainnet

* feat: Injective Mainnet info; swaps working, withdraw lp, balances

* fix: Provide and withdraw LP now working

* fix: Update DEFAULT_GAS to 2million

* fix: Remove injective poc stuff

* fix: reduce gas limit

* fixed swp rate message and injective catch error

* fix few issues listed in slack

* fix: Update decimal conversion on provide lp

* fix funds issue on LP

* clean console and fix  banner and loading state

* fix depost message on vault

* coming soon, coinhall and atom price off fix

* fix mange lp cta cutting off

* fix flashloan on injective

* fix: Update codeowners, there needs to be two

* fix: Run prettier to fixup code

Co-authored-by: Vinod Hum <[email protected]>

* feat: add mobile not support modal on mobile devices (#140)

* feat: add price field on injective pools (#141)

* feat: add price field on injective pools

* feat: add dollar sign

* feat: load pools without wallet connection

* fix: remove duplicated coinhall api call

* fix: infinite loop issue on pools page

* fix: minor issue

* chore: fix codeowners

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: add chain info on flash loan page

* feat: add chain info on flashloan page

* feat: add routes with chain info for swap and flashloan pages

* feat: add chain info on vault new_position and manage_position routes

* feat: fix lint and style issues

* chore: fix lint and style issue

* fix: implement dynamic routing from chain change

* fix: route redirection issue on vault depositForm

* chore: add / in vault routes

* fix: vault route redirection issue with chain info

* fix: routing issue on vaults/new_position and vaults/manage_position routes

* fix: swap routing issue

* fix: issue on pools/manage_liquidity route

* fix: routing issue

* feat: implement automatic wallet connect feature

* feat: improve chain auto change feature

* fix: routing issue on flashloan page

* fix: routing issue

* fix: update getPathName function

* fix: update pool routing

* fix: remove unused code

* fix: lint issue

* fix: new_position routing issue

* fix: vault/new_position routing issue

* fix: used code

* fix: vaults/manage_position issue

* fix: /vaults routing issue

* fix: routing issue on pools/manage_liquidity

* fix: update wallet auto connect feature

* fix: lint issue

* fix: default routing issue

* fix: add initial disconnect feature

* fix: remove unused code

* fix: rename inj to injective

* fix: update disconnect logic

* fix: pool loading issue

* fix: swap default token issue on testnet

* fix: error for chihuahua testnet

* fix: default token issue of new_position feature on testnet

* fix: update defaultToknes for new_position

* fix: lint issue

* fix: cosmwasm client init issue

Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Vinod Hum <[email protected]>
Co-authored-by: sencom <[email protected]>

* leap integration (#147)

* leap integration

* fix multiple connect

* fix: logic of resetWalletConnection function

* fix: conflict and lint issues

* fix: price value issue on comdex pools

* fix: wallet reconnect issue

* fix: error message

* fix: wallet connect issue from page reload

* fix: redirect issue

* fix: remove dollar sign from comdex atom pool

* cosmos station wallet added

* fix juno pool displayName

* fix terra station logo

* fix inject with cosmos station

Co-authored-by: daiki saito <[email protected]>
Co-authored-by: sencom <[email protected]>
Co-authored-by: optisman <[email protected]>
Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Chandra <[email protected]>

* feat: pool update (#157)

* feat: load pools without wallet connection

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: wallet auto connect (#142)

* feat: injective integration; Test and mainnet (#121)

* feat(inj): Start on inj integration

* feat: Add injective testnet chain_info and pools

* feat: Injective integration chain and pool; swaps not working yet

* fix: Update testnet rpc for now with one that has cors issues

* feat: Add other vaults and pools

* working simulation on injective

* feat: updates for injective client integration; also run prettier

* feat:injective poc, frontend not working yet but a tx was done

* injective added

* fix:inj to cw20 direct

* fix: Inj to cw20 direct, cw20 to inj and router txes

* fix: fix: multiple messages in post, cw20 swap

* feat: Prep for injective mainnet

* feat: Injective Mainnet info; swaps working, withdraw lp, balances

* fix: Provide and withdraw LP now working

* fix: Update DEFAULT_GAS to 2million

* fix: Remove injective poc stuff

* fix: reduce gas limit

* fixed swp rate message and injective catch error

* fix few issues listed in slack

* fix: Update decimal conversion on provide lp

* fix funds issue on LP

* clean console and fix  banner and loading state

* fix depost message on vault

* coming soon, coinhall and atom price off fix

* fix mange lp cta cutting off

* fix flashloan on injective

* fix: Update codeowners, there needs to be two

* fix: Run prettier to fixup code

Co-authored-by: Vinod Hum <[email protected]>

* feat: add mobile not support modal on mobile devices (#140)

* feat: add price field on injective pools (#141)

* feat: add price field on injective pools

* feat: add dollar sign

* feat: load pools without wallet connection

* fix: remove duplicated coinhall api call

* fix: infinite loop issue on pools page

* fix: minor issue

* chore: fix codeowners

* fix: lp asset issue on new position form (#131)

* fix: lp asset issue on new position form

* fix: wrong pool_id handing on manage_liquidity page

* fix: lint issue

* fix: style issue

* fix: style issue

* feat: add chain info on flash loan page

* feat: add chain info on flashloan page

* feat: add routes with chain info for swap and flashloan pages

* feat: add chain info on vault new_position and manage_position routes

* feat: fix lint and style issues

* chore: fix lint and style issue

* fix: implement dynamic routing from chain change

* fix: route redirection issue on vault depositForm

* chore: add / in vault routes

* fix: vault route redirection issue with chain info

* fix: routing issue on vaults/new_position and vaults/manage_position routes

* fix: swap routing issue

* fix: issue on pools/manage_liquidity route

* fix: routing issue

* feat: implement automatic wallet connect feature

* feat: improve chain auto change feature

* fix: routing issue on flashloan page

* fix: routing issue

* fix: update getPathName function

* fix: update pool routing

* fix: remove unused code

* fix: lint issue

* fix: new_position routing issue

* fix: vault/new_position routing issue

* fix: used code

* fix: vaults/manage_position issue

* fix: /vaults routing issue

* fix: routing issue on pools/manage_liquidity

* fix: update wallet auto connect feature

* fix: lint issue

* fix: default routing issue

* fix: add initial disconnect feature

* fix: remove unused code

* fix: rename inj to injective

* fix: update disconnect logic

* fix: pool loading issue

* fix: swap default token issue on testnet

* fix: error for chihuahua testnet

* fix: default token issue of new_position feature on testnet

* fix: update defaultToknes for new_position

* fix: lint issue

* fix: cosmwasm client init issue

Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Vinod Hum <[email protected]>
Co-authored-by: sencom <[email protected]>

* feat: add 24hr volume of injective pools

* feat: update useFeeVolume hooks

* fix: infinite loading issue

* feat: refactor to improve token price fetch

* fix: conflict issue

* feat: remove unused component

* fix: update refetchBackground mode

* fix: infinite loading issue

* fix: price issue on pools

* fix: apr/24hr volume calculation logic

Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Vinod Hum <[email protected]>
Co-authored-by: sencom <[email protected]>

* fix wallet issue (#158)

* fix wallet issue

* fix terra station

* fix: new_position routing issue (#160)

* fix: new_position route issue

* fix: prettier issue

* feat: injective apr based on dynamic swap fee (#161)

* fix: injective apr by dynamic swap fee

* feat: add assetOrder field in poollist for pair price

* fix: revert lp order of pools

* fix: update lp order of rHuahua-huahua pool

* fix: lint issue

* fix: injective keplr connection issue

* Navbar and swap card updated

* Navbar and Swap update

* fix: crashing issue (#163)

* fix: crashing issue

* fix: remove unused code

* fix: coingecko api call error handling

* fix: lint error

* feat: add token spot price calculation function

* feat: reduce cgc api call count

* fix: update subquery orderby

* Feat/station update interchain (#159)

* feat: Initial Station Wallet multichain upgrade; reading Juno balances

* wip: Working towards a working tx

* feat: Terra Station Tx working with Juno, all hardcoded needs improvements, but hey it worked; Fable woz ere

* feat: working across all chains now but only with public rest

* fix: Station no longer showing after bringing in release changes

* feat: Update useTransaction, now showing Finder Tx links again

* fix: Chevron showing on Station , keplr balances working

* fix: Injective and comdex not supported yet dont show them

* fix: Labels now working on manageliquid

* fix: continous spinning after TX

* WIP : use our REST for juno for testing

* swap, lp and vault card updated to new design

* blance slider and fix linting errors

* new desing swap and lp card

* updated pools list to new design

* feat(staking): implemented staking page

Without api calls yet

fix: removed some typos

* fix: button was nested in button

"Connect Wallet" button replaces primary button now on staking page

* feat(bonding): bonding page skeleton

Overview liquid, bonded, unbonding, withdrawable tokens with corresponding components

Rewards Component

Placeholder data

* feat(bonding): follow up commit

Missed some files

* feat(bonding): migaloo-1, narwhal-1 and belonging SC integration

Configured migaloo-1, narwhal-1 according to branch feat/migaloo frontend integration

Implemented queries and SC executions (bonding and fee-distributor contract)

Merged main

Some bug fixes

* feat(bonding): refactoring

Improved loading behavior

Minor fixes

* feat(bonding): added whale price from tfm

Added everywhere in the bonding feature

* feat(bonding): new smart contract specification integration + renaming to dashboard

Handled nanoseconds everywhere

Rewards, APR, Multiplier properly displayed

Renaming Bonding to Dashboard and removing drop down

Default Page = Dashboard

Minor fixes

* feat(bonding): refactoring, fixes

Added bonding_config.json file for all token specifications

Fixed unbonding issue

Implemented reward progressbar to be imminent until next block

Code cleanup

* fix(bonding): rewriting descriptions

Rewritten token tooltip descriptions

Changed bonding successful msg

* feat(terra support & refactorings): internal audit refactorings

Added bonding config for terra and made some adjustments for mainnet implementation

Excluded every chain except terra and narwhal

* fix(.prettierrc.json): es6->es5

* fix(epoch-start-time): changed epoch start time to genesis_epoch

* fix(unbonding-balances): displaying bonded balances instead of liquid

WhalePrice now pulled from WHALE-axlUSDC Pool instead from tfl due to unreliability

Added unbonding_request time sorting for Withdraw.tsx

* fix(bonding-asset-modal-width): extended BondingOverview.tsx width by 20px

* fix(multiple): resolved multiple issues

Withdraws -> Withdrawals

Adjusted padding of AssetInput Modal "choose token" trigger

Dashboard first in Navbar

Improved rewards progressbar by binding it to  next epoch creation and included genesis creation info

* fix(withdraw-denom): when no ampWhale to withdraw change to bWhale denom

* feat(adding tooltips): added tooltips for all bonding related actions (bond/unbond/withdraw/claim)

* fix(formatting)

* fix(formatting): ran yarn prettier "**/*.{ts,md,tsx}" --write

* fix(removing-migaloo): removed migaloo from selectable networks

---------

Co-authored-by: daiki saito <[email protected]>
Co-authored-by: sencom <[email protected]>
Co-authored-by: optisman <[email protected]>
Co-authored-by: 0xFable <[email protected]>
Co-authored-by: Vinod Hum <[email protected]>
Co-authored-by: Chandra <[email protected]>
Co-authored-by: 0xFable <[email protected]>

.prettierrc.json

@@ -1,6 +1,6 @@
 {
   "semi": false,
-  "trailingComma": "es6",
+  "trailingComma": "es5",
   "singleQuote": true,
   "tabWidth": 2,
   "useTabs": false

components/AssetInput/AssetInput.tsx

@@ -1,28 +1,10 @@
-import { FC } from 'react'
-
-import { ChevronDownIcon } from '@chakra-ui/icons'
-import {
-  Button,
-  forwardRef,
-  HStack,
-  IconButton,
-  Image,
-  Input,
-  Stack,
-  Text,
-  VStack,
-} from '@chakra-ui/react'
-// import { Asset } from 'types/blockchain'
-import FallbackImage from 'components/FallbackImage'
-import { useMultipleTokenBalance } from 'hooks/useTokenBalance'
-import { useTokenInfo } from 'hooks/useTokenInfo'
-import { useBaseTokenInfo } from 'hooks/useTokenInfo'
-import { useTokenList } from 'hooks/useTokenList'
+import { VStack, forwardRef } from '@chakra-ui/react'
+import React, { useMemo } from 'react'
+import { useTokenDollarValue } from 'hooks/useTokenDollarValue'
+import WhaleInput from './WhaleInput'
 import { num } from 'libs/num'
-
-import AssetSelectModal from './AssetSelectModal'
-import { useRecoilValue } from 'recoil'
-import { walletState } from 'state/atoms/walletAtoms'
+import { useBaseTokenInfo, useTokenInfo } from 'hooks/useTokenInfo'
+import BalanceWithMaxNHalf from './BalanceWithMax'
 
 interface AssetInputProps {
   image?: boolean
@@ -32,202 +14,90 @@ interface AssetInputProps {
   showList?: boolean
   onInputFocus?: () => void
   balance?: number
+  whalePrice?: number
   disabled?: boolean
   minMax?: boolean
   isSingleInput?: boolean
   hideToken?: string
   edgeTokenList?: string[]
   ignoreSlack?: boolean
+  hideMax?: boolean
+  hideDollarValue?: boolean
+  showBalanceSlider?: boolean
+  isBonding?: boolean
+  unbondingBalances?: { [key: string]: number }
 }
 
-const AssetInput: FC<AssetInputProps> = forwardRef(
-  (
-    {
-      image = true,
-      token,
-      balance,
-      onChange,
-      value,
-      showList = true,
-      disabled,
-      minMax = true,
-      isSingleInput = false,
-      hideToken,
-      edgeTokenList,
-      ignoreSlack = false,
-    },
-    ref
-  ) => {
-    const tokenInfo = useTokenInfo(token?.tokenSymbol)
-    const baseToken = useBaseTokenInfo()
-    const {  status } = useRecoilValue(walletState)
-    const isConnected = status === `@wallet-state/connected`
+const AssetInput = forwardRef((props: AssetInputProps, ref) => {
+  const {
+    balance,
+    disabled,
+    isSingleInput,
+    whalePrice,
+    token,
+    onChange,
+    ignoreSlack,
+    hideMax,
+    hideDollarValue,
+  } = props
+  const tokenInfo = useTokenInfo(token?.tokenSymbol)
+  const baseToken = useBaseTokenInfo()
 
-    const [tokenList] = useTokenList()
-    useMultipleTokenBalance(tokenList?.tokens?.map(({ symbol }) => symbol))
+  const onMaxClick = () => {
+    const isTokenAndBaseTokenSame = tokenInfo?.symbol === baseToken?.symbol
+    onChange({
+      ...token,
+      amount:
+        isTokenAndBaseTokenSame && !ignoreSlack
+          ? num(balance === 0 ? 0 : balance - 0.1).toFixed(6)
+          : num(balance).toFixed(6),
+    })
+  }
+  const onHalfClick = () => {
+    onChange({
+      ...token,
+      amount: num(balance === 0 ? 0 : balance / 2).toFixed(6),
+    })
+  }
+  const maxDisabled = useMemo(() => {
+    return disabled || (!isSingleInput && !tokenInfo?.symbol)
+  }, [balance, disabled, isSingleInput, tokenInfo])
 
-    return (
-      <Stack
-        direction={['column-reverse', 'row']}
-        width="full"
-        spacing={0}
-        gap={[3, 0]}
-      >
-        <HStack
-          width="full"
-          border="1px solid rgba(255, 255, 255, 0.1)"
-          borderLeftRadius="30px"
-          borderRightRadius={['30px', 'unset']}
-          height={12}
-          paddingLeft={6}
-          paddingRight={3}
-          // bg={!tokenInfo?.symbol && 'gray.800'}
-        >
-          <HStack flex={1}>
-            <Input
-              ref={ref}
-              type="number"
-              value={value?.amount || ''}
-              variant="unstyled"
-              color="brand.500"
-              placeholder="0.00"
-              disabled={disabled || (!isSingleInput && !tokenInfo?.symbol)}
-              // onFocus={onInputFocus}
-              onChange={({ target }) =>
-                onChange({ ...token, amount: target.value })
-              }
-            />
+  const numberOfTokens = useMemo(
+    () => `${token?.amount} ${token?.tokenSymbol}`,
+    [token]
+  )
 
-            {minMax && (
-              <HStack visibility={{ base: 'hidden', md: 'visible' }}>
-                <Button
-                  disabled={disabled || !isConnected || (!isSingleInput && !tokenInfo?.symbol)}
-                  variant="outline"
-                  size="xs"
-                  onClick={() =>
-                    onChange({
-                      ...token,
-                      amount: num(balance / 2).toFixed(6),
-                    })
-                  }
-                >
-                  half
-                </Button>
-                <Button
-                  disabled={disabled || !isConnected  || (!isSingleInput && !tokenInfo?.symbol)}
-                  variant="outline"
-                  size="xs"
-                  onClick={() =>
-                    onChange({
-                      ...token,
-                      amount:
-                        tokenInfo?.symbol === baseToken?.symbol && !ignoreSlack
-                          ? num(balance - 0.1).toFixed(6)
-                          : num(balance).toFixed(6),
-                    })
-                  }
-                >
-                  max
-                </Button>
-              </HStack>
-            )}
-          </HStack>
-        </HStack>
+  const [tokenPrice] =
+    whalePrice !== null ? [whalePrice] : useTokenDollarValue(token?.tokenSymbol)
 
-        <HStack
-          // minWidth="180px"
-          width={['full', '180px']}
-          border="1px solid rgba(255, 255, 255, 0.1)"
-          borderRightRadius="30px"
-          borderLeftRadius={['30px', 'unset']}
-          height={12}
-          paddingX={2}
-          justifyContent={'flex-end'}
-        >
-          <HStack flex={1}>
-            {showList ? (
-              <AssetSelectModal
-                onChange={onChange}
-                currentToken={[tokenInfo?.symbol || hideToken]}
-                edgeTokenList={edgeTokenList}
-                disabled={disabled}
-                amount={token.amount}
-              >
-                {tokenInfo?.symbol ? (
-                  <HStack pl={[4, 0]} gap={[1]}>
-                    {image && (
-                      <Image
-                        width="auto"
-                        minW="1.5rem"
-                        maxW="1.5rem"
-                        maxH="1.5rem"
-                        style={{ margin: 'unset' }}
-                        src={tokenInfo?.logoURI}
-                        alt="logo-small"
-                        // boxSize="2.5rem"
-                        fallback={<FallbackImage />}
-                      />
-                    )}
-                    <Text fontSize="16px" fontWeight="400">
-                      {tokenInfo?.symbol || 'Select Token'}
-                    </Text>
-                  </HStack>
-                ) : (
-                  <Text
-                    paddingLeft="10px"
-                    fontSize="18px"
-                    fontWeight="400"
-                    color="brand.50"
-                  >
-                    {tokenInfo?.symbol || 'Select Token'}
-                  </Text>
-                )}
+  const dollarValue = useMemo(() => {
+    return num(tokenPrice).times(token?.amount).dp(6).toString()
+  }, [tokenPrice, token?.amount])
 
-                <IconButton
-                  disabled={disabled}
-                  margin="unset"
-                  variant="unstyled"
-                  color="white"
-                  aria-label="go back"
-                  icon={<ChevronDownIcon />}
-                  style={{ margin: 'unset' }}
-                />
-              </AssetSelectModal>
-            ) : (
-              <HStack
-                justifyContent="flex-start"
-                width={['full', 'fit-content']}
-                sx={{ button: { margin: 'unset' } }}
-                pl={[4, 0]}
-                gap={[1]}
-                // paddingX={3}
-                // style={{ margin: "unset" }}
-              >
-                {image && (
-                  <Image
-                    style={{ margin: 'unset' }}
-                    maxH={{ base: 5, md: 7 }}
-                    src={tokenInfo?.logoURI}
-                    alt="logo-small"
-                    // boxSize="2.5rem"
-                    fallback={<FallbackImage />}
-                  />
-                )}
+  const balanceWithDecimals = useMemo(
+    () =>
+      num(balance)
+        .dp(token?.decimals || 6)
+        .toString(),
+    [balance, token?.decimals]
+  )
 
-                <Text
-                  paddingLeft={!image && '10px'}
-                  fontSize="16px"
-                  fontWeight="400"
-                >
-                  {tokenInfo?.symbol || token?.tokenSymbol}
-                </Text>
-              </HStack>
-            )}
-          </HStack>
-        </HStack>
-      </Stack>
-    )
-  }
-)
+  return (
+    <VStack width="full">
+      <WhaleInput {...props} />
+      <BalanceWithMaxNHalf
+        balance={balanceWithDecimals}
+        hideDollarValue={hideDollarValue}
+        numberOfTokens={numberOfTokens}
+        dollarValue={dollarValue}
+        maxDisabled={maxDisabled}
+        hideMax={hideMax}
+        onMaxClick={onMaxClick}
+        onHalfClick={onHalfClick}
+      />
+    </VStack>
+  )
+})
 
 export default AssetInput

components/AssetInput/AssetList.tsx

@@ -1,18 +1,23 @@
 import { FC, useMemo } from 'react'
 
-import { background, Box, Button, HStack, Image, Text } from '@chakra-ui/react'
+import { Box, Button, HStack, Image, Text } from '@chakra-ui/react'
 import FallbackImage from 'components/FallbackImage'
 import useFilter from 'hooks/useFilter'
 import { useMultipleTokenBalance } from 'hooks/useTokenBalance'
 import { useTokenList } from 'hooks/useTokenList'
+import {
+  AMP_WHALE_TOKEN_SYMBOL,
+  B_WHALE_TOKEN_SYMBOL,
+} from 'constants/bonding_contract'
 
 type AssetListProps = {
-  // assetList?: Asset[];
   onChange: (token: any, isTokenChange?: boolean) => void
   search: string
   currentToken: string[]
   edgeTokenList: string[]
   amount?: number
+  isBonding?: boolean
+  unbondingBalances?: { [key: string]: number }
 }
 
 const AssetList: FC<AssetListProps> = ({
@@ -21,17 +26,26 @@ const AssetList: FC<AssetListProps> = ({
   currentToken = [],
   amount,
   edgeTokenList = [],
+  isBonding = false,
+  unbondingBalances = null,
 }) => {
   const [tokenList] = useTokenList()
 
-  const [tokenBalance = []] = useMultipleTokenBalance(
-    tokenList?.tokens?.map(({ symbol }) => symbol)
-  )
+  const tokens = isBonding
+    ? tokenList.tokens.filter((t) =>
+        [AMP_WHALE_TOKEN_SYMBOL, B_WHALE_TOKEN_SYMBOL].includes(t.symbol)
+      )
+    : tokenList.tokens
+
+  const [tokenBalance = []] =
+    unbondingBalances !== null
+      ? [tokens?.map(({ symbol }) => unbondingBalances[symbol])]
+      : useMultipleTokenBalance(tokens?.map(({ symbol }) => symbol))
 
   const tokensWithBalance = useMemo(() => {
-    if (tokenBalance.length == 0) return tokenList?.tokens
+    if (tokenBalance.length == 0) return tokens
 
-    return tokenList?.tokens
+    return tokens
       ?.map((token, index) => ({
         ...token,
         balance: tokenBalance?.[index],