@rango-dev/widget-embedded 0.36.1-next.9 → 0.37.1-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (86) hide show
  1. package/dist/QueueManager.d.ts.map +1 -1
  2. package/dist/components/ConfirmWalletsModal/ConfirmWalletsModal.d.ts.map +1 -1
  3. package/dist/components/Quote/Quote.styles.d.ts +1 -1
  4. package/dist/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.helpers.d.ts.map +1 -1
  5. package/dist/components/Quotes/Quotes.d.ts.map +1 -1
  6. package/dist/components/RefreshModal/RefreshModal.styles.d.ts +1 -1
  7. package/dist/components/SwapDetails/SwapDetails.d.ts.map +1 -1
  8. package/dist/components/SwapDetailsModal/SwapDetailsCompleteModal.d.ts.map +1 -1
  9. package/dist/components/WalletStatefulConnect/Namespaces.d.ts.map +1 -1
  10. package/dist/constants/quote.d.ts +8 -0
  11. package/dist/constants/quote.d.ts.map +1 -1
  12. package/dist/containers/QuoteInfo/QuoteInfo.d.ts.map +1 -1
  13. package/dist/containers/Wallets/Wallets.d.ts.map +1 -1
  14. package/dist/containers/WidgetInfo/WidgetInfo.helpers.d.ts +1 -1
  15. package/dist/hooks/useConfirmSwap/useConfirmSwap.d.ts.map +1 -1
  16. package/dist/hooks/useConfirmSwap/useConfirmSwap.helpers.d.ts +6 -4
  17. package/dist/hooks/useConfirmSwap/useConfirmSwap.helpers.d.ts.map +1 -1
  18. package/dist/hooks/useFetchApiConfig.d.ts.map +1 -1
  19. package/dist/hooks/useStatefulConnect/useStatefulConnect.d.ts.map +1 -1
  20. package/dist/hooks/useStatefulConnect/useStatefulConnect.types.d.ts +2 -4
  21. package/dist/hooks/useStatefulConnect/useStatefulConnect.types.d.ts.map +1 -1
  22. package/dist/hooks/useSwapInput.d.ts.map +1 -1
  23. package/dist/hooks/useWalletList.d.ts.map +1 -1
  24. package/dist/hooks/useWalletProviders/useWalletProviders.d.ts +1 -1
  25. package/dist/hooks/useWalletProviders/useWalletProviders.d.ts.map +1 -1
  26. package/dist/index.js +2 -2
  27. package/dist/index.js.map +4 -4
  28. package/dist/pages/ConfirmSwapPage.d.ts.map +1 -1
  29. package/dist/store/quote.d.ts.map +1 -1
  30. package/dist/store/slices/config.d.ts +4 -0
  31. package/dist/store/slices/config.d.ts.map +1 -1
  32. package/dist/store/slices/wallets.d.ts +3 -1
  33. package/dist/store/slices/wallets.d.ts.map +1 -1
  34. package/dist/store/ui.d.ts +4 -0
  35. package/dist/store/ui.d.ts.map +1 -1
  36. package/dist/types/quote.d.ts +8 -17
  37. package/dist/types/quote.d.ts.map +1 -1
  38. package/dist/types/wallets.d.ts +1 -6
  39. package/dist/types/wallets.d.ts.map +1 -1
  40. package/dist/utils/providers.d.ts +6 -2
  41. package/dist/utils/providers.d.ts.map +1 -1
  42. package/dist/utils/quote.d.ts +5 -6
  43. package/dist/utils/quote.d.ts.map +1 -1
  44. package/dist/utils/swap.d.ts +4 -4
  45. package/dist/utils/swap.d.ts.map +1 -1
  46. package/dist/utils/wallets.d.ts.map +1 -1
  47. package/dist/widget-embedded.build.json +1 -1
  48. package/package.json +7 -7
  49. package/src/QueueManager.tsx +11 -10
  50. package/src/components/ConfirmWalletsModal/ConfirmWalletsModal.tsx +2 -19
  51. package/src/components/ConfirmWalletsModal/WalletList.tsx +1 -1
  52. package/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.helpers.ts +42 -22
  53. package/src/components/Quotes/Quotes.tsx +2 -3
  54. package/src/components/SwapDetails/SwapDetails.tsx +10 -7
  55. package/src/components/SwapDetailsModal/SwapDetailsCompleteModal.tsx +26 -13
  56. package/src/components/WalletStatefulConnect/Namespaces.tsx +30 -37
  57. package/src/constants/quote.ts +23 -0
  58. package/src/containers/QuoteInfo/QuoteInfo.tsx +3 -9
  59. package/src/containers/Wallets/Wallets.tsx +63 -3
  60. package/src/containers/WidgetInfo/WidgetInfo.helpers.ts +2 -2
  61. package/src/hooks/useConfirmSwap/useConfirmSwap.helpers.ts +29 -66
  62. package/src/hooks/useConfirmSwap/useConfirmSwap.ts +10 -15
  63. package/src/hooks/useFetchApiConfig.ts +5 -1
  64. package/src/hooks/useStatefulConnect/useStatefulConnect.ts +20 -22
  65. package/src/hooks/useStatefulConnect/useStatefulConnect.types.ts +2 -4
  66. package/src/hooks/useSwapInput.ts +2 -9
  67. package/src/hooks/useWalletList.ts +6 -6
  68. package/src/hooks/useWalletProviders/useWalletProviders.ts +7 -7
  69. package/src/pages/ConfirmSwapPage.tsx +7 -15
  70. package/src/store/quote.ts +3 -13
  71. package/src/store/slices/config.ts +73 -0
  72. package/src/store/slices/data.test.ts +23 -1
  73. package/src/store/slices/wallets.ts +13 -2
  74. package/src/store/ui.ts +6 -0
  75. package/src/types/quote.ts +10 -24
  76. package/src/types/wallets.ts +1 -6
  77. package/src/utils/providers.ts +66 -70
  78. package/src/utils/quote.ts +57 -45
  79. package/src/utils/swap.ts +55 -36
  80. package/src/utils/wallets.ts +2 -4
  81. package/dist/constants/warnings.d.ts +0 -3
  82. package/dist/constants/warnings.d.ts.map +0 -1
  83. package/dist/utils/hub.d.ts +0 -4
  84. package/dist/utils/hub.d.ts.map +0 -1
  85. package/src/constants/warnings.ts +0 -26
  86. package/src/utils/hub.ts +0 -21
