@rango-dev/widget-embedded 0.14.1-next.9 → 0.16.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/CHANGELOG.md +4 -0
- package/dist/Widget.d.ts.map +1 -1
- package/dist/components/BlockchainList/BlockchainList.styles.d.ts +2 -0
- package/dist/components/BlockchainList/BlockchainList.styles.d.ts.map +1 -1
- package/dist/components/BlockchainsSection/BlockchainsSection.d.ts.map +1 -1
- package/dist/components/BlockchainsSection/BlockchainsSection.styles.d.ts +1 -0
- package/dist/components/BlockchainsSection/BlockchainsSection.styles.d.ts.map +1 -1
- package/dist/components/ConfirmWalletsModal/ConfirmWallets.styles.d.ts +15 -0
- package/dist/components/ConfirmWalletsModal/ConfirmWallets.styles.d.ts.map +1 -1
- package/dist/components/ConfirmWalletsModal/ConfirmWalletsModal.d.ts.map +1 -1
- package/dist/components/ConfirmWalletsModal/WalletList.d.ts.map +1 -1
- package/dist/components/ConfirmWalletsModal/WalletList.styles.d.ts +3 -0
- package/dist/components/ConfirmWalletsModal/WalletList.styles.d.ts.map +1 -1
- package/dist/components/HeaderButtons/HeaderButtons.styles.d.ts +4 -0
- package/dist/components/HeaderButtons/HeaderButtons.styles.d.ts.map +1 -1
- package/dist/components/Layout/Layout.styles.d.ts +3 -0
- package/dist/components/Layout/Layout.styles.d.ts.map +1 -1
- package/dist/components/LoadingLiquiditySourceList/LoadingLiquiditySourceList.styles.d.ts +1 -0
- package/dist/components/LoadingLiquiditySourceList/LoadingLiquiditySourceList.styles.d.ts.map +1 -1
- package/dist/components/LoadingSwapDetails/LoadingSwapDetails.styles.d.ts +3 -0
- package/dist/components/LoadingSwapDetails/LoadingSwapDetails.styles.d.ts.map +1 -1
- package/dist/components/NoRoutes/NoRoutes.styles.d.ts +3 -0
- package/dist/components/NoRoutes/NoRoutes.styles.d.ts.map +1 -1
- package/dist/components/NotificationContent/NotificationContent.styles.d.ts +4 -0
- package/dist/components/NotificationContent/NotificationContent.styles.d.ts.map +1 -1
- package/dist/components/RouteErrors/RouteErrors.styles.d.ts +4 -0
- package/dist/components/RouteErrors/RouteErrors.styles.d.ts.map +1 -1
- package/dist/components/SearchInput/SearchInput.styles.d.ts +1 -0
- package/dist/components/SearchInput/SearchInput.styles.d.ts.map +1 -1
- package/dist/components/SettingsContainer/SettingsContainer.style.d.ts +4 -0
- package/dist/components/SettingsContainer/SettingsContainer.style.d.ts.map +1 -1
- package/dist/components/Slippage/Slippage.styles.d.ts +4 -0
- package/dist/components/Slippage/Slippage.styles.d.ts.map +1 -1
- package/dist/components/SwapDetails/SwapDetails.Placeholder.d.ts.map +1 -1
- package/dist/components/SwapDetails/SwapDetails.d.ts.map +1 -1
- package/dist/components/SwapDetails/SwapDetails.styles.d.ts +6 -0
- package/dist/components/SwapDetails/SwapDetails.styles.d.ts.map +1 -1
- package/dist/components/SwapDetailsAlerts/SwapDetailsAlerts.styles.d.ts +1 -0
- package/dist/components/SwapDetailsAlerts/SwapDetailsAlerts.styles.d.ts.map +1 -1
- package/dist/components/SwapDetailsModal/SwapDetailsModal.styles.d.ts +1 -0
- package/dist/components/SwapDetailsModal/SwapDetailsModal.styles.d.ts.map +1 -1
- package/dist/components/SwapsGroup/SwapsGroup.styles.d.ts +4 -0
- package/dist/components/SwapsGroup/SwapsGroup.styles.d.ts.map +1 -1
- package/dist/components/TokenList/TokenList.styles.d.ts +10 -0
- package/dist/components/TokenList/TokenList.styles.d.ts.map +1 -1
- package/dist/components/WalletModal/WalletModalContent.styles.d.ts +4 -0
- package/dist/components/WalletModal/WalletModalContent.styles.d.ts.map +1 -1
- package/dist/constants/configs.d.ts +2 -0
- package/dist/constants/configs.d.ts.map +1 -0
- package/dist/constants/errors.d.ts +1 -1
- package/dist/constants/errors.d.ts.map +1 -1
- package/dist/constants/languages.d.ts +11 -0
- package/dist/constants/languages.d.ts.map +1 -0
- package/dist/constants/messages.d.ts +1 -1
- package/dist/constants/messages.d.ts.map +1 -1
- package/dist/hooks/useLanguage.d.ts +11 -0
- package/dist/hooks/useLanguage.d.ts.map +1 -0
- package/dist/hooks/usePrepareBlockchainList/index.d.ts +2 -0
- package/dist/hooks/usePrepareBlockchainList/index.d.ts.map +1 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.constants.d.ts +2 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.constants.d.ts.map +1 -0
- package/dist/hooks/{usePrepareBlockchainList.d.ts → usePrepareBlockchainList/usePrepareBlockchainList.d.ts} +1 -9
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.d.ts.map +1 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.helpers.d.ts +10 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.helpers.d.ts.map +1 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.mock.d.ts +3 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.mock.d.ts.map +1 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.test.d.ts +2 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.test.d.ts.map +1 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.types.d.ts +11 -0
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.types.d.ts.map +1 -0
- package/dist/hooks/useSyncStoresWithConfig.d.ts.map +1 -1
- package/dist/hooks/useTheme.d.ts +1 -1
- package/dist/hooks/useTheme.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +4 -4
- package/dist/pages/ConfirmSwapPage.d.ts.map +1 -1
- package/dist/pages/Home.d.ts.map +1 -1
- package/dist/pages/LanguagePage.d.ts.map +1 -1
- package/dist/store/settings.d.ts +15 -6
- package/dist/store/settings.d.ts.map +1 -1
- package/dist/types/config.d.ts +7 -3
- package/dist/types/config.d.ts.map +1 -1
- package/dist/utils/colors.d.ts +1 -1
- package/dist/utils/colors.d.ts.map +1 -1
- package/dist/utils/configs.d.ts +2 -0
- package/dist/utils/configs.d.ts.map +1 -1
- package/dist/utils/hash.d.ts +2 -0
- package/dist/utils/hash.d.ts.map +1 -0
- package/dist/utils/swap.d.ts.map +1 -1
- package/dist/utils/time.d.ts.map +1 -1
- package/dist/utils/ui.d.ts +13 -0
- package/dist/utils/ui.d.ts.map +1 -0
- package/dist/utils/wallets.d.ts +0 -1
- package/dist/utils/wallets.d.ts.map +1 -1
- package/package.json +8 -8
- package/src/Widget.tsx +14 -2
- package/src/components/BlockchainsSection/BlockchainsSection.tsx +21 -6
- package/src/components/ConfirmWalletsModal/ConfirmWalletsModal.tsx +5 -11
- package/src/components/ConfirmWalletsModal/WalletList.tsx +35 -24
- package/src/components/Layout/Layout.styles.ts +7 -2
- package/src/components/LoadingSwapDetails/LoadingSwapDetails.styles.ts +1 -1
- package/src/components/NoRoutes/NoRoutes.helper.ts +4 -4
- package/src/components/NoRoutes/NoRoutes.tsx +2 -2
- package/src/components/NotificationContent/NotificationContent.tsx +1 -1
- package/src/components/NotificationContent/NotificationNotFound.tsx +1 -1
- package/src/components/RouteErrors/RouteErrors.tsx +2 -2
- package/src/components/RouteErrors/RouteErrorsModal.tsx +6 -6
- package/src/components/RouteErrors/RouteErrorsModalItem.tsx +1 -1
- package/src/components/Slippage/SlippageTooltipContent.tsx +1 -1
- package/src/components/SwapDetails/SwapDetails.Placeholder.tsx +5 -6
- package/src/components/SwapDetails/SwapDetails.tsx +6 -10
- package/src/components/SwapDetailsModal/SwapDetailsCompleteModal.tsx +1 -1
- package/src/components/SwapsGroup/SwapsGroup.tsx +2 -2
- package/src/components/TokenList/TokenList.styles.ts +1 -1
- package/src/components/TokenList/TokenList.tsx +1 -1
- package/src/constants/configs.ts +1 -0
- package/src/constants/errors.ts +44 -41
- package/src/constants/languages.ts +19 -0
- package/src/constants/messages.ts +7 -5
- package/src/hooks/useConfirmSwap.ts +1 -1
- package/src/hooks/useLanguage.ts +27 -0
- package/src/hooks/usePrepareBlockchainList/index.ts +1 -0
- package/src/hooks/usePrepareBlockchainList/usePrepareBlockchainList.constants.ts +1 -0
- package/src/hooks/usePrepareBlockchainList/usePrepareBlockchainList.helpers.ts +108 -0
- package/src/hooks/usePrepareBlockchainList/usePrepareBlockchainList.mock.ts +3101 -0
- package/src/hooks/usePrepareBlockchainList/usePrepareBlockchainList.test.ts +273 -0
- package/src/hooks/usePrepareBlockchainList/usePrepareBlockchainList.ts +38 -0
- package/src/hooks/usePrepareBlockchainList/usePrepareBlockchainList.types.ts +12 -0
- package/src/hooks/useSyncStoresWithConfig.ts +49 -1
- package/src/hooks/useTheme.ts +34 -56
- package/src/pages/ConfirmSwapPage.tsx +9 -18
- package/src/pages/Home.tsx +6 -7
- package/src/pages/LanguagePage.tsx +16 -39
- package/src/pages/SettingsPage.tsx +1 -1
- package/src/store/settings.ts +46 -4
- package/src/types/config.ts +6 -2
- package/src/utils/colors.ts +16 -0
- package/src/utils/configs.ts +3 -0
- package/src/utils/hash.ts +27 -0
- package/src/utils/settings.ts +1 -1
- package/src/utils/swap.ts +15 -20
- package/src/utils/time.ts +2 -4
- package/src/utils/ui.ts +72 -0
- package/src/utils/wallets.ts +4 -25
- package/dist/hooks/usePrepareBlockchainList.d.ts.map +0 -1
- package/src/hooks/usePrepareBlockchainList.ts +0 -125
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
import type { BlockchainMeta } from 'rango-sdk';
|
|
2
|
-
|
|
3
|
-
import { useMemo, useRef } from 'react';
|
|
4
|
-
|
|
5
|
-
interface PrepareListOptions {
|
|
6
|
-
limit?: number;
|
|
7
|
-
selected?: string;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
interface PrepareListOutput {
|
|
11
|
-
list: BlockchainMeta[];
|
|
12
|
-
more: BlockchainMeta[];
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
/**
|
|
16
|
-
*
|
|
17
|
-
* UI needs some specific logics like limiting the list and sorting,
|
|
18
|
-
* this function is getting the raw blockchains list and return a list for showing in UI.
|
|
19
|
-
*
|
|
20
|
-
*/
|
|
21
|
-
export function usePrepareBlockchainList(
|
|
22
|
-
blockchains: BlockchainMeta[],
|
|
23
|
-
options?: PrepareListOptions
|
|
24
|
-
): PrepareListOutput {
|
|
25
|
-
const prevSelectedBlockchain = useRef({ index: -1, name: '' });
|
|
26
|
-
|
|
27
|
-
blockchains.sort(sortByMostUsedBlockchains);
|
|
28
|
-
|
|
29
|
-
const blockchainsHash = blockchains
|
|
30
|
-
.map((blockchain) => blockchain.name)
|
|
31
|
-
.join('-');
|
|
32
|
-
|
|
33
|
-
return useMemo(() => {
|
|
34
|
-
const list: BlockchainMeta[] = blockchains;
|
|
35
|
-
let more: BlockchainMeta[] = [];
|
|
36
|
-
|
|
37
|
-
// Checking `limit` has set and it should be more than of the list items.
|
|
38
|
-
if (options?.limit && blockchains.length > options.limit) {
|
|
39
|
-
const start = options.limit;
|
|
40
|
-
/** Try find the blockchain and returns the index. */
|
|
41
|
-
const selectedIndex = options.selected
|
|
42
|
-
? blockchains.findIndex(
|
|
43
|
-
(blockchains) => blockchains.name === options.selected
|
|
44
|
-
)
|
|
45
|
-
: -1;
|
|
46
|
-
|
|
47
|
-
const prevSelectedBlockchainWasInMoreSection =
|
|
48
|
-
prevSelectedBlockchain.current.index > options.limit - 1 &&
|
|
49
|
-
!!blockchains.find(
|
|
50
|
-
(blockchains) =>
|
|
51
|
-
blockchains.name === prevSelectedBlockchain.current.name
|
|
52
|
-
);
|
|
53
|
-
|
|
54
|
-
/*
|
|
55
|
-
* If the selected blockchain is in `more` section, we should move it to front of the list
|
|
56
|
-
*/
|
|
57
|
-
if (
|
|
58
|
-
options.selected &&
|
|
59
|
-
((prevSelectedBlockchainWasInMoreSection &&
|
|
60
|
-
selectedIndex < options.limit - 1) ||
|
|
61
|
-
selectedIndex > options.limit - 1)
|
|
62
|
-
) {
|
|
63
|
-
blockchains.sort(
|
|
64
|
-
generateSortBySelectedFor(
|
|
65
|
-
prevSelectedBlockchainWasInMoreSection
|
|
66
|
-
? prevSelectedBlockchain.current.name
|
|
67
|
-
: options.selected
|
|
68
|
-
)
|
|
69
|
-
);
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
/*
|
|
73
|
-
* Splice will modify the original list and returns the deleted items
|
|
74
|
-
* We use the deleted items as `more`
|
|
75
|
-
*/
|
|
76
|
-
more = list.splice(start);
|
|
77
|
-
prevSelectedBlockchain.current = {
|
|
78
|
-
index: selectedIndex,
|
|
79
|
-
name: options.selected ?? '',
|
|
80
|
-
};
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
return {
|
|
84
|
-
list,
|
|
85
|
-
more,
|
|
86
|
-
};
|
|
87
|
-
}, [blockchainsHash]);
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
function generateSortBySelectedFor(selected: string) {
|
|
91
|
-
/** Move `selected` blockchain to the front of list. */
|
|
92
|
-
return function sortBySelected(a: BlockchainMeta, b: BlockchainMeta) {
|
|
93
|
-
if (a.name === selected) {
|
|
94
|
-
return -1;
|
|
95
|
-
}
|
|
96
|
-
if (b.name === selected) {
|
|
97
|
-
return 1;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
return 0;
|
|
101
|
-
};
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
/** There is a hardcoded list of blockchains that we want to show them first in the list. */
|
|
105
|
-
function sortByMostUsedBlockchains(a: BlockchainMeta, b: BlockchainMeta) {
|
|
106
|
-
const mostUsed = ['ETH', 'COSMOS', 'OSMOSIS'];
|
|
107
|
-
const aIndexInMostUsed = mostUsed.findIndex((token) => token === a.name);
|
|
108
|
-
const bIndexInMostUsed = mostUsed.findIndex((token) => token === b.name);
|
|
109
|
-
const aIsMostUsed = aIndexInMostUsed > -1;
|
|
110
|
-
const bIsMostUsed = bIndexInMostUsed > -1;
|
|
111
|
-
|
|
112
|
-
if (aIsMostUsed && bIsMostUsed) {
|
|
113
|
-
return aIndexInMostUsed > bIndexInMostUsed ? 1 : -1;
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
if (aIsMostUsed) {
|
|
117
|
-
return -1;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
if (bIsMostUsed) {
|
|
121
|
-
return 1;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
return 0;
|
|
125
|
-
}
|