Mainnet hotfix (#630)

* fix: fix the trade interface

* fix: z-index adjustment

* fix: z-index on trade

* fix: header z-index

src/components/Header/DesktopHeader.tsx

@@ -36,7 +36,7 @@ export default function DesktopHeader() {
   return (
     <header
       className={classNames(
-        'fixed left-0 top-0 z-30 hidden w-full',
+        'fixed left-0 top-0 z-50 hidden w-full',
         'before:content-[" "] before:absolute before:inset-0 before:-z-1 before:h-full before:w-full before:rounded-sm before:backdrop-blur-sticky',
         'lg:block',
       )}

src/components/TokenInput/index.tsx

@@ -54,7 +54,7 @@ export default function TokenInput(props: Props) {
       <div
         data-testid='token-input-wrapper'
         className={classNames(
-          'relative isolate z-40 box-content flex h-11 w-full rounded-sm border bg-white/5',
+          'relative isolate z-20 box-content flex h-11 w-full rounded-sm border bg-white/5',
           props.warning ? 'border-warning' : 'border-white/20',
         )}
       >

src/components/Trade/TradeChart/DataFeed.ts

@@ -83,7 +83,7 @@ export class DataFeed implements IDatafeedChartApi {
     const denom2 = pairName.split(PAIR_SEPARATOR)[1]
     const asset1 = ASSETS.find(byDenom(denom1))
     const asset2 = ASSETS.find(byDenom(denom2))
-    return `${asset1?.symbol}/${asset2?.symbol}`
+    return `${asset2?.symbol}/${asset1?.symbol}`
   }
 
   async getPairsWithData() {

src/components/Trade/TradeChart/TVChartContainer.tsx

@@ -21,7 +21,7 @@ export const TVChartContainer = (props: Props) => {
   const chartContainerRef = useRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>
   const widgetRef = useRef<IChartingLibraryWidget>()
   const defaultSymbol = useRef<string>(
-    `${props.sellAsset.mainnetDenom}${PAIR_SEPARATOR}${props.buyAsset.mainnetDenom}`,
+    `${props.sellAsset.denom}${PAIR_SEPARATOR}${props.buyAsset.denom}`,
   )
   const baseCurrency = useStore((s) => s.baseCurrency)
   const dataFeed = useMemo(
@@ -94,12 +94,12 @@ export const TVChartContainer = (props: Props) => {
   useEffect(() => {
     if (widgetRef?.current) {
       widgetRef.current.setSymbol(
-        `${props.sellAsset.mainnetDenom}${PAIR_SEPARATOR}${props.buyAsset.mainnetDenom}`,
+        `${props.sellAsset.denom}${PAIR_SEPARATOR}${props.buyAsset.denom}`,
         widgetRef.current.chart().resolution() || ('1h' as ResolutionString),
         () => {},
       )
     }
-  }, [props.buyAsset.mainnetDenom, props.sellAsset.mainnetDenom])
+  }, [props.buyAsset.denom, props.sellAsset.denom])
 
   return (
     <Card title='Trading Chart' contentClassName='px-0.5 pb-0.5 h-full'>

src/components/Trade/TradeModule/SwapForm/index.tsx

@@ -271,8 +271,9 @@ export default function SwapForm(props: Props) {
     () =>
       sellAssetAmount.isZero() ||
       depositCapReachedCoins.length > 0 ||
-      borrowAmount.isGreaterThanOrEqualTo(availableLiquidity),
+      borrowAmount.isGreaterThan(availableLiquidity) ||
-    [sellAssetAmount, depositCapReachedCoins, borrowAmount, availableLiquidity],
+      route.length === 0,
+    [sellAssetAmount, depositCapReachedCoins, borrowAmount, availableLiquidity, route],
   )
 
   return (
@@ -333,7 +334,7 @@ export default function SwapForm(props: Props) {
           sellAsset={sellAsset}
           borrowRate={borrowAsset?.borrowRate}
           buyAction={handleBuyClick}
-          buyButtonDisabled={isSwapDisabled || route.length === 0}
+          buyButtonDisabled={isSwapDisabled}
           showProgressIndicator={isConfirming || isRouteLoading}
           isMargin={isMarginChecked}
           borrowAmount={borrowAmount}

src/components/Trade/TradeModule/index.tsx

@@ -14,7 +14,7 @@ export default function TradeModule(props: Props) {
   return (
     <div
       className={classNames(
-        'relative isolate max-w-full overflow-hidden rounded-base pb-4 z-50',
+        'relative isolate max-w-full overflow-hidden rounded-base pb-4 z-30',
         'before:content-[" "] before:absolute before:inset-0 before:-z-1 before:rounded-base before:p-[1px] before:border-glas',
         'h-full',
       )}

src/pages/TradePage.tsx

@@ -39,7 +39,7 @@ export default function TradePage() {
       </div>
       {assetOverlayState !== 'closed' && (
         <div
-          className='fixed top-0 left-0 z-40 block w-full h-full hover:cursor-pointer'
+          className='fixed top-0 left-0 z-20 block w-full h-full hover:cursor-pointer'
           onClick={() => useStore.setState({ assetOverlayState: 'closed' })}
           role='button'
         />