@@ -7,27 +7,18 @@ import type {
7
7
  SelectedQuote,
8
8
  Wallet,
9
9
  } from '../../types';
10
- import type { BlockchainMeta, SwapResult, Token } from 'rango-sdk';
10
+ import type BigNumber from 'bignumber.js';
11
+ import type { BlockchainMeta, SwapResult } from 'rango-sdk';
11
12
 
12
13
  import { errorMessages } from '../../constants/errors';
13
- import { QuoteErrorType, QuoteUpdateType } from '../../types';
14
- import { numberToString } from '../../utils/numbers';
15
- import {
16
- generateQuoteWarnings,
17
- getPriceImpact,
18
- isNumberOfSwapsChanged,
19
- isQuoteChanged,
20
- isQuoteInternalCoinsUpdated,
21
- isQuoteSwappersUpdated,
22
- } from '../../utils/quote';
14
+ import { QuoteErrorType } from '../../types';
15
+ import { generateQuoteWarnings } from '../../utils/quote';
23
16
  import {
24
17
  checkSlippageErrors,
25
18
  generateBalanceWarnings,
26
19
  getLimitErrorMessage,
27
20
  getMinRequiredSlippage,
28
- getQuoteOutputAmount,
29
21
  hasLimitError,
30
- isOutputAmountChangedALot,
31
22
  } from '../../utils/swap';
32
23
 
