chore: prepare swaps for transfer v2 release (#2339)

Author: mateuszjasiuk

apps/namadillo/src/App/AppRoutes.tsx

@@ -36,7 +36,6 @@ import { StakingOverview } from "./Staking/StakingOverview";
 import { StakingRewards } from "./Staking/StakingRewards";
 import { StakingWithdrawModal } from "./Staking/StakingWithdrawModal";
 import { Unstake } from "./Staking/Unstake";
-import { SwapModule } from "./Swap/SwapModule";
 import { SwitchAccountPanel } from "./SwitchAccount/SwitchAccountPanel";
 import { TransactionDetails } from "./Transactions/TransactionDetails";
 import { TransactionHistory } from "./Transactions/TransactionHistory";
@@ -101,7 +100,8 @@ export const MainRoutes = (): JSX.Element => {
           </Route>
 
           {/* Swapping */}
-          <Route path={routes.swap} element={<SwapModule />} />
+          {/* TODO: Re-enable swaps after v2 release */}
+          {/* <Route path={routes.swap} element={<SwapModule />} /> */}
 
           {/* Transaction History */}
           {(features.namTransfersEnabled || features.ibcTransfersEnabled) && (

apps/namadillo/src/App/Layout/Navigation.tsx

@@ -1,6 +1,5 @@
 import { SidebarMenuItem } from "App/Common/SidebarMenuItem";
 import { ShieldIcon } from "App/Icons/ShieldIcon";
-import { SwapIcon } from "App/Icons/SwapIcon";
 import { routes } from "App/routes";
 import { applicationFeaturesAtom } from "atoms/settings";
 import { useAtomValue } from "jotai";
@@ -41,11 +40,12 @@ export const Navigation = (): JSX.Element => {
       icon: <LuArrowDownToLine />,
       url: routes.receive,
     },
-    {
-      label: "Swap",
-      icon: <SwapIcon className="w-[18px]" />,
-      url: routes.swap,
-    },
+    // TODO: Re-enable swaps after v2 release
+    // {
+    //   label: "Swap",
+    //   icon: <SwapIcon className="w-[18px]" />,
+    //   url: routes.swap,
+    // },
     {
       label: "Staking",
       icon: <GoStack />,

apps/namadillo/src/App/Swap/SwapCalculations.tsx

@@ -1,7 +1,6 @@
 import { ActionButton, Stack } from "@namada/components";
 import { mapUndefined } from "@namada/utils";
 import { ConnectProviderButton } from "App/Common/ConnectProviderButton";
-import { SelectAssetModal } from "App/Common/SelectAssetModal";
 import { SelectWalletModal } from "App/Common/SelectWalletModal";
 import { TransactionFeeButton } from "App/Common/TransactionFeeButton";
 import { SwapArrowsIcon } from "App/Icons/SwapArrowsIcon";
@@ -21,7 +20,6 @@ import { getChainFromAddress } from "integrations/utils";
 import { useAtom, useAtomValue, useSetAtom } from "jotai";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { toDisplayAmount } from "utils";
-import { SwapSource } from "./SwapSource";
 import {
   useSwapBuyAmount,
   useSwapSellAmount,
@@ -34,6 +32,8 @@ import {
   swapStateAtom,
   swapStatusAtom,
 } from "./state/atoms";
+import { SwapSelectAssetModal } from "./SwapSelectAssetModal";
+import { SwapSource } from "./SwapSource";
 
 const ValidationMessages: Record<string, string> = {
   NoSellAssetSelected: "Select a token to sell",
@@ -272,7 +272,7 @@ export const SwapCalculations = (): JSX.Element => {
       </Stack>
 
       {sellAssetSelectorModalOpen && shieldedAccountAddress && (
-        <SelectAssetModal
+        <SwapSelectAssetModal
           onClose={() => setSellAssetSelectorModalOpen(false)}
           assets={sortedAssets}
           balances={balances}
@@ -281,7 +281,7 @@ export const SwapCalculations = (): JSX.Element => {
         />
       )}
       {buyAssetSelectorModalOpen && shieldedAccountAddress && (
-        <SelectAssetModal
+        <SwapSelectAssetModal
           onClose={() => setBuyAssetSelectorModalOpen(false)}
           assets={sortedAssets}
           balances={balances}

…illo/src/App/Common/SelectAssetModal.tsx …lo/src/App/Swap/SwapSelectAssetModal.tsxapps/namadillo/src/App/Common/SelectAssetModal.tsx renamed to apps/namadillo/src/App/Swap/SwapSelectAssetModal.tsx apps/namadillo/src/App/Common/SelectAssetModal.tsx renamed to apps/namadillo/src/App/Swap/SwapSelectAssetModal.tsx

@@ -23,7 +23,7 @@ type SelectWalletModalProps = {
   balances?: Record<Address, [DisplayAmount, FiatAmount?]>;
 };
 
-export const SelectAssetModal = ({
+export const SwapSelectAssetModal = ({
   onClose,
   onSelect,
   assets,
@@ -37,11 +37,20 @@ export const SelectAssetModal = ({
   const [filter, setFilter] = useState("");
 
   const { assetsWithBalance, assetsWithoutBalance } = useMemo(() => {
-    const filtered = assets.filter(
-      (asset) =>
-        asset.name.toLowerCase().indexOf(filter.toLowerCase()) >= 0 ||
-        asset.symbol.toLowerCase().indexOf(filter.toLowerCase()) >= 0
-    );
+    const filtered = assets
+      .filter(
+        (asset) =>
+          asset.name.toLowerCase().indexOf(filter.toLowerCase()) >= 0 ||
+          asset.symbol.toLowerCase().indexOf(filter.toLowerCase()) >= 0
+      )
+      // We temporarily hide stride assets until we support them fully
+      .filter(
+        (asset) =>
+          !asset.traces?.find(
+            (trace) =>
+              trace.type === "ibc" && trace.counterparty.chain_name === "stride"
+          )
+      );
 
     const withBalance: Asset[] = [];
     const withoutBalance: Asset[] = [];

…mmon/__tests__/SelectAssetModal.test.tsx …Swap/__tests__/SelectAssetModal.test.tsxapps/namadillo/src/App/Common/__tests__/SelectAssetModal.test.tsx renamed to apps/namadillo/src/App/Swap/__tests__/SelectAssetModal.test.tsx apps/namadillo/src/App/Common/__tests__/SelectAssetModal.test.tsx renamed to apps/namadillo/src/App/Swap/__tests__/SelectAssetModal.test.tsx

@@ -1,6 +1,6 @@
 import { fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { assetMockList } from "../__mocks__/assets";
-import { SelectAssetModal } from "../SelectAssetModal";
+import { assetMockList } from "App/Common/__mocks__/assets";
+import { SwapSelectAssetModal } from "../SwapSelectAssetModal";
 
 jest.mock("hooks/useIsChannelInactive", () => ({
   useIsChannelInactive: jest.fn(() => ({
@@ -9,14 +9,14 @@ jest.mock("hooks/useIsChannelInactive", () => ({
   })),
 }));
 
-describe("SelectAssetModal", () => {
+describe("SwapSelectAssetModal", () => {
   const onCloseMock = jest.fn();
   const onSelectMock = jest.fn();
   const mockAddress = "cosmos1xnu3p06fkke8hnl7t83hzhggrca59syf0wjqgh";
 
   it("should render the modal title", () => {
     render(
-      <SelectAssetModal
+      <SwapSelectAssetModal
         onClose={onCloseMock}
         onSelect={onSelectMock}
         assets={assetMockList}
@@ -28,7 +28,7 @@ describe("SelectAssetModal", () => {
 
   it("should render all assets", () => {
     render(
-      <SelectAssetModal
+      <SwapSelectAssetModal
         onClose={onCloseMock}
         onSelect={onSelectMock}
         assets={assetMockList}
@@ -41,7 +41,7 @@ describe("SelectAssetModal", () => {
 
   it("should filter assets based on search input", async () => {
     render(
-      <SelectAssetModal
+      <SwapSelectAssetModal
         onClose={onCloseMock}
         onSelect={onSelectMock}
         assets={assetMockList}
@@ -61,7 +61,7 @@ describe("SelectAssetModal", () => {
 
   it("should call onSelect and onClose when an asset is selected", () => {
     render(
-      <SelectAssetModal
+      <SwapSelectAssetModal
         onClose={onCloseMock}
         onSelect={onSelectMock}
         assets={assetMockList}

apps/namadillo/src/hooks/useTransactionCallbacks.tsx

@@ -55,6 +55,9 @@ export const useTransactionCallback = (): void => {
     shouldUpdateBalance(true);
     refetchBalances();
     refetchShieldedBalance();
+
+    const timePolling = 6 * 1000;
+    setTimeout(() => shouldUpdateBalance(false), timePolling);
   };
 
   const onTransferError = (e: CustomEvent<TransferTransactionData>): void => {