@rango-dev/widget-embedded 0.20.1-next.1 → 0.20.1-next.11
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/components/ConfirmWalletsModal/ConfirmWallets.styles.d.ts +1 -0
- package/dist/components/ConfirmWalletsModal/ConfirmWallets.styles.d.ts.map +1 -1
- package/dist/components/HeaderButtons/HeaderButtons.styles.d.ts +159 -0
- package/dist/components/HeaderButtons/HeaderButtons.styles.d.ts.map +1 -1
- package/dist/components/HeaderButtons/HeaderButtons.types.d.ts +0 -1
- package/dist/components/HeaderButtons/HeaderButtons.types.d.ts.map +1 -1
- package/dist/components/HeaderButtons/HomeButtons.d.ts.map +1 -1
- package/dist/components/HeaderButtons/RefreshButton.d.ts +6 -0
- package/dist/components/HeaderButtons/RefreshButton.d.ts.map +1 -0
- package/dist/components/Quote/Quote.d.ts.map +1 -1
- package/dist/components/Quote/Quote.styles.d.ts +157 -0
- package/dist/components/Quote/Quote.styles.d.ts.map +1 -1
- package/dist/components/Quote/QuoteSummary.d.ts.map +1 -1
- package/dist/components/SwapDetails/SwapDetails.d.ts.map +1 -1
- package/dist/components/SwapDetails/SwapDetails.helpers.d.ts.map +1 -1
- package/dist/components/SwapDetailsModal/SwapDetailsCompleteModal.d.ts.map +1 -1
- package/dist/components/SwapDetailsModal/SwapDetailsModal.types.d.ts +2 -0
- package/dist/components/SwapDetailsModal/SwapDetailsModal.types.d.ts.map +1 -1
- package/dist/components/SwapsGroup/SwapsGroup.d.ts.map +1 -1
- package/dist/constants/routing.d.ts +1 -0
- package/dist/constants/routing.d.ts.map +1 -1
- package/dist/containers/Wallets/Wallets.d.ts.map +1 -1
- package/dist/hooks/usePrepareBlockchainList/usePrepareBlockchainList.helpers.d.ts +2 -2
- package/dist/hooks/useSwapInput.d.ts.map +1 -1
- package/dist/hooks/useSyncStoresWithConfig.d.ts.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.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/LiquiditySourcePage.d.ts.map +1 -1
- package/dist/pages/SelectSwapItemsPage.d.ts.map +1 -1
- package/dist/store/slices/data.d.ts.map +1 -1
- package/dist/types/config.d.ts +16 -3
- package/dist/types/config.d.ts.map +1 -1
- package/dist/utils/configs.d.ts +8 -0
- package/dist/utils/configs.d.ts.map +1 -1
- package/dist/utils/date.d.ts.map +1 -1
- package/dist/utils/numbers.d.ts +1 -5
- package/dist/utils/numbers.d.ts.map +1 -1
- package/dist/utils/settings.d.ts +1 -1
- package/dist/utils/time.d.ts.map +1 -1
- package/package.json +6 -6
- package/src/components/ConfirmWalletsModal/ConfirmWalletsModal.tsx +1 -1
- package/src/components/HeaderButtons/HeaderButtons.styles.ts +16 -1
- package/src/components/HeaderButtons/HeaderButtons.types.ts +0 -1
- package/src/components/HeaderButtons/HomeButtons.tsx +20 -33
- package/src/components/HeaderButtons/RefreshButton.tsx +81 -0
- package/src/components/Quote/Quote.styles.ts +5 -1
- package/src/components/Quote/Quote.tsx +53 -15
- package/src/components/Quote/QuoteSummary.tsx +20 -4
- package/src/components/Slippage/Slippage.tsx +5 -5
- package/src/components/Slippage/SlippageTooltipContent.tsx +1 -1
- package/src/components/SwapDetails/SwapDetails.helpers.tsx +7 -1
- package/src/components/SwapDetails/SwapDetails.tsx +21 -1
- package/src/components/SwapDetailsModal/SwapDetailsCompleteModal.tsx +6 -0
- package/src/components/SwapDetailsModal/SwapDetailsModal.types.ts +2 -0
- package/src/components/SwapsGroup/SwapsGroup.tsx +28 -11
- package/src/constants/routing.ts +2 -0
- package/src/containers/Wallets/Wallets.tsx +11 -2
- package/src/hooks/useSwapInput.ts +6 -2
- package/src/hooks/useSyncStoresWithConfig.ts +17 -34
- package/src/index.ts +2 -0
- package/src/pages/ConfirmSwapPage.tsx +12 -10
- package/src/pages/Home.tsx +16 -2
- package/src/pages/LiquiditySourcePage.tsx +5 -2
- package/src/pages/SelectBlockchainPage.tsx +3 -3
- package/src/pages/SelectSwapItemsPage.tsx +5 -1
- package/src/store/slices/data.ts +5 -7
- package/src/types/config.ts +16 -3
- package/src/utils/configs.ts +41 -0
- package/src/utils/date.ts +24 -9
- package/src/utils/numbers.ts +8 -58
- package/src/utils/time.ts +25 -69
package/src/utils/configs.ts
CHANGED
|
@@ -1,10 +1,21 @@
|
|
|
1
|
+
import type { Tokens } from '../types';
|
|
2
|
+
import type { Asset, BlockchainMeta, Token } from 'rango-sdk';
|
|
3
|
+
|
|
1
4
|
import { RANGO_PUBLIC_API_KEY } from '../constants';
|
|
2
5
|
|
|
6
|
+
import { tokensAreEqual } from './wallets';
|
|
7
|
+
|
|
3
8
|
export interface Configs {
|
|
4
9
|
API_KEY: string;
|
|
5
10
|
BASE_URL?: string;
|
|
6
11
|
}
|
|
7
12
|
|
|
13
|
+
type TokensConfig =
|
|
14
|
+
| Asset[]
|
|
15
|
+
| {
|
|
16
|
+
[blockchain: string]: Tokens;
|
|
17
|
+
};
|
|
18
|
+
|
|
8
19
|
let configs: Configs = {
|
|
9
20
|
API_KEY: RANGO_PUBLIC_API_KEY,
|
|
10
21
|
};
|
|
@@ -38,3 +49,33 @@ export const DEFAULT_SECONDARY_RADIUS = 25;
|
|
|
38
49
|
export const DEFAULT_FONT_FAMILY = 'Roboto';
|
|
39
50
|
|
|
40
51
|
export const THEME_CLASS_NAME_PREFIX = `theme-widget`;
|
|
52
|
+
|
|
53
|
+
export const isTokenExcludedInConfig = (
|
|
54
|
+
token: Token | null,
|
|
55
|
+
tokensConfig?: TokensConfig
|
|
56
|
+
) => {
|
|
57
|
+
let result = false;
|
|
58
|
+
if (tokensConfig && token) {
|
|
59
|
+
if (Array.isArray(tokensConfig)) {
|
|
60
|
+
result = !tokensConfig.some((asset) => tokensAreEqual(asset, token));
|
|
61
|
+
} else if (!Array.isArray(tokensConfig) && tokensConfig[token.blockchain]) {
|
|
62
|
+
result = tokensConfig[token.blockchain].tokens.some((asset) =>
|
|
63
|
+
tokensAreEqual(asset, token)
|
|
64
|
+
);
|
|
65
|
+
const isExcluded = tokensConfig[token.blockchain].isExcluded;
|
|
66
|
+
return (!isExcluded && !result) || (isExcluded && result);
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
return result;
|
|
70
|
+
};
|
|
71
|
+
|
|
72
|
+
export const isBlockchainExcludedInConfig = (
|
|
73
|
+
blockchain: BlockchainMeta | null,
|
|
74
|
+
blockchainsConfig?: string[]
|
|
75
|
+
) => {
|
|
76
|
+
return (
|
|
77
|
+
blockchain &&
|
|
78
|
+
blockchainsConfig &&
|
|
79
|
+
!blockchainsConfig.includes(blockchain.name)
|
|
80
|
+
);
|
|
81
|
+
};
|
package/src/utils/date.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { GroupBy } from '../components/SwapsGroup/SwapsGroup.types';
|
|
2
2
|
import type { PendingSwap } from 'rango-types';
|
|
3
3
|
|
|
4
|
+
import { i18n } from '@lingui/core';
|
|
4
5
|
import dayjs from 'dayjs';
|
|
5
6
|
|
|
6
7
|
export const groupSwapsByDate: GroupBy = (swaps) => {
|
|
@@ -14,44 +15,58 @@ export const groupSwapsByDate: GroupBy = (swaps) => {
|
|
|
14
15
|
[
|
|
15
16
|
'today',
|
|
16
17
|
{
|
|
17
|
-
title: 'Today',
|
|
18
|
+
title: i18n.t('Today'),
|
|
18
19
|
swaps: [],
|
|
19
20
|
},
|
|
20
21
|
],
|
|
21
22
|
[
|
|
22
|
-
'
|
|
23
|
+
'week',
|
|
23
24
|
{
|
|
24
|
-
title: '
|
|
25
|
+
title: i18n.t('This week'),
|
|
25
26
|
swaps: [],
|
|
26
27
|
},
|
|
27
28
|
],
|
|
28
29
|
[
|
|
29
|
-
'
|
|
30
|
+
'month',
|
|
30
31
|
{
|
|
31
|
-
title: '
|
|
32
|
+
title: i18n.t('This month'),
|
|
32
33
|
swaps: [],
|
|
33
34
|
},
|
|
34
35
|
],
|
|
35
36
|
[
|
|
36
|
-
'
|
|
37
|
+
'year',
|
|
37
38
|
{
|
|
38
|
-
title: '
|
|
39
|
+
title: i18n.t('This year'),
|
|
39
40
|
swaps: [],
|
|
40
41
|
},
|
|
41
42
|
],
|
|
42
43
|
]);
|
|
43
44
|
|
|
45
|
+
function addYearsToOutput(key: string, swap: PendingSwap) {
|
|
46
|
+
if (!output.has(key)) {
|
|
47
|
+
output.set(key, {
|
|
48
|
+
title: key,
|
|
49
|
+
swaps: [],
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
output.get(key)?.swaps.push(swap);
|
|
53
|
+
}
|
|
54
|
+
|
|
44
55
|
const now = dayjs();
|
|
45
56
|
swaps.forEach((swap) => {
|
|
46
|
-
const
|
|
57
|
+
const time = Number(swap.creationTime);
|
|
58
|
+
const swapDate = dayjs(time);
|
|
47
59
|
if (now.isSame(swapDate, 'day')) {
|
|
48
60
|
output.get('today')?.swaps.push(swap);
|
|
61
|
+
} else if (now.isSame(swapDate, 'week')) {
|
|
62
|
+
output.get('week')?.swaps.push(swap);
|
|
49
63
|
} else if (now.isSame(swapDate, 'month')) {
|
|
50
64
|
output.get('month')?.swaps.push(swap);
|
|
51
65
|
} else if (now.isSame(swapDate, 'year')) {
|
|
52
66
|
output.get('year')?.swaps.push(swap);
|
|
53
67
|
} else {
|
|
54
|
-
|
|
68
|
+
const year = new Date(time).getFullYear().toString();
|
|
69
|
+
addYearsToOutput(year, swap);
|
|
55
70
|
}
|
|
56
71
|
});
|
|
57
72
|
|
package/src/utils/numbers.ts
CHANGED
|
@@ -4,8 +4,7 @@ import type { BestRouteResponse } from 'rango-sdk';
|
|
|
4
4
|
|
|
5
5
|
import { BigNumber } from 'bignumber.js';
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
(p * 100).toFixed(fractions);
|
|
7
|
+
import { TOOLTIP_DECIMALS } from '../constants/routing';
|
|
9
8
|
|
|
10
9
|
export const secondsToString = (s: number): string => {
|
|
11
10
|
const seconds = (s % 60).toString().padStart(2, '0');
|
|
@@ -96,13 +95,6 @@ export const numberToString = (
|
|
|
96
95
|
);
|
|
97
96
|
};
|
|
98
97
|
|
|
99
|
-
export const convertBigNumberToHex = (
|
|
100
|
-
value: BigNumber,
|
|
101
|
-
decimals: number
|
|
102
|
-
): string => {
|
|
103
|
-
return '0x' + value.shiftedBy(decimals).toString(16);
|
|
104
|
-
};
|
|
105
|
-
|
|
106
98
|
export const uint8ArrayToHex = (buffer: Uint8Array): string => {
|
|
107
99
|
// buffer is an ArrayBuffer
|
|
108
100
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
@@ -110,43 +102,6 @@ export const uint8ArrayToHex = (buffer: Uint8Array): string => {
|
|
|
110
102
|
return [...buffer].map((x) => x.toString(16).padStart(2, '0')).join('');
|
|
111
103
|
};
|
|
112
104
|
|
|
113
|
-
export function dollarToConciseString(num: number | undefined): string {
|
|
114
|
-
if (!num) {
|
|
115
|
-
return '-';
|
|
116
|
-
}
|
|
117
|
-
if (num < 1) {
|
|
118
|
-
return ' < 1$';
|
|
119
|
-
}
|
|
120
|
-
if (num < 1000) {
|
|
121
|
-
return numberToString(new BigNumber(num)) + '$';
|
|
122
|
-
}
|
|
123
|
-
if (num < 10_000) {
|
|
124
|
-
return parseInt((num / 100).toString()) / 10 + 'K';
|
|
125
|
-
}
|
|
126
|
-
if (num < 1_000_000) {
|
|
127
|
-
return parseInt((num / 1000).toString()) + 'K';
|
|
128
|
-
}
|
|
129
|
-
if (num < 100_000_000) {
|
|
130
|
-
return parseInt((num / 100000).toString()) / 10 + 'M';
|
|
131
|
-
}
|
|
132
|
-
return parseInt((num / 1000000).toString()) + 'M';
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
export function removeExtraDecimals(num: string, maxDecimals: number): string {
|
|
136
|
-
try {
|
|
137
|
-
if (!num.includes('.')) {
|
|
138
|
-
return num;
|
|
139
|
-
}
|
|
140
|
-
const [b, f] = num.split('.');
|
|
141
|
-
if (f && f.length > maxDecimals) {
|
|
142
|
-
return `${b}.${f.substring(0, maxDecimals)}`;
|
|
143
|
-
}
|
|
144
|
-
return num;
|
|
145
|
-
} catch (e) {
|
|
146
|
-
return num;
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
|
|
150
105
|
export const totalArrivalTime = (
|
|
151
106
|
data: { estimatedTimeInSeconds: number | null }[] | undefined
|
|
152
107
|
) => data?.reduce((a, b) => a + (b.estimatedTimeInSeconds ?? 0), 0) || 0;
|
|
@@ -167,16 +122,11 @@ export const isPositiveNumber = (text?: string) =>
|
|
|
167
122
|
!!text && parseFloat(text) > 0;
|
|
168
123
|
10;
|
|
169
124
|
|
|
170
|
-
export function
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
} // Return the original string if it's not a valid number
|
|
178
|
-
|
|
179
|
-
const multiplier = Math.pow(10, maxDecimalPlaces);
|
|
180
|
-
const roundedNumber = Math.round(number * multiplier) / multiplier;
|
|
181
|
-
return roundedNumber.toString();
|
|
125
|
+
export function formatTooltipNumbers(
|
|
126
|
+
number: BigNumber | string | number | null | undefined
|
|
127
|
+
) {
|
|
128
|
+
return numberToString(number, TOOLTIP_DECIMALS, TOOLTIP_DECIMALS).replace(
|
|
129
|
+
/(?:\.0*|(\.\d+?)0*)$/,
|
|
130
|
+
'$1'
|
|
131
|
+
);
|
|
182
132
|
}
|
package/src/utils/time.ts
CHANGED
|
@@ -2,76 +2,32 @@ import type { PendingSwap } from 'rango-types';
|
|
|
2
2
|
|
|
3
3
|
import { i18n } from '@lingui/core';
|
|
4
4
|
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
const
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
{
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
pluralLabel: i18n.t('months'),
|
|
27
|
-
},
|
|
28
|
-
{
|
|
29
|
-
turningPoint: SECONDS_PER_DAY,
|
|
30
|
-
label: i18n.t('day'),
|
|
31
|
-
pluralLabel: i18n.t('days'),
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
turningPoint: SECONDS_PER_HOUR,
|
|
35
|
-
label: i18n.t('hour'),
|
|
36
|
-
pluralLabel: i18n.t('hours'),
|
|
37
|
-
},
|
|
38
|
-
{
|
|
39
|
-
turningPoint: SECONDS_PER_MINUTE,
|
|
40
|
-
label: i18n.t('minute'),
|
|
41
|
-
pluralLabel: i18n.t('minutes'),
|
|
42
|
-
},
|
|
43
|
-
];
|
|
44
|
-
|
|
45
|
-
const sortedIntervals = intervals.sort(
|
|
46
|
-
(a, b) => b.turningPoint - a.turningPoint
|
|
47
|
-
);
|
|
48
|
-
|
|
49
|
-
for (const interval of sortedIntervals) {
|
|
50
|
-
const { turningPoint, label, pluralLabel } = interval;
|
|
51
|
-
const intervalCount = Math.floor(seconds / turningPoint);
|
|
52
|
-
if (intervalCount > 1) {
|
|
53
|
-
return `${intervalCount} ${pluralLabel}`;
|
|
54
|
-
}
|
|
55
|
-
if (intervalCount === 1) {
|
|
56
|
-
return `${intervalCount} ${label}`;
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
if (seconds > 1) {
|
|
61
|
-
return `${seconds} ${i18n.t('seconds')}`;
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
return `${seconds} ${i18n.t('second')}`;
|
|
5
|
+
const daysOfWeek = [
|
|
6
|
+
i18n.t('Sunday'),
|
|
7
|
+
i18n.t('Monday'),
|
|
8
|
+
i18n.t('Tuesday'),
|
|
9
|
+
i18n.t('Wednesday'),
|
|
10
|
+
i18n.t('Thursday'),
|
|
11
|
+
i18n.t('Friday'),
|
|
12
|
+
i18n.t('Saturday'),
|
|
13
|
+
];
|
|
14
|
+
|
|
15
|
+
export function timeSince(millisecond: number) {
|
|
16
|
+
const date = new Date(millisecond);
|
|
17
|
+
const day = date.getDate();
|
|
18
|
+
const month = date.toLocaleString('default', { month: 'long' });
|
|
19
|
+
const year = date.getFullYear();
|
|
20
|
+
const isToday = date.getDay() === new Date().getDay();
|
|
21
|
+
const formattedDate = isToday
|
|
22
|
+
? i18n.t('Today')
|
|
23
|
+
: `${daysOfWeek[date.getDay()]} ${day} ${month} ${year}`;
|
|
24
|
+
|
|
25
|
+
return `${formattedDate}, ${new Date(millisecond).toLocaleTimeString()}`;
|
|
65
26
|
}
|
|
66
27
|
|
|
67
28
|
export function getSwapDate(pendingSwap: PendingSwap) {
|
|
68
|
-
|
|
69
|
-
?
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
})
|
|
73
|
-
: i18n.t({
|
|
74
|
-
id: '{time} ago',
|
|
75
|
-
values: { time: timeSince(parseInt(pendingSwap.creationTime)) },
|
|
76
|
-
});
|
|
29
|
+
const time = pendingSwap.finishTime
|
|
30
|
+
? timeSince(parseInt(pendingSwap.finishTime))
|
|
31
|
+
: timeSince(parseInt(pendingSwap.creationTime));
|
|
32
|
+
return time;
|
|
77
33
|
}
|