33
24
  /**
@@ -82,72 +73,44 @@ export function getQuoteError(swaps: SwapResult[]): QuoteErrorResponse | null {
82
73
  return null;
83
74
  }
84
75
 
85
- export function generateWarnings(
86
- previousQuote: SelectedQuote | undefined,
87
- currentQuote: SelectedQuote,
88
- params: {
89
- fromToken: Token;
90
- toToken: Token;
91
- meta: { blockchains: BlockchainMeta[] };
92
- selectedWallets: Wallet[];
93
- userSlippage: number;
94
- findToken: FindToken;
95
- }
96
- ): ConfirmSwapWarnings {
97
- let quoteChanged = false;
98
- if (previousQuote) {
99
- quoteChanged = isQuoteChanged(previousQuote, currentQuote);
100
- }
76
+ export function generateWarnings(params: {
77
+ currentQuote: SelectedQuote;
78
+ previousQuote?: SelectedQuote;
79
+ meta: { blockchains: BlockchainMeta[] };
80
+ selectedWallets: Wallet[];
81
+ userSlippage: number;
82
+ inputUsdValue: BigNumber | null;
83
+ findToken: FindToken;
84
+ }): ConfirmSwapWarnings {
85
+ const {
86
+ currentQuote,
87
+ previousQuote,
88
+ meta,
89
+ selectedWallets,
90
+ userSlippage,
91
+ findToken,
92
+ } = params;
93
+
101
94
  const output: ConfirmSwapWarnings = {
102
95
  quote: null,
103
- quoteUpdate: null,
104
96
  balance: null,
105
97
  };
106
98
 
107
- const quoteWarning = generateQuoteWarnings(currentQuote, {
108
- fromToken: params.fromToken,
109
- toToken: params.toToken,
110
- findToken: params.findToken,
111
- userSlippage: params.userSlippage,
99
+ const quoteWarning = generateQuoteWarnings({
100
+ previousQuote,
101
+ currentQuote,
102
+ findToken,
103
+ userSlippage,
112
104
  });
113
105
 
114
106
  if (quoteWarning) {
115
107
  output.quote = quoteWarning;
116
108
  }
117
109
 
118
- if (previousQuote && quoteChanged) {
119
- if (isOutputAmountChangedALot(previousQuote, currentQuote)) {
120
- output.quoteUpdate = {
121
- type: QuoteUpdateType.QUOTE_AND_OUTPUT_AMOUNT_UPDATED,
122
- newOutputAmount: numberToString(getQuoteOutputAmount(currentQuote)),
123
- percentageChange: numberToString(
124
- getPriceImpact(
125
- getQuoteOutputAmount(previousQuote) ?? '',
126
- getQuoteOutputAmount(currentQuote) ?? ''
127
- ),
128
- null,
129
- 2
130
- ),
131
- };
132
- } else if (isNumberOfSwapsChanged(previousQuote, currentQuote)) {
133
- output.quoteUpdate = {
134
- type: QuoteUpdateType.QUOTE_UPDATED,
135
- };
136
- } else if (isQuoteSwappersUpdated(previousQuote, currentQuote)) {
137
- output.quoteUpdate = {
138
- type: QuoteUpdateType.QUOTE_SWAPPERS_UPDATED,
139
- };
140
- } else if (isQuoteInternalCoinsUpdated(previousQuote, currentQuote)) {
141
- output.quoteUpdate = {
142
- type: QuoteUpdateType.QUOTE_COINS_UPDATED,
143
- };
144
- }
145
- }
146
-
147
110
  const balanceWarnings = generateBalanceWarnings(
148
111
  currentQuote,
149
- params.selectedWallets,
150
- params.meta.blockchains
112
+ selectedWallets,
113
+ meta.blockchains
151
114
  );
152
115
 
153
116
  const enoughBalance = balanceWarnings.length === 0;
@@ -21,10 +21,10 @@ export function useConfirmSwap(): ConfirmSwap {
21
21
  fromToken,
22
22
  toToken,
23
23
  inputAmount,
24
+ inputUsdValue,
24
25
  setSelectedQuote,
25
26
  selectedQuote: initialQuote,
26
27
  customDestination: customDestinationFromStore,
27
- setQuoteWarningsConfirmed,
28
28
  resetAlerts,
29
29
  } = useQuoteStore();
30
30
 
@@ -95,21 +95,16 @@ export function useConfirmSwap(): ConfirmSwap {
95
95
  disabledSwappersGroups: disabledLiquiditySources,
96
96
  };
97
97
 
98
- const confirmSwapWarnings = generateWarnings(
99
- initialQuote ?? undefined,
98
+ const confirmSwapWarnings = generateWarnings({
99
+ previousQuote: initialQuote ?? undefined,
100
100
  currentQuote,
101
- {
102
- fromToken,
103
- toToken,
104
- meta: { blockchains },
105
- findToken,
106
- selectedWallets,
107
- userSlippage,
108
- }
109
- );
110
- if (confirmSwapWarnings.quoteUpdate) {
111
- setQuoteWarningsConfirmed(false);
112
- }
101
+ meta: { blockchains },
102
+ selectedWallets,
103
+ userSlippage,
104
+ inputUsdValue,
105
+ findToken,
106
+ });
107
+
113
108
  resetAlerts();
114
109
 
115
110
  const proceedAnyway = !!confirmSwapWarnings.balance;
@@ -6,6 +6,9 @@ export type Watermark = 'NONE' | 'FULL';
6
6
  type ConfigResponse = {
7
7
  config: {
8
8
  watermark: Watermark;
9
+ banners: {
10
+ profile: boolean;
11
+ };
9
12
  };
10
13
  };
11
14
 
@@ -14,7 +17,7 @@ interface UseFetchApiConfig {
14
17
  }
15
18
 
16
19
  export function useFetchApiConfig(): UseFetchApiConfig {
17
- const { setWatermark } = useUiStore();
20
+ const { setWatermark, setShowProfileBanner } = useUiStore();
18
21
 
19
22
  const fetchApiConfig: UseFetchApiConfig['fetchApiConfig'] = async () => {
20
23
  const response = await fetch(
@@ -28,6 +31,7 @@ export function useFetchApiConfig(): UseFetchApiConfig {
28
31
  const data: ConfigResponse = await response.json();
29
32
 
30
33
  setWatermark(data.config.watermark);
34
+ setShowProfileBanner(data.config.banners.profile);
31
35
  };
32
36
  return { fetchApiConfig };
33
37
  }
@@ -8,8 +8,6 @@ import { WalletState } from '@rango-dev/ui';
8
8
  import { useWallets } from '@rango-dev/wallets-react';
9
9
  import { useReducer } from 'react';
10
10
 
11
- import { convertCommonNamespacesKeysToLegacyNamespace } from '../../utils/hub';
12
-
13
11
  import {
14
12
  isStateOnDerivationPathStep,
15
13
  isStateOnNamespace,
@@ -99,50 +97,48 @@ export function useStatefulConnect(): UseStatefulConnect {
99
97
  detachedInstances && wallet.state !== 'connected';
100
98
 
101
99
  if (needsNamespace) {
102
- const availableNamespaces =
103
- convertCommonNamespacesKeysToLegacyNamespace(
104
- detachedInstances.value
105
- );
106
-
107
100
  dispatch({
108
101
  type: 'needsNamespace',
109
102
  payload: {
110
- providerType: wallet.type,
111
- providerImage: wallet.image,
112
- availableNamespaces,
113
- singleNamespace: false,
103
+ targetWallet: wallet,
114
104
  },
115
105
  });
116
106
  return { status: ResultStatus.Namespace };
117
107
  }
118
108
  }
119
109
 
120
- // Legacy
121
- if (!wallet.namespaces) {
110
+ /*
111
+ * Legacy
112
+ *
113
+ * For legacy there are 3 states:
114
+ * 1. a wallet doesn't have any namespace defined, we call the connect.
115
+ * 2. a wallet has more than two namespaces, we should show namepsace modal, and in that place user will be checked to needs derivation path or not.
116
+ * 3. a wallet has exactly one namespacesape, in this case we check if that needs derivation or not, if it needs we will do it here by dispatching the action accordingly.
117
+ */
118
+ if (!wallet.needsNamespace) {
122
119
  return await runConnect(wallet.type, undefined, options);
123
120
  }
124
121
 
125
- const needsNamespace = wallet.namespaces.length > 1;
122
+ const needsNamespace = wallet.needsNamespace.data.length > 1;
126
123
  const needsDerivationPath = wallet.needsDerivationPath;
127
124
 
128
125
  if (needsNamespace) {
129
126
  dispatch({
130
127
  type: 'needsNamespace',
131
128
  payload: {
132
- providerType: wallet.type,
133
- providerImage: wallet.image,
134
- availableNamespaces: wallet.namespaces,
135
- singleNamespace: wallet.singleNamespace,
129
+ targetWallet: wallet,
136
130
  },
137
131
  });
138
132
  return { status: ResultStatus.Namespace };
139
133
  } else if (needsDerivationPath) {
134
+ const namespace = wallet.needsNamespace.data[0];
135
+
140
136
  dispatch({
141
137
  type: 'needsDerivationPath',
142
138
  payload: {
143
139
  providerType: wallet.type,
144
140
  providerImage: wallet.image,
145
- namespace: wallet.namespaces[0],
141
+ namespace: namespace.value,
146
142
  },
147
143
  });
148
144
  return { status: ResultStatus.DerivationPath };
@@ -150,7 +146,9 @@ export function useStatefulConnect(): UseStatefulConnect {
150
146
 
151
147
  return await runConnect(
152
148
  wallet.type,
153
- wallet.namespaces.map((namespace) => ({ namespace })),
149
+ wallet.needsNamespace?.data.map((namespace) => ({
150
+ namespace: namespace.value,
151
+ })),
154
152
  options
155
153
  );
156
154
  }
@@ -167,7 +165,7 @@ export function useStatefulConnect(): UseStatefulConnect {
167
165
  wallet: WalletInfoWithExtra,
168
166
  selectedNamespaces: Namespace[]
169
167
  ): Promise<Result> => {
170
- const isSingleNamespace = wallet.singleNamespace;
168
+ const isSingleNamespace = wallet.needsNamespace?.selection === 'single';
171
169
  const needsDerivationPath = wallet.needsDerivationPath;
172
170
  const firstSelectedNamespace = selectedNamespaces[0];
173
171
 
@@ -207,7 +205,7 @@ export function useStatefulConnect(): UseStatefulConnect {
207
205
  );
208
206
  }
209
207
 
210
- const type = connectState.namespace.providerType;
208
+ const type = connectState.namespace.targetWallet.type;
211
209
  const namespaces = selectedNamespaces.map((namespace) => ({
212
210
  namespace,
213
211
  }));
@@ -1,3 +1,4 @@
1
+ import type { ExtendedModalWalletInfo } from '../../utils/wallets';
1
2
  import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
2
3
 
3
4
  export interface HandleConnectOptions {
@@ -6,10 +7,7 @@ export interface HandleConnectOptions {
6
7
  }
7
8
 
8
9
  export interface NeedsNamespacesState {
9
- providerType: string;
10
- providerImage: string;
11
- availableNamespaces?: Namespace[];
12
- singleNamespace?: boolean;
10
+ targetWallet: ExtendedModalWalletInfo;
13
11
  }
14
12
 
15
13
  export interface NeedsDerivationPathState {
@@ -10,8 +10,6 @@ import { isPositiveNumber } from '../utils/numbers';
10
10
  import {
11
11
  generateQuoteWarnings,
12
12
  getDefaultQuote,
13
- getQuoteFromTokenUsdPrice,
14
- getQuoteToTokenUsdPrice,
15
13
  sortQuotesBy,
16
14
  } from '../utils/quote';
17
15
  import { isRoutingEnabled } from '../utils/settings';
@@ -156,15 +154,10 @@ export function useSwapInput({
156
154
  requestId: quote?.requestId || '',
157
155
  swaps: quote?.swaps,
158
156
  });
159
- const outputUsdValue =
160
- getQuoteToTokenUsdPrice(quote) || toToken?.usdPrice;
161
- const inputUsdValue =
162
- getQuoteFromTokenUsdPrice(quote) || fromToken?.usdPrice;
163
157
  const quoteWarning =
164
158
  quote &&
165
- generateQuoteWarnings(quote, {
166
- fromToken: { ...fromToken, usdPrice: inputUsdValue },
167
- toToken: { ...toToken, usdPrice: outputUsdValue },
159
+ generateQuoteWarnings({
160
+ currentQuote: quote,
168
161
  userSlippage,
169
162
  findToken,
170
163
  });
@@ -22,8 +22,6 @@ import {
22
22
 
23
23
  import { useStatefulConnect } from './useStatefulConnect/useStatefulConnect';
24
24
 
25
- const ALL_SUPPORTED_WALLETS = Object.values(WalletTypes);
26
-
27
25
  interface Params {
28
26
  chain?: string;
29
27
  }
@@ -42,20 +40,22 @@ interface API {
42
40
  */
43
41
  export function useWalletList(params?: Params): API {
44
42
  const { chain } = params || {};
45
- const { config, connectedWallets } = useAppStore();
43
+ const { config, connectedWallets, getAvailableProviders } = useAppStore();
46
44
  const { state, getWalletInfo } = useWallets();
47
45
  const blockchains = useAppStore().blockchains();
48
46
  const { handleDisconnect } = useStatefulConnect();
49
47
 
50
48
  /** It can be what has been set by widget config or as a fallback we use all the supported wallets by our library */
51
- const listAvailableWalletTypes =
52
- configWalletsToWalletName(config?.wallets, {
49
+ const listAvailableWalletTypes = configWalletsToWalletName(
50
+ getAvailableProviders(),
51
+ {
53
52
  trezorManifest: config?.trezorManifest,
54
53
  walletConnectProjectId: config?.walletConnectProjectId,
55
54
  walletConnectListedDesktopWalletLink:
56
55
  config.__UNSTABLE_OR_INTERNAL__?.walletConnectListedDesktopWalletLink,
57
56
  tonConnect: config.tonConnect,
58
- }) || ALL_SUPPORTED_WALLETS;
57
+ }
58
+ );
59
59
 
60
60
  let wallets = mapWalletTypesToWalletInfo(
61
61
  state,
@@ -4,27 +4,27 @@ import type { ProvidersOptions } from '../../utils/providers';
4
4
  import { useEffect } from 'react';
5
5
 
6
6
  import { useAppStore } from '../../store/AppStore';
7
- import { matchAndGenerateProviders } from '../../utils/providers';
8
7
 
9
8
  import { hashProviders } from './useWalletProviders.helpers';
10
9
 
11
10
  export function useWalletProviders(
12
- providers: WidgetConfig['wallets'],
11
+ configWallets: WidgetConfig['wallets'],
13
12
  options?: ProvidersOptions
14
13
  ) {
15
- const { clearConnectedWallet } = useAppStore();
16
- let generateProviders = matchAndGenerateProviders(providers, options);
14
+ const { clearConnectedWallet, getAvailableProviders, buildAndSetProviders } =
15
+ useAppStore();
16
+ const providers = getAvailableProviders();
17
17
 
18
18
  useEffect(() => {
19
19
  clearConnectedWallet();
20
- generateProviders = matchAndGenerateProviders(providers, options);
20
+ buildAndSetProviders();
21
21
  }, [
22
- hashProviders(providers ?? []),
22
+ hashProviders(configWallets ?? []),
23
23
  options?.walletConnectProjectId,
24
24
  options?.walletConnectListedDesktopWalletLink,
25
25
  ]);
26
26
 
27
27
  return {
28
- providers: generateProviders,
28
+ providers,
29
29
  };
30
30
  }
@@ -24,12 +24,12 @@ import { RefreshButton } from '../components/HeaderButtons/RefreshButton';
24
24
  import { Layout, PageContainer } from '../components/Layout';
25
25
  import { QuoteWarningsAndErrors } from '../components/QuoteWarningsAndErrors';
26
26
  import { navigationRoutes } from '../constants/navigationRoutes';
27
- import { getQuoteUpdateWarningMessage } from '../constants/warnings';
28
27
  import { QuoteInfo } from '../containers/QuoteInfo';
29
28
  import { useConfirmSwap } from '../hooks/useConfirmSwap';
30
29
  import { useAppStore } from '../store/AppStore';
31
30
  import { useQuoteStore } from '../store/quote';
32
31
  import { useUiStore } from '../store/ui';
32
+ import { isQuoteWarningConfirmationRequired } from '../utils/quote';
33
33
  import { joinList } from '../utils/ui';
34
34
 
35
35
  const Buttons = styled('div', {
@@ -133,7 +133,12 @@ export function ConfirmSwapPage() {
133
133
  };
134
134
 
135
135
  const onStartConfirmSwap = async () => {
136
- if (confirmSwapResult?.warnings?.quote && !quoteWarningsConfirmed) {
136
+ const shouldShowWarningModal =
137
+ confirmSwapResult.warnings?.quote &&
138
+ isQuoteWarningConfirmationRequired(confirmSwapResult.warnings.quote) &&
139
+ !quoteWarningsConfirmed;
140
+
141
+ if (shouldShowWarningModal) {
137
142
  setShowQuoteWarningModal(true);
138
143
  } else {
139
144
  await onConfirm();
@@ -196,19 +201,6 @@ export function ConfirmSwapPage() {
196
201
  alerts.push(<Alert type="error" variant="alarm" title={dbErrorMessage} />);
197
202
  }
198
203
 
199
- if (confirmSwapResult.warnings?.quoteUpdate) {
200
- alerts.push(
201
- <Alert
202
- variant="alarm"
203
- type="warning"
204
- title={
205
- confirmSwapResult.warnings.quoteUpdate &&
206
- getQuoteUpdateWarningMessage(confirmSwapResult.warnings.quoteUpdate)
207
- }
208
- />
209
- );
210
- }
211
-
212
204
  if (quoteWarning || quoteError) {
213
205
  const settings_url = `../${navigationRoutes.settings}`;
214
206
  alerts.push(
@@ -21,11 +21,7 @@ import {
21
21
  WidgetEvents,
22
22
  } from '../types';
23
23
  import { isPositiveNumber } from '../utils/numbers';
24
- import {
25
- getQuoteFromTokenUsdPrice,
26
- getQuoteToTokenUsdPrice,
27
- } from '../utils/quote';
28
- import { calcOutputUsdValue } from '../utils/swap';
24
+ import { getUsdInputFrom, getUsdOutputFrom } from '../utils/swap';
29
25
 
30
26
  import createSelectors from './selectors';
31
27
 
@@ -137,14 +133,8 @@ export const useQuoteStore = createSelectors(
137
133
  outputAmount = !!quote?.outputAmount
138
134
  ? new BigNumber(quote?.outputAmount)
139
135
  : null;
140
- inputUsdValue = calcOutputUsdValue(
141
- state.inputAmount,
142
- getQuoteFromTokenUsdPrice(quote) || state.fromToken?.usdPrice
143
- );
144
- outputUsdValue = calcOutputUsdValue(
145
- quote.outputAmount,
146
- getQuoteToTokenUsdPrice(quote) || state.toToken?.usdPrice
147
- );
136
+ inputUsdValue = getUsdInputFrom(quote) ?? ZERO;
137
+ outputUsdValue = getUsdOutputFrom(quote) ?? ZERO;
148
138
  }
149
139
  return {
150
140
  selectedQuote: quote,
@@ -3,9 +3,31 @@ import type { SettingsSlice } from './settings';
3
3
  import type { WidgetConfig } from '../../types';
4
4
  import type { StateCreatorWithInitialData } from '../app';
5
5
 
6
+ import { allProviders as getAllProviders } from '@rango-dev/provider-all';
7
+ import { type VersionedProviders } from '@rango-dev/wallets-core';
8
+
6
9
  import { cacheService } from '../../services/cacheService';
10
+ import {
11
+ matchAndGenerateProviders,
12
+ type ProvidersOptions,
13
+ } from '../../utils/providers';
7
14
  import { matchTokensFromConfigWithMeta } from '../utils';
8
15
 
16
+ function makeProvidersOptionsFromConfig(
17
+ config: WidgetConfig
18
+ ): ProvidersOptions {
19
+ const options: ProvidersOptions = {
20
+ walletConnectProjectId: config?.walletConnectProjectId,
21
+ trezorManifest: config?.trezorManifest,
22
+ tonConnect: config?.tonConnect,
23
+ walletConnectListedDesktopWalletLink:
24
+ config.__UNSTABLE_OR_INTERNAL__?.walletConnectListedDesktopWalletLink,
25
+ experimentalWallet: config.features?.experimentalWallet,
26
+ };
27
+
28
+ return options;
29
+ }
30
+
9
31
  export const DEFAULT_CONFIG: WidgetConfig = {
10
32
  apiKey: '',
11
33
  title: undefined,
@@ -61,6 +83,31 @@ export interface ConfigSlice {
61
83
  name: K,
62
84
  value: IframeConfigs[K]
63
85
  ) => void;
86
+ allProviders: VersionedProviders[];
87
+ buildAndSetProviders: () => void;
88
+ getAvailableProviders: () => VersionedProviders[];
89
+ }
90
+
91
+ function generateProviders(config: WidgetConfig) {
92
+ const options = makeProvidersOptionsFromConfig(config);
93
+ const envs = {
94
+ walletconnect2: {
95
+ WC_PROJECT_ID: options?.walletConnectProjectId || '',
96
+ DISABLE_MODAL_AND_OPEN_LINK:
97
+ options?.walletConnectListedDesktopWalletLink,
98
+ },
99
+ selectedProviders: config.wallets,
100
+ trezor: options?.trezorManifest
101
+ ? { manifest: options.trezorManifest }
102
+ : undefined,
103
+ tonConnect: options?.tonConnect?.manifestUrl
104
+ ? { manifestUrl: options?.tonConnect.manifestUrl }
105
+ : undefined,
106
+ };
107
+ const allProviders = getAllProviders(envs);
108
+ const allBuiltProviders = allProviders.map((build) => build());
109
+
110
+ return allBuiltProviders;
64
111
  }
65
112
 
66
113
  export const createConfigSlice: StateCreatorWithInitialData<
@@ -68,10 +115,15 @@ export const createConfigSlice: StateCreatorWithInitialData<
68
115
  ConfigSlice & SettingsSlice & DataSlice,
69
116
  ConfigSlice
70
117
  > = (initialData, set, get) => {
118
+ const allBuiltProviders = generateProviders({
119
+ ...DEFAULT_CONFIG,
120
+ ...initialData,
121
+ });
71
122
  return {
72
123
  config: { ...DEFAULT_CONFIG, ...initialData },
73
124
  iframe: DEFAULT_IFRAME_CONFIGS,
74
125
  campaignMode: DEFAULT_CAMPAIGN_MODE,
126
+ allProviders: allBuiltProviders,
75
127
  getLiquiditySources: () => {
76
128
  const { config, campaignMode } = get();
77
129
  return campaignMode.liquiditySources?.length
@@ -162,5 +214,26 @@ export const createConfigSlice: StateCreatorWithInitialData<
162
214
  },
163
215
  });
164
216
  },
217
+
218
+ buildAndSetProviders: () => {
219
+ const { config } = get();
220
+ const allBuiltProviders = generateProviders(config);
221
+
222
+ set({
223
+ allProviders: allBuiltProviders,
224
+ });
225
+ },
226
+
227
+ getAvailableProviders: () => {
228
+ const { allProviders, config } = get();
229
+ const options = makeProvidersOptionsFromConfig(config);
230
+
231
+ const availableProviders = matchAndGenerateProviders({
232
+ allProviders,
233
+ configWallets: config.wallets,
234
+ options,
235
+ });
236
+ return availableProviders;
237
+ },
165
238
  };
166
239
  };
@@ -1,3 +1,4 @@
1
+ import type { WidgetConfig } from '../../types';
1
2
  import type { AppStoreState } from '../app';
2
3
  import type { EvmBlockchainMeta, Token } from 'rango-sdk';
3
4
 
@@ -17,6 +18,27 @@ let appStoreState: AppStoreState;
17
18
  let customTokens: [Token, Token, Token];
18
19
  let rangoBlockchain: EvmBlockchainMeta;
19
20
 
21
+ const DEFAULT_CONFIG: WidgetConfig = {
22
+ apiKey: '',
23
+ walletConnectProjectId: 'e24844c5deb5193c1c14840a7af6a40b',
24
+ title: undefined,
25
+ multiWallets: true,
26
+ excludeLiquiditySources: true,
27
+ customDestination: true,
28
+ variant: 'default',
29
+ trezorManifest: {
30
+ appUrl: 'https://widget.rango.exchange/',
31
+ email: 'hi+trezorwidget@rango.exchange',
32
+ },
33
+ tonConnect: {
34
+ manifestUrl:
35
+ 'https://raw.githubusercontent.com/rango-exchange/rango-types/main/assets/manifests/tonconnect-manifest.json',
36
+ },
37
+ features: {
38
+ experimentalWallet: 'enabled',
39
+ },
40
+ };
41
+
20
42
  beforeEach(() => {
21
43
  cacheService.clear();
22
44
  rangoBlockchain = createEvmBlockchain();
@@ -60,7 +82,7 @@ beforeEach(() => {
60
82
  initData._tokensMapByBlockchainName[token.blockchain].push(tokenHash);
61
83
  });
62
84
 
63
- const appStore = createAppStore();
85
+ const appStore = createAppStore(DEFAULT_CONFIG);
64
86
  appStore.setState(initData);
65
87
  appStoreState = appStore.getState();
66
88
  });
@@ -55,7 +55,12 @@ export interface WalletsSlice {
55
55
  setConnectedWalletAsRefetching: (walletType: string) => void;
56
56
  setConnectedWalletHasError: (walletType: string) => void;
57
57
  setConnectedWalletRetrievedData: (walletType: string) => void;
58
- removeBalancesForWallet: (walletType: string) => void;
58
+ removeBalancesForWallet: (
59
+ walletType: string,
60
+ options?: {
61
+ chains?: string[];
62
+ }
63
+ ) => void;
59
64
  addConnectedWallet: (accounts: Wallet[]) => void;
60
65
  setWalletsAsSelected: (
61
66
  wallets: { walletType: string; chain: string }[]
@@ -254,7 +259,7 @@ export const createWalletsSlice: StateCreator<
254
259
 
255
260
  void get().fetchBalances(accounts);
256
261
  },
257
- removeBalancesForWallet: (walletType) => {
262
+ removeBalancesForWallet: (walletType, options) => {
258
263
  let walletsNeedsToBeRemoved = get().connectedWallets.filter(
259
264
  (connectedWallet) => connectedWallet.walletType === walletType
260
265
  );
@@ -275,6 +280,12 @@ export const createWalletsSlice: StateCreator<
275
280
  }
276
281
  });
277
282
 
283
+ if (!!options?.chains && options.chains.length > 0) {
284
+ walletsNeedsToBeRemoved = walletsNeedsToBeRemoved.filter((wallet) => {
285
+ return options.chains?.includes(wallet.chain);
286
+ });
287
+ }
288
+
278
289
  const nextBalancesState: BalanceState = {};
279
290
  let nextAggregatedBalanceState: AggregatedBalanceState =
280
291
  get()._aggregatedBalances;