@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.
- package/dist/QueueManager.d.ts.map +1 -1
- package/dist/components/ConfirmWalletsModal/ConfirmWalletsModal.d.ts.map +1 -1
- package/dist/components/Quote/Quote.styles.d.ts +1 -1
- package/dist/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.helpers.d.ts.map +1 -1
- package/dist/components/Quotes/Quotes.d.ts.map +1 -1
- package/dist/components/RefreshModal/RefreshModal.styles.d.ts +1 -1
- package/dist/components/SwapDetails/SwapDetails.d.ts.map +1 -1
- package/dist/components/SwapDetailsModal/SwapDetailsCompleteModal.d.ts.map +1 -1
- package/dist/components/WalletStatefulConnect/Namespaces.d.ts.map +1 -1
- package/dist/constants/quote.d.ts +8 -0
- package/dist/constants/quote.d.ts.map +1 -1
- package/dist/containers/QuoteInfo/QuoteInfo.d.ts.map +1 -1
- package/dist/containers/Wallets/Wallets.d.ts.map +1 -1
- package/dist/containers/WidgetInfo/WidgetInfo.helpers.d.ts +1 -1
- package/dist/hooks/useConfirmSwap/useConfirmSwap.d.ts.map +1 -1
- package/dist/hooks/useConfirmSwap/useConfirmSwap.helpers.d.ts +6 -4
- package/dist/hooks/useConfirmSwap/useConfirmSwap.helpers.d.ts.map +1 -1
- package/dist/hooks/useFetchApiConfig.d.ts.map +1 -1
- package/dist/hooks/useStatefulConnect/useStatefulConnect.d.ts.map +1 -1
- package/dist/hooks/useStatefulConnect/useStatefulConnect.types.d.ts +2 -4
- package/dist/hooks/useStatefulConnect/useStatefulConnect.types.d.ts.map +1 -1
- package/dist/hooks/useSwapInput.d.ts.map +1 -1
- package/dist/hooks/useWalletList.d.ts.map +1 -1
- package/dist/hooks/useWalletProviders/useWalletProviders.d.ts +1 -1
- package/dist/hooks/useWalletProviders/useWalletProviders.d.ts.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +4 -4
- package/dist/pages/ConfirmSwapPage.d.ts.map +1 -1
- package/dist/store/quote.d.ts.map +1 -1
- package/dist/store/slices/config.d.ts +4 -0
- package/dist/store/slices/config.d.ts.map +1 -1
- package/dist/store/slices/wallets.d.ts +3 -1
- package/dist/store/slices/wallets.d.ts.map +1 -1
- package/dist/store/ui.d.ts +4 -0
- package/dist/store/ui.d.ts.map +1 -1
- package/dist/types/quote.d.ts +8 -17
- package/dist/types/quote.d.ts.map +1 -1
- package/dist/types/wallets.d.ts +1 -6
- package/dist/types/wallets.d.ts.map +1 -1
- package/dist/utils/providers.d.ts +6 -2
- package/dist/utils/providers.d.ts.map +1 -1
- package/dist/utils/quote.d.ts +5 -6
- package/dist/utils/quote.d.ts.map +1 -1
- package/dist/utils/swap.d.ts +4 -4
- package/dist/utils/swap.d.ts.map +1 -1
- package/dist/utils/wallets.d.ts.map +1 -1
- package/dist/widget-embedded.build.json +1 -1
- package/package.json +7 -7
- package/src/QueueManager.tsx +11 -10
- package/src/components/ConfirmWalletsModal/ConfirmWalletsModal.tsx +2 -19
- package/src/components/ConfirmWalletsModal/WalletList.tsx +1 -1
- package/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.helpers.ts +42 -22
- package/src/components/Quotes/Quotes.tsx +2 -3
- package/src/components/SwapDetails/SwapDetails.tsx +10 -7
- package/src/components/SwapDetailsModal/SwapDetailsCompleteModal.tsx +26 -13
- package/src/components/WalletStatefulConnect/Namespaces.tsx +30 -37
- package/src/constants/quote.ts +23 -0
- package/src/containers/QuoteInfo/QuoteInfo.tsx +3 -9
- package/src/containers/Wallets/Wallets.tsx +63 -3
- package/src/containers/WidgetInfo/WidgetInfo.helpers.ts +2 -2
- package/src/hooks/useConfirmSwap/useConfirmSwap.helpers.ts +29 -66
- package/src/hooks/useConfirmSwap/useConfirmSwap.ts +10 -15
- package/src/hooks/useFetchApiConfig.ts +5 -1
- package/src/hooks/useStatefulConnect/useStatefulConnect.ts +20 -22
- package/src/hooks/useStatefulConnect/useStatefulConnect.types.ts +2 -4
- package/src/hooks/useSwapInput.ts +2 -9
- package/src/hooks/useWalletList.ts +6 -6
- package/src/hooks/useWalletProviders/useWalletProviders.ts +7 -7
- package/src/pages/ConfirmSwapPage.tsx +7 -15
- package/src/store/quote.ts +3 -13
- package/src/store/slices/config.ts +73 -0
- package/src/store/slices/data.test.ts +23 -1
- package/src/store/slices/wallets.ts +13 -2
- package/src/store/ui.ts +6 -0
- package/src/types/quote.ts +10 -24
- package/src/types/wallets.ts +1 -6
- package/src/utils/providers.ts +66 -70
- package/src/utils/quote.ts +57 -45
- package/src/utils/swap.ts +55 -36
- package/src/utils/wallets.ts +2 -4
- package/dist/constants/warnings.d.ts +0 -3
- package/dist/constants/warnings.d.ts.map +0 -1
- package/dist/utils/hub.d.ts +0 -4
- package/dist/utils/hub.d.ts.map +0 -1
- package/src/constants/warnings.ts +0 -26
- 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
|
|
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
|
|
14
|
-
import {
|
|
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
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
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(
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
findToken
|
|
111
|
-
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
|
-
|
|
150
|
-
|
|
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
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
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
|
-
|
|
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
|
-
|
|
121
|
-
|
|
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.
|
|
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
|
-
|
|
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:
|
|
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.
|
|
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.
|
|
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.
|
|
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
|
-
|
|
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(
|
|
166
|
-
|
|
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
|
-
|
|
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
|
-
}
|
|
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
|
-
|
|
11
|
+
configWallets: WidgetConfig['wallets'],
|
|
13
12
|
options?: ProvidersOptions
|
|
14
13
|
) {
|
|
15
|
-
const { clearConnectedWallet } =
|
|
16
|
-
|
|
14
|
+
const { clearConnectedWallet, getAvailableProviders, buildAndSetProviders } =
|
|
15
|
+
useAppStore();
|
|
16
|
+
const providers = getAvailableProviders();
|
|
17
17
|
|
|
18
18
|
useEffect(() => {
|
|
19
19
|
clearConnectedWallet();
|
|
20
|
-
|
|
20
|
+
buildAndSetProviders();
|
|
21
21
|
}, [
|
|
22
|
-
hashProviders(
|
|
22
|
+
hashProviders(configWallets ?? []),
|
|
23
23
|
options?.walletConnectProjectId,
|
|
24
24
|
options?.walletConnectListedDesktopWalletLink,
|
|
25
25
|
]);
|
|
26
26
|
|
|
27
27
|
return {
|
|
28
|
-
providers
|
|
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
|
-
|
|
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(
|
package/src/store/quote.ts
CHANGED
|
@@ -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 =
|
|
141
|
-
|
|
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: (
|
|
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;
|