@rango-dev/widget-embedded 0.1.11-next.0 → 0.1.11-next.4

package/src/pages/SelectTokenPage.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { TokenSelector } from '@rango-dev/ui';
 import { useBestRouteStore } from '../store/bestRoute';
-import { Token } from 'rango-sdk';
+import { Asset, Token } from 'rango-sdk';
 import { useNavigateBack } from '../hooks/useNavigateBack';
 import { navigationRoutes } from '../constants/navigationRoutes';
 import { tokensAreEqual } from '../utils/wallets';
@@ -9,7 +9,7 @@ import { useMetaStore } from '../store/meta';
 
 interface PropTypes {
   type: 'from' | 'to';
-  supportedTokens: 'all' | Token[];
+  supportedTokens?: Asset[];
 }
 
 export interface TokenWithBalance extends Token {
@@ -25,23 +25,21 @@ export function SelectTokenPage(props: PropTypes) {
   const { type, supportedTokens } = props;
   const sourceTokens = useBestRouteStore.use.sourceTokens();
   const destinationTokens = useBestRouteStore.use.destinationTokens();
-  const supportedSourceTokens =
-    supportedTokens === 'all'
-      ? sourceTokens
-      : sourceTokens.filter((token) =>
-          supportedTokens.some((supportedToken) =>
-            tokensAreEqual(supportedToken, token)
-          )
-        );
+  const supportedSourceTokens = supportedTokens
+    ? sourceTokens.filter((token) =>
+        supportedTokens.some((supportedToken) =>
+          tokensAreEqual(supportedToken, token)
+        )
+      )
+    : sourceTokens;
 
-  const supportedDestinationTokens =
-    supportedTokens === 'all'
-      ? destinationTokens
-      : destinationTokens.filter((token) =>
-          supportedTokens.some((supportedToken) =>
-            tokensAreEqual(supportedToken, token)
-          )
-        );
+    const supportedDestinationTokens = supportedTokens
+    ? destinationTokens.filter((token) =>
+        supportedTokens.some((supportedToken) =>
+          tokensAreEqual(supportedToken, token)
+        )
+      )
+    : destinationTokens;
 
   const fromToken = useBestRouteStore.use.fromToken();
   const toToken = useBestRouteStore.use.toToken();

package/src/pages/SettingsPage.tsx

@@ -5,7 +5,6 @@ import { useMetaStore } from '../store/meta';
 import { useNavigate } from 'react-router-dom';
 import { navigationRoutes } from '../constants/navigationRoutes';
 import { removeDuplicateFrom } from '../utils/common';
-import { Source } from '../types';
 import {
   MAX_SLIPPAGE,
   MIN_SLIPPGAE,
@@ -13,7 +12,7 @@ import {
 } from '../constants/swapSettings';
 import { useNavigateBack } from '../hooks/useNavigateBack';
 interface PropTypes {
-  supportedSwappers: 'all' | Source[];
+  supportedSwappers?: string[];
 }
 export function SettingsPage({ supportedSwappers }: PropTypes) {
   const slippage = useSettingsStore.use.slippage();
@@ -45,8 +44,6 @@ export function SettingsPage({ supportedSwappers }: PropTypes) {
     .find((s) => {
       if (s) {
         for (const type of s.types) {
-          if (supportedSwappers !== 'all') {
-          }
           uniqueSwappersGroups.push({
             title: s.swapperGroup,
             logo: s.logo,
@@ -56,23 +53,16 @@ export function SettingsPage({ supportedSwappers }: PropTypes) {
         }
       }
     });
-  supportedSwappers !== 'all' &&
+  supportedSwappers &&
     uniqueSwappersGroups.filter(
-      (item) =>
-        supportedSwappers.filter(
-          (s) => s.title === item.title && s.type === item.type
-        ).length > 0
+      (item) => supportedSwappers.filter((s) => s === item.title).length > 0
     );
 
-  const supportedUniqueSwappersGroups =
-    supportedSwappers !== 'all'
-      ? uniqueSwappersGroups.filter(
-          (item) =>
-            supportedSwappers.filter(
-              (s) => s.title === item.title && s.type === item.type
-            ).length > 0
-        )
-      : uniqueSwappersGroups;
+  const supportedUniqueSwappersGroups = supportedSwappers
+    ? uniqueSwappersGroups.filter(
+        (item) => supportedSwappers.filter((s) => s === item.title).length > 0
+      )
+    : uniqueSwappersGroups;
 
   return (
     <Settings

package/src/pages/SwapDetailsPage.tsx

@@ -4,7 +4,7 @@ import useCopyToClipboard from '../hooks/useCopyToClipboard';
 import { useManager } from '@rango-dev/queue-manager-react';
 import { useNavigateBack } from '../hooks/useNavigateBack';
 import { getPendingSwaps } from '../utils/queue';
-import { SwapHistory } from '@rango-dev/ui';
+import { SwapHistory, Spacer } from '@rango-dev/ui';
 import { useUiStore } from '../store/ui';
 import {
   cancelSwap,
@@ -26,7 +26,6 @@ import {
   shouldRetrySwap,
 } from '../utils/swap';
 import { TokenPreview } from '../components/TokenPreview';
-import { Spacer } from '@rango-dev/ui';
 import { numberToString } from '../utils/numbers';
 //@ts-ignore
 import { t } from 'i18next';
@@ -127,7 +126,7 @@ export function SwapDetailsPage() {
           <TokenPreview
             chain={{
               displayName: lastStep?.toBlockchain || '',
-              // @ts-ignore
+              //@ts-ignore
               logo: lastStep?.toBlockchainLogo || '',
             }}
             token={{
@@ -141,7 +140,6 @@ export function SwapDetailsPage() {
         </>
       }
       //todo: move PendingSwap type to rango-types
-      //@ts-ignore
       pendingSwap={swap}
       onCopy={handleCopy}
       isCopied={isCopied}

package/src/pages/WalletsPage.tsx

@@ -20,7 +20,7 @@ import { Spinner } from '@rango-dev/ui';
 import { LoadingFailedAlert } from '@rango-dev/ui';
 
 interface PropTypes {
-  supportedWallets: 'all' | WalletType[];
+  supportedWallets?: WalletType[];
   multiWallets: boolean;
 }
 
@@ -50,7 +50,7 @@ export function WalletsPage({ supportedWallets, multiWallets }: PropTypes) {
   const wallets = getlistWallet(
     state,
     getWalletInfo,
-    supportedWallets === 'all' ? Object.values(WalletType) : supportedWallets
+    supportedWallets || Object.values(WalletType)
   );
   const walletsRef = useRef<WalletInfo[]>();
 

package/src/store/bestRoute.ts

@@ -249,7 +249,7 @@ const bestRoute = (
   let abortController: AbortController | null = null;
   const fetchBestRoute = () => {
     const { fromToken, toToken, inputAmount } = bestRouteStore.getState();
-    const { slippage, customSlippage, disabledLiquiditySources } =
+    const { slippage, customSlippage, disabledLiquiditySources, affiliateRef } =
       settingsStore.getState();
     if (!fromToken || !toToken || !inputAmount || inputAmount === '0') return;
     abortController?.abort();
@@ -263,7 +263,8 @@ const bestRoute = (
       [],
       disabledLiquiditySources,
       userSlippage,
-      false
+      false,
+      affiliateRef
     );
     if (!bestRouteStore.getState().loading)
       bestRouteStore.setState({

package/src/store/settings.ts

@@ -13,12 +13,14 @@ export interface SettingsState {
   infiniteApprove: boolean;
   disabledLiquiditySources: string[];
   theme: Theme;
+  affiliateRef: string | null;
   setSlippage: (slippage: number) => void;
   setCustomSlippage: (customSlippage: number | null) => void;
   toggleInfiniteApprove: () => void;
   toggleLiquiditySource: (name: string) => void;
   setTheme: (theme: Theme) => void;
   toggleAllLiquiditySources: () => void;
+  setAffiliateRef: (affiliateRef: string | null) => void;
 }
 
 export const useSettingsStore = createSelectors(
@@ -28,6 +30,7 @@ export const useSettingsStore = createSelectors(
         slippage: DEFAULT_SLIPPAGE,
         customSlippage: null,
         infiniteApprove: false,
+        affiliateRef: null,
         disabledLiquiditySources: [],
         theme: 'auto',
         setSlippage: (slippage) =>
@@ -38,6 +41,10 @@ export const useSettingsStore = createSelectors(
           set(() => ({
             customSlippage: customSlippage,
           })),
+        setAffiliateRef: (affiliateRef) =>
+          set(() => ({
+            affiliateRef,
+          })),
         toggleAllLiquiditySources: () =>
           set((state) => {
             const { swappers } = useMetaStore.getState().meta;

package/src/types/config.ts

@@ -1,9 +1,5 @@
-import { BlockchainMeta, Token } from 'rango-sdk';
+import { Asset } from 'rango-sdk';
 import { WalletType } from '@rango-dev/wallets-shared';
-export interface Source {
-  title: string;
-  type: 'BRIDGE' | 'AGGREGATOR' | 'DEX';
-}
 
 export type Colors = {
   background?: string;
@@ -17,28 +13,30 @@ export type Colors = {
   warning?: string;
 };
 
-export type Configs = {
-  fromChain: BlockchainMeta | null;
-  fromToken: Token | null;
-  toChain: BlockchainMeta | null;
-  toToken: Token | null;
-  fromAmount: number;
-  fromChains: 'all' | BlockchainMeta[];
-  fromTokens: 'all' | Token[];
-  toChains: 'all' | BlockchainMeta[];
-  toTokens: 'all' | Token[];
-  liquiditySources: 'all' | Source[];
-  wallets: 'all' | WalletType[];
-  multiWallets: boolean;
-  customeAddress: boolean;
-  theme: 'dark' | 'light' | 'auto';
-  title: string;
-  width: number;
-  height: number;
-  languege: string;
-  borderRadius: number;
-  fontFamily: string;
-  titleSize: number;
-  titleWeight: number;
-  colors: Colors;
+export type Theme = {
+  mode?: 'dark' | 'light' | 'auto';
+  fontFamily?: string;
+  colors?: Colors;
+  borderRadius?: number;
+  width?: number;
+  height?: number;
+};
+export type Support = {
+  blockchain?: string;
+  token?: Asset;
+  blockchains?: string[];
+  tokens?: Asset[];
+};
+
+export type WidgetConfig = {
+  affiliateRef?: string;
+  amount?: number;
+  from?: Support;
+  to?: Support;
+  liquiditySources?: string[];
+  wallets?: WalletType[];
+  multiWallets?: boolean;
+  customAddress?: boolean;
+  language?: string;
+  theme?: Theme;
 };

package/src/utils/swap.ts

@@ -1,14 +1,9 @@
-import {
-  WalletTypeAndAddress,
-  SwapSavedSettings,
-} from '@rango-dev/ui/dist/types/swaps';
 import BigNumber from 'bignumber.js';
 import {
   BestRouteRequest,
   BestRouteResponse,
   RecommendedSlippage,
   SwapResult,
-  MetaResponse,
   Token,
 } from 'rango-sdk';
 import { Account } from '../store/wallets';
@@ -176,96 +171,6 @@ export function canComputePriceImpact(
   );
 }
 
-export function calculatePendingSwap(
-  inputAmount: string,
-  bestRoute: BestRouteResponse,
-  wallets: { [p: string]: WalletTypeAndAddress },
-  settings: Omit<SwapSavedSettings, 'disabledSwappersIds'>,
-  validateBalanceOrFee: boolean,
-  meta: MetaResponse
-): PendingSwap {
-  const simulationResult = bestRoute.result;
-  if (!simulationResult) throw Error('Simulation result should not be null');
-
-  return {
-    creationTime: new Date().getTime().toString(),
-    finishTime: null,
-    requestId: bestRoute.requestId || '',
-    inputAmount: inputAmount,
-    //@ts-ignore
-    wallets,
-    status: 'running',
-    isPaused: false,
-    extraMessage: null,
-    extraMessageSeverity: null,
-    extraMessageDetail: null,
-    extraMessageErrorCode: null,
-    networkStatusExtraMessage: null,
-    networkStatusExtraMessageDetail: null,
-    lastNotificationTime: null,
-    //@ts-ignore
-    settings: settings,
-    simulationResult: simulationResult,
-    validateBalanceOrFee,
-    //@ts-ignore
-    steps:
-      bestRoute.result?.swaps?.map((swap, index) => {
-        const swapper = meta.swappers.find(
-          (swapper) => swapper.id === swap.swapperId
-        );
-        const swapperType = swapper?.types[0];
-        const fromBlockchain = meta.blockchains.find(
-          (blockchain) => blockchain.name === swap.from.blockchain
-        );
-        const toBlockchain = meta.blockchains.find(
-          (blockchain) => blockchain.name === swap.to.blockchain
-        );
-        return {
-          id: index + 1,
-          fromBlockchain: swap.from.blockchain,
-          fromSymbol: swap.from.symbol,
-          fromSymbolAddress: swap.from.address,
-          fromDecimals: swap.from.decimals,
-          fromAmountPrecision: swap.fromAmountPrecision,
-          fromAmountMinValue: swap.fromAmountMinValue,
-          fromAmountMaxValue: swap.fromAmountMaxValue,
-          toBlockchain: swap.to.blockchain,
-          fromLogo: swap.from.logo,
-          toSymbol: swap.to.symbol,
-          toSymbolAddress: swap.to.address,
-          toDecimals: swap.to.decimals,
-          toLogo: swap.to.logo,
-          startTransactionTime: new Date().getTime(),
-          swapperId: swap.swapperId,
-          feeInUsd: numberToString(getUsdFeeOfStep(swap, meta.tokens), null, 2),
-          expectedOutputAmountHumanReadable: swap.toAmount,
-          outputAmount: '',
-          status: 'created',
-          networkStatus: null,
-          executedTransactionId: null,
-          externalTransactionId: null,
-          explorerUrl: null,
-          trackingCode: null,
-          cosmosTransaction: null,
-          solanaTransaction: null,
-          starknetTransaction: null,
-          starknetApprovalTransaction: null,
-          tronTransaction: null,
-          tronApprovalTransaction: null,
-          evmTransaction: null,
-          evmApprovalTransaction: null,
-          transferTransaction: null,
-          diagnosisUrl: null,
-          internalSteps: null,
-          fromBlockchainLogo: fromBlockchain?.logo || '',
-          toBlockchainLogo: toBlockchain?.logo || '',
-          swapperLogo: swapper?.logo || '',
-          swapperType: swapperType || '',
-        };
-      }) || [],
-  };
-}
-
 export function requiredWallets(route: BestRouteResponse | null) {
   const wallets: string[] = [];
 
@@ -408,7 +313,8 @@ export function createBestRouteRequestBody(
   selectedWallets: SelectedWallet[],
   disabledLiquiditySources: string[],
   slippage: number,
-  checkPrerequisites: boolean
+  checkPrerequisites: boolean,
+  affiliateRef: string | null
 ): BestRouteRequest {
   const selectedWalletsMap = selectedWallets.reduce(
     (
@@ -439,6 +345,7 @@ export function createBestRouteRequestBody(
 
   const requestBody: BestRouteRequest = {
     amount: inputAmount.toString(),
+    affiliateRef,
     checkPrerequisites,
     from: {
       address: fromToken.address,