Support for new liquidity provider (tonco)

cypress/e2e/base.cy.ts

@@ -1,48 +1,48 @@
-describe("swap tests", () => {
+describe('swap tests', () => {
     beforeEach(() => {
         cy.visit(
-            "http://localhost:6006/iframe.html?args=&globals=&id=components-swap--default&viewMode=story"
+            'http://localhost:6006/iframe.html?args=&globals=&id=components-swap--default&viewMode=story'
         );
     });
-    it("should be able to swap ston with right dex", () => {
+    it('should be able to swap ston with right dex', () => {
         cy.get("[data-testid='card-button-receive']").click();
-        cy.get("[data-testid='dialog-search-input']").type("STON");
+        cy.get("[data-testid='dialog-search-input']").type('STON');
         cy.get(
             "[data-testid='EQA2kCVNwVsil2EM2mB0SkXytxCqQjS4mttjDpnXmwG9T6bO']"
         ).click();
-        cy.get("[data-testid='swapcard-input-pay']").type("100");
+        cy.get("[data-testid='swapcard-input-pay']").type('100');
         cy.get("[data-testid='swap-details']").click();
         cy.get("[data-testid='dex-container']").should(
-            "contain.text",
-            "Ston.fi"
+            'contain.text',
+            'StonFi'
         );
     });
-    it("should be able to swap scale with right dex", () => {
+    it('should be able to swap scale with right dex', () => {
         cy.get("[data-testid='card-button-receive']").click();
-        cy.get("[data-testid='dialog-search-input']").type("SCALE");
+        cy.get("[data-testid='dialog-search-input']").type('SCALE');
         cy.get(
             "[data-testid='EQBlqsm144Dq6SjbPI4jjZvA1hqTIP3CvHovbIfW_t-SCALE']"
         ).click();
-        cy.get("[data-testid='swapcard-input-pay']").type("100");
+        cy.get("[data-testid='swapcard-input-pay']").type('100');
         cy.get("[data-testid='swap-details']").click();
         cy.get("[data-testid='dex-container']").should(
-            "contain.text",
-            "Dedust"
+            'contain.text',
+            'Dedust'
         );
     });
-    it("output should get price impact when input amount is too high", () => {
+    it('output should get price impact when input amount is too high', () => {
         cy.get("[data-testid='card-button-receive']").click();
-        cy.get("[data-testid='dialog-search-input']").type("SCALE");
+        cy.get("[data-testid='dialog-search-input']").type('SCALE');
         cy.get(
             "[data-testid='EQBlqsm144Dq6SjbPI4jjZvA1hqTIP3CvHovbIfW_t-SCALE']"
         ).click();
-        cy.get("[data-testid='swapcard-input-pay']").type("10000");
+        cy.get("[data-testid='swapcard-input-pay']").type('10000');
         cy.get("[data-testid='swap-details']").click();
         cy.wait(1000);
         cy.get("[data-testid='price-impact']")
-            .invoke("text")
+            .invoke('text')
             .then((text) => {
-                const impact = parseFloat(text.replace("%", ""));
+                const impact = parseFloat(text.replace('%', ''));
                 expect(impact).to.be.greaterThan(90);
             });
     });

lib/components/Swap/Swap.scss

@@ -25,6 +25,7 @@
     button {
         cursor: pointer;
         border: none;
+        background: transparent;
         font-family: Inter, sans-serif;
     }
     input {

lib/components/Swap/Swap.stories.tsx

@@ -150,6 +150,21 @@ export const WithAppId: Story = {
     ],
 };
 
+export const WithLiquidityProvider: Story = {
+    args: {
+        options: {
+            liquidity_provider: 'dedust',
+        },
+    },
+    decorators: [
+        (Story) => (
+            <div className="mts-ton-jiggle">
+                <Story />
+            </div>
+        ),
+    ],
+};
+
 export const HideSwapDetail: Story = {
     args: {
         options: {

lib/components/SwapCard/CardDialog.tsx

@@ -177,26 +177,33 @@ const CardDialog: FC<CardDialogProps> = ({
         onNextPage(1);
     };
 
-    const filteredAssets = assetList
-        ? assetList
-              .sort(sortAssets)
-              .filter((item) => {
-                  if (
-                      searchInput.toLowerCase() === 'usdt' &&
-                      item.symbol === 'USD₮'
-                  ) {
-                      return true;
-                  }
-                  const searchValue = searchInput.toLowerCase();
+    const filteredAssets =
+        assetList
+            ?.sort(sortAssets)
+            .filter((item) => {
+                const searchValue = searchInput.toLowerCase();
 
-                  return (
-                      item.name.toLowerCase().includes(searchValue) ||
-                      item.symbol.toLowerCase().includes(searchValue) ||
-                      item.address.includes(searchInput)
-                  );
-              })
-              .filter((item) => (communityTokens ? true : !item.warning))
-        : [];
+                if (searchValue === 'usdt' && item.symbol === 'USD₮') {
+                    return true;
+                }
+
+                let addressSearch = '';
+                try {
+                    addressSearch = address(searchInput).toString({
+                        bounceable: true,
+                    });
+                } catch {
+                    // Ignore invalid address
+                }
+
+                return (
+                    item.name.toLowerCase().includes(searchValue) ||
+                    item.symbol.toLowerCase().includes(searchValue) ||
+                    (addressSearch.length > 0 &&
+                        item.address.includes(addressSearch))
+                );
+            })
+            .filter((item) => (communityTokens ? true : !item.warning)) || [];
 
     const handleOnClose = () => {
         setIsSelectVisible(false);

lib/store/events.store.ts

@@ -1,22 +1,22 @@
-import { Asset } from "@mytonswap/sdk";
-import { create } from "zustand";
+import { Asset } from '@mytonswap/sdk';
+import { create } from 'zustand';
 
 export type onSwap = {
-    type: "start" | "success" | "error";
+    type: 'start' | 'success' | 'error';
     data: {
         pay: Asset;
         receive: Asset;
         pay_amount: string;
         receive_amount: string;
         pay_rate: number;
         receive_rate: number;
-        dex: "stonfi" | "dedust";
+        dex: 'stonfi' | 'dedust' | 'tonco';
         hash: string;
     };
 };
 
 export type onTokenSelect = {
-    type: "pay" | "receive";
+    type: 'pay' | 'receive';
     asset: Asset;
 };
 
@@ -29,11 +29,11 @@ type EventsActions = {
 
 export const useEventsStore = create<EventsActions>((set) => ({
     onTokenSelect: (data) => {
-        console.log("default onTokenSelect called");
+        console.log('default onTokenSelect called');
         console.log(data);
     },
     onSwap: (data) => {
-        console.log("default onSwap called");
+        console.log('default onSwap called');
         console.log(data);
     },
     setOnTokenSelect: (onTokenSelect) => {

lib/store/options.store.ts

@@ -1,7 +1,10 @@
-import { create } from "zustand";
-import { defaultsDeep } from "lodash";
-import { TonConnectUI } from "@tonconnect/ui-react";
-import { useSwapStore } from "./swap.store";
+import { create } from 'zustand';
+import { defaultsDeep } from 'lodash';
+import { TonConnectUI } from '@tonconnect/ui-react';
+import { useSwapStore } from './swap.store';
+import { MyTonSwapClient } from '@mytonswap/sdk';
+import { WIDGET_VERSION } from '../constants';
+import { useWalletStore } from './wallet.store';
 
 export type SwapOptions = {
     default_pay_token?: string;
@@ -13,7 +16,13 @@ export type SwapOptions = {
     default_pay_amount?: string;
     pin_tokens?: string[];
     app_id?: string;
-    layout_direction?: "ltr" | "rtl";
+    liquidity_provider?:
+        | 'mytonswap'
+        | 'stonfi'
+        | 'dedust'
+        | 'tonco'
+        | 'omniston';
+    layout_direction?: 'ltr' | 'rtl';
     ui_preferences?: {
         disable_provided_text?: boolean;
         show_swap_details?: boolean;
@@ -41,6 +50,7 @@ export const useOptionsStore = create<SwapOptionsActions & SwapOptionsStates>(
     (set, get) => ({
         tonConnectInstance: null,
         options: {
+            liquidity_provider: 'mytonswap',
             ui_preferences: {
                 disable_provided_text: false,
                 disable_token_select_pay: false,
@@ -67,6 +77,24 @@ export const useOptionsStore = create<SwapOptionsActions & SwapOptionsStates>(
             if (option.default_slippage) {
                 useSwapStore.getState().setSlippage(option.default_slippage);
             }
+            if (option.liquidity_provider) {
+                useSwapStore.setState({
+                    client: new MyTonSwapClient({
+                        headers: {
+                            'widget-version': WIDGET_VERSION,
+                            'liquidity-provider': option.liquidity_provider,
+                        },
+                    }),
+                });
+                useWalletStore.setState({
+                    client: new MyTonSwapClient({
+                        headers: {
+                            'widget-version': WIDGET_VERSION,
+                            'liquidity-provider': option.liquidity_provider,
+                        },
+                    }),
+                });
+            }
         },
         setTonConnectInstance: (instance) => {
             if (get().tonConnectInstance) return;

lib/store/swap.store.ts

@@ -71,8 +71,9 @@ type SwapActions = {
 
 export const useSwapStore = create<SwapActions & SwapStates>((set, get) => ({
     client: new MyTonSwapClient({
-        baseUrl: 'https://devtest.mytonswap.com/api/',
-        headers: { 'widget-version': WIDGET_VERSION },
+        headers: {
+            'widget-version': WIDGET_VERSION,
+        },
     }),
     refetchInterval: null,
     pay_token: null,

lib/store/wallet.store.ts

@@ -21,8 +21,9 @@ type WalletActions = {
 export const useWalletStore = create<WalletActions & WalletStates>(
     (set, get) => ({
         client: new MyTonSwapClient({
-            headers: { 'widget-version': WIDGET_VERSION },
-            baseUrl: 'https://devtest.mytonswap.com/api/',
+            headers: {
+                'widget-version': WIDGET_VERSION,
+            },
         }),
         wallet: null,
         walletConnected: false,

lib/utils/swap.ts

@@ -18,8 +18,9 @@ export default async function swap(
     bestRoute: BestRoute
 ) {
     const client = new MyTonSwapClient({
-        headers: { 'widget-version': WIDGET_VERSION },
-        baseUrl: 'https://devtest.mytonswap.com/api/',
+        headers: {
+            'widget-version': WIDGET_VERSION,
+        },
     });
     const app_id = useOptionsStore.getState().options.app_id;
     const rawMessageResult = await catchError(() =>