@rango-dev/widget-embedded 0.21.1-next.9 → 0.22.1

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 (66) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/dist/components/ConfirmWalletsModal/ConfirmWalletsModal.d.ts.map +1 -1
  3. package/dist/components/ConfirmWalletsModal/WalletList.d.ts.map +1 -1
  4. package/dist/components/Layout/Layout.d.ts.map +1 -1
  5. package/dist/components/Layout/Layout.styles.d.ts.map +1 -1
  6. package/dist/components/Layout/Layout.types.d.ts +0 -1
  7. package/dist/components/Layout/Layout.types.d.ts.map +1 -1
  8. package/dist/components/Quote/QuoteCostDetails.d.ts.map +1 -1
  9. package/dist/components/QuoteWarningsAndErrors/HighValueLossWarningModal.d.ts.map +1 -1
  10. package/dist/components/QuoteWarningsAndErrors/SlippageWariningModal.d.ts.map +1 -1
  11. package/dist/components/QuoteWarningsAndErrors/UnknownPriceWarningModal.d.ts.map +1 -1
  12. package/dist/components/SwapDetailsModal/SwapDetailsCompleteModal.d.ts.map +1 -1
  13. package/dist/components/SwapDetailsModal/SwapDetailsModal.WalletState.d.ts.map +1 -1
  14. package/dist/components/SwapDetailsModal/SwapDetailsModal.d.ts.map +1 -1
  15. package/dist/components/WalletModal/WalletModal.d.ts.map +1 -1
  16. package/dist/components/common/ActivateTabModal/ActivateTabModal.d.ts.map +1 -1
  17. package/dist/components/common/WatermarkedModal/WatermarkedModal.d.ts +5 -0
  18. package/dist/components/common/WatermarkedModal/WatermarkedModal.d.ts.map +1 -0
  19. package/dist/components/common/WatermarkedModal/index.d.ts +2 -0
  20. package/dist/components/common/WatermarkedModal/index.d.ts.map +1 -0
  21. package/dist/containers/App/App.d.ts.map +1 -1
  22. package/dist/containers/Widget/Widget.d.ts.map +1 -1
  23. package/dist/hooks/useFetchApiConfig.d.ts +7 -0
  24. package/dist/hooks/useFetchApiConfig.d.ts.map +1 -0
  25. package/dist/hooks/useWalletList.d.ts +0 -1
  26. package/dist/hooks/useWalletList.d.ts.map +1 -1
  27. package/dist/index.js +2 -2
  28. package/dist/index.js.map +4 -4
  29. package/dist/libs/tabManager/tabManager.d.ts +1 -0
  30. package/dist/libs/tabManager/tabManager.d.ts.map +1 -1
  31. package/dist/libs/tabManager/tabManager.types.d.ts +1 -0
  32. package/dist/libs/tabManager/tabManager.types.d.ts.map +1 -1
  33. package/dist/pages/Home.d.ts.map +1 -1
  34. package/dist/pages/WalletsPage.d.ts.map +1 -1
  35. package/dist/store/ui.d.ts +7 -2
  36. package/dist/store/ui.d.ts.map +1 -1
  37. package/dist/utils/wallets.d.ts +0 -1
  38. package/dist/utils/wallets.d.ts.map +1 -1
  39. package/package.json +2 -2
  40. package/src/components/ConfirmWalletsModal/ConfirmWalletsModal.tsx +7 -5
  41. package/src/components/ConfirmWalletsModal/WalletList.tsx +23 -29
  42. package/src/components/Layout/Layout.styles.ts +11 -4
  43. package/src/components/Layout/Layout.tsx +26 -22
  44. package/src/components/Layout/Layout.types.ts +0 -1
  45. package/src/components/Quote/QuoteCostDetails.tsx +3 -3
  46. package/src/components/QuoteWarningsAndErrors/HighValueLossWarningModal.tsx +4 -3
  47. package/src/components/QuoteWarningsAndErrors/SlippageWariningModal.tsx +5 -3
  48. package/src/components/QuoteWarningsAndErrors/UnknownPriceWarningModal.tsx +4 -4
  49. package/src/components/SwapDetailsModal/SwapDetailsCompleteModal.tsx +3 -3
  50. package/src/components/SwapDetailsModal/SwapDetailsModal.WalletState.tsx +3 -29
  51. package/src/components/SwapDetailsModal/SwapDetailsModal.tsx +3 -3
  52. package/src/components/WalletModal/WalletModal.tsx +4 -3
  53. package/src/components/common/ActivateTabModal/ActivateTabModal.tsx +9 -3
  54. package/src/components/common/WatermarkedModal/WatermarkedModal.tsx +18 -0
  55. package/src/components/common/WatermarkedModal/index.ts +1 -0
  56. package/src/containers/App/App.tsx +3 -1
  57. package/src/containers/Widget/Widget.tsx +3 -2
  58. package/src/containers/WidgetInfo/WidgetInfo.tsx +2 -2
  59. package/src/hooks/useFetchApiConfig.ts +33 -0
  60. package/src/hooks/useWalletList.ts +4 -20
  61. package/src/libs/tabManager/tabManager.ts +4 -1
  62. package/src/libs/tabManager/tabManager.types.ts +1 -0
  63. package/src/pages/Home.tsx +0 -1
  64. package/src/pages/WalletsPage.tsx +18 -24
  65. package/src/store/ui.ts +9 -5
  66. package/src/utils/wallets.ts +0 -4
@@ -6,6 +6,7 @@ export declare class TabManager implements TabManagerInterface {
6
6
  private events;
7
7
  private channel;
8
8
  constructor(events: Events);
9
+ init: () => void;
9
10
  /**
10
11
  * This is applicable when a user in an inactive tab seeks to activate that tab.
11
12
  */
@@ -1 +1 @@
1
- {"version":3,"file":"tabManager.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/tabManager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,MAAM,EAGN,mBAAmB,EACpB,MAAM,oBAAoB,CAAC;AAI5B,qBAAa,UAAW,YAAW,mBAAmB;IACpD,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,KAAK,CAAgE;IAC7E,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,MAAM,CAAc;IAC5B,OAAO,CAAC,OAAO,CAAmB;gBAEtB,MAAM,EAAE,MAAM;IAQ1B;;OAEG;IACH,UAAU,aAUR;IAEF,SAAS,gBAEP;IAEF;;OAEG;IACH,OAAO,aAOL;IAEF;;OAEG;IACH,OAAO,CAAC,UAAU;IAiBlB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,mBAAmB;IAY3B,OAAO,CAAC,kBAAkB,CAyBxB;IAEF,OAAO,CAAC,sBAAsB,CAI5B;IAEF,OAAO,CAAC,YAAY,CAOlB;IACF;;OAEG;IACH,OAAO,CAAC,0BAA0B;IAIlC;;;OAGG;YACW,QAAQ;IAatB;;;OAGG;IACH,OAAO,CAAC,KAAK;IAeb,OAAO,CAAC,KAAK;IAKb;;OAEG;IACH,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,cAAc;IAItB;;;OAGG;IACH,OAAO,CAAC,YAAY;CAcrB"}
1
+ {"version":3,"file":"tabManager.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/tabManager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,MAAM,EAGN,mBAAmB,EACpB,MAAM,oBAAoB,CAAC;AAI5B,qBAAa,UAAW,YAAW,mBAAmB;IACpD,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,KAAK,CAAgE;IAC7E,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,MAAM,CAAc;IAC5B,OAAO,CAAC,OAAO,CAAmB;gBAEtB,MAAM,EAAE,MAAM;IAM1B,IAAI,aAGF;IAEF;;OAEG;IACH,UAAU,aAUR;IAEF,SAAS,gBAEP;IAEF;;OAEG;IACH,OAAO,aAOL;IAEF;;OAEG;IACH,OAAO,CAAC,UAAU;IAiBlB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,mBAAmB;IAY3B,OAAO,CAAC,kBAAkB,CAyBxB;IAEF,OAAO,CAAC,sBAAsB,CAI5B;IAEF,OAAO,CAAC,YAAY,CAOlB;IACF;;OAEG;IACH,OAAO,CAAC,0BAA0B;IAIlC;;;OAGG;YACW,QAAQ;IAatB;;;OAGG;IACH,OAAO,CAAC,KAAK;IAeb,OAAO,CAAC,KAAK;IAKb;;OAEG;IACH,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,cAAc;IAItB;;;OAGG;IACH,OAAO,CAAC,YAAY;CAcrB"}
@@ -21,6 +21,7 @@ export type Events = {
21
21
  onRelease?: () => void;
22
22
  };
23
23
  export interface TabManagerInterface {
24
+ init: () => void;
24
25
  forceClaim: () => void;
25
26
  isClaimed: () => boolean;
26
27
  destroy: () => void;
@@ -1 +1 @@
1
- {"version":3,"file":"tabManager.types.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/tabManager.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,EAAE,GAAG,MAAM,CAAC;AAExB,KAAK,WAAW,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AACpD,KAAK,WAAW,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AACpC,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,aAAa,CAAC;IACpB,WAAW,EAAE,EAAE,CAAC;CACjB,CAAC;AACF,KAAK,mBAAmB,GAAG;IAAE,IAAI,EAAE,eAAe,CAAC;IAAC,WAAW,EAAE,EAAE,CAAA;CAAE,CAAC;AAEtE,MAAM,MAAM,OAAO,GACf,WAAW,GACX,WAAW,GACX,iBAAiB,GACjB,mBAAmB,CAAC;AAExB,MAAM,MAAM,MAAM,GAAG;IAEnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,OAAO,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB"}
1
+ {"version":3,"file":"tabManager.types.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/tabManager.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,EAAE,GAAG,MAAM,CAAC;AAExB,KAAK,WAAW,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AACpD,KAAK,WAAW,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AACpC,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,aAAa,CAAC;IACpB,WAAW,EAAE,EAAE,CAAC;CACjB,CAAC;AACF,KAAK,mBAAmB,GAAG;IAAE,IAAI,EAAE,eAAe,CAAC;IAAC,WAAW,EAAE,EAAE,CAAA;CAAE,CAAC;AAEtE,MAAM,MAAM,OAAO,GACf,WAAW,GACX,WAAW,GACX,iBAAiB,GACjB,mBAAmB,CAAC;AAExB,MAAM,MAAM,MAAM,GAAG;IAEnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,OAAO,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB"}
@@ -1 +1 @@
1
- {"version":3,"file":"Home.d.ts","sourceRoot":"","sources":["../../src/pages/Home.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAuCnD,wBAAgB,IAAI,sBAyPnB"}
1
+ {"version":3,"file":"Home.d.ts","sourceRoot":"","sources":["../../src/pages/Home.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAuCnD,wBAAgB,IAAI,sBAwPnB"}
@@ -1 +1 @@
1
- {"version":3,"file":"WalletsPage.d.ts","sourceRoot":"","sources":["../../src/pages/WalletsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAuBxC,eAAO,MAAM,mBAAmB,OAAQ,CAAC;AACzC,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,wBAAgB,WAAW,sBA0E1B"}
1
+ {"version":3,"file":"WalletsPage.d.ts","sourceRoot":"","sources":["../../src/pages/WalletsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAuBxC,eAAO,MAAM,mBAAmB,OAAQ,CAAC;AACzC,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,wBAAgB,WAAW,sBAoE1B"}
@@ -1,9 +1,13 @@
1
+ import type { Watermark } from '../hooks/useFetchApiConfig';
2
+ import type { TabManagerInterface } from '../libs/tabManager';
1
3
  interface UiState {
2
4
  isActiveTab: boolean;
3
5
  tabManagerInitiated: boolean;
4
6
  showActivateTabModal: boolean;
7
+ watermark: Watermark;
5
8
  activateCurrentTab: (setCurrentTabAsActive: () => void, hasRunningSwaps: boolean) => void;
6
9
  setShowActivateTabModal: (flag: boolean) => void;
10
+ setWatermark: (watermark: Watermark) => void;
7
11
  }
8
12
  export declare const useUiStore: {
9
13
  (): UiState;
@@ -14,11 +18,12 @@ export declare const useUiStore: {
14
18
  isActiveTab: () => boolean;
15
19
  tabManagerInitiated: () => boolean;
16
20
  showActivateTabModal: () => boolean;
21
+ watermark: () => Watermark;
17
22
  activateCurrentTab: () => (setCurrentTabAsActive: () => void, hasRunningSwaps: boolean) => void;
18
23
  setShowActivateTabModal: () => (flag: boolean) => void;
24
+ setWatermark: () => (watermark: Watermark) => void;
19
25
  };
20
26
  };
21
- export declare const setCurrentTabAsActive: () => void;
22
- export declare const destroyTabManager: () => void;
27
+ export declare const tabManager: TabManagerInterface;
23
28
  export {};
24
29
  //# sourceMappingURL=ui.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/store/ui.ts"],"names":[],"mappings":"AAQA,UAAU,OAAO;IACf,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,kBAAkB,EAAE,CAClB,qBAAqB,EAAE,MAAM,IAAI,EACjC,eAAe,EAAE,OAAO,KACrB,IAAI,CAAC;IACV,uBAAuB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD;AAED,eAAO,MAAM,UAAU;;;;;;;;;0DANI,MAAM,IAAI,mBAChB,OAAO,KACrB,IAAI;8CACuB,OAAO,KAAK,IAAI;;CAqBjD,CAAC;AASF,eAAO,MAAM,qBAAqB,YAAwB,CAAC;AAE3D,eAAO,MAAM,iBAAiB,YAAqB,CAAC"}
1
+ {"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/store/ui.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAQ9D,UAAU,OAAO;IACf,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,SAAS,EAAE,SAAS,CAAC;IACrB,kBAAkB,EAAE,CAClB,qBAAqB,EAAE,MAAM,IAAI,EACjC,eAAe,EAAE,OAAO,KACrB,IAAI,CAAC;IACV,uBAAuB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD,YAAY,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;CAC9C;AAED,eAAO,MAAM,UAAU;;;;;;;;;;0DAPI,MAAM,IAAI,mBAChB,OAAO,KACrB,IAAI;8CACuB,OAAO,KAAK,IAAI;wCACtB,SAAS,KAAK,IAAI;;CA0B7C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,mBAKvB,CAAC"}
@@ -29,5 +29,4 @@ export declare function getAddress({ chain, connectedWallets, walletType, }: {
29
29
  export declare function createTokenHash(token: Asset): TokenHash;
30
30
  export declare function makeTokensBalance(connectedWallets: ConnectedWallet[]): TokensBalance;
31
31
  export declare const isFetchingBalance: (connectedWallets: ConnectedWallet[], blockchain: string) => boolean;
32
- export declare function hashWalletsState(walletsInfo: ModalWalletInfo[]): string;
33
32
  //# sourceMappingURL=wallets.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/utils/wallets.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/utils/wallets.ts"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rango-dev/widget-embedded",
3
- "version": "0.21.1-next.9",
3
+ "version": "0.22.1",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "source": "./src/index.ts",
@@ -25,7 +25,7 @@
25
25
  "@rango-dev/queue-manager-core": "^0.25.0",
26
26
  "@rango-dev/queue-manager-rango-preset": "^0.26.0",
27
27
  "@rango-dev/queue-manager-react": "^0.25.0",
28
- "@rango-dev/ui": "^0.27.1-next.5",
28
+ "@rango-dev/ui": "^0.28.0",
29
29
  "@rango-dev/wallets-react": "^0.12.0",
30
30
  "@rango-dev/wallets-shared": "^0.26.0",
31
31
  "bignumber.js": "^9.1.1",
@@ -11,7 +11,6 @@ import {
11
11
  ChevronLeftIcon,
12
12
  Divider,
13
13
  MessageBox,
14
- Modal,
15
14
  Typography,
16
15
  WalletIcon,
17
16
  } from '@rango-dev/ui';
@@ -26,6 +25,7 @@ import { useQuoteStore } from '../../store/quote';
26
25
  import { useWalletsStore } from '../../store/wallets';
27
26
  import { getBlockchainShortNameFor } from '../../utils/meta';
28
27
  import { confirmSwapDisabled } from '../../utils/swap';
28
+ import { WatermarkedModal } from '../common/WatermarkedModal';
29
29
  import { CustomCollapsible } from '../CustomCollapsible/CustomCollapsible';
30
30
  import { ExpandedIcon } from '../CustomCollapsible/CustomCollapsible.styles';
31
31
 
@@ -52,6 +52,7 @@ export function ConfirmWalletsModal(props: PropTypes) {
52
52
  //TODO: move component's logics to a custom hook
53
53
  const { open, onClose, onCancel, onCheckBalance, loading } = props;
54
54
  const config = useAppStore().config;
55
+
55
56
  const blockchains = useAppStore().blockchains();
56
57
  const {
57
58
  quote,
@@ -232,8 +233,9 @@ export function ConfirmWalletsModal(props: PropTypes) {
232
233
  ) as HTMLDivElement;
233
234
 
234
235
  const navigate = useNavigate();
236
+
235
237
  return (
236
- <Modal
238
+ <WatermarkedModal
237
239
  open={open}
238
240
  onClose={() => {
239
241
  if (!quoteWalletsConfirmed) {
@@ -291,7 +293,7 @@ export function ConfirmWalletsModal(props: PropTypes) {
291
293
  ),
292
294
  })}
293
295
  anchor="center">
294
- <Modal
296
+ <WatermarkedModal
295
297
  open={balanceWarnings.length > 0}
296
298
  onClose={setBalanceWarnings.bind(null, [])}
297
299
  container={modalContainer}>
@@ -308,7 +310,7 @@ export function ConfirmWalletsModal(props: PropTypes) {
308
310
  {i18n.t('Proceed anyway')}
309
311
  </Button>
310
312
  </MessageBox>
311
- </Modal>
313
+ </WatermarkedModal>
312
314
  {showMoreWalletFor && (
313
315
  <WalletsContainer>
314
316
  <div className={walletsListStyles()}>
@@ -467,6 +469,6 @@ export function ConfirmWalletsModal(props: PropTypes) {
467
469
  </Wallets>
468
470
  </>
469
471
  )}
470
- </Modal>
472
+ </WatermarkedModal>
471
473
  );
472
474
  }
@@ -9,7 +9,6 @@ import {
9
9
  Divider,
10
10
  Image,
11
11
  MessageBox,
12
- Modal,
13
12
  SelectableWallet,
14
13
  Typography,
15
14
  WalletState,
@@ -32,6 +31,7 @@ import {
32
31
  getConciseAddress,
33
32
  isExperimentalChain,
34
33
  } from '../../utils/wallets';
34
+ import { WatermarkedModal } from '../common/WatermarkedModal';
35
35
  import { WalletModal } from '../WalletModal';
36
36
 
37
37
  import { ShowMoreWallets } from './ConfirmWallets.styles';
@@ -59,24 +59,23 @@ export function WalletList(props: PropTypes) {
59
59
  useState<'in-progress' | 'completed' | 'rejected' | null>(null);
60
60
  const { suggestAndConnect } = useWallets();
61
61
  let modalTimerId: ReturnType<typeof setTimeout> | null = null;
62
- const { list, error, handleClick, disconnectConnectingWallets } =
63
- useWalletList({
64
- config,
65
- chain,
66
- onBeforeConnect: (type) => {
67
- modalTimerId = setTimeout(() => {
68
- setOpenWalletStateModal(type);
69
- }, TIME_TO_IGNORE_MODAL);
70
- },
71
- onConnect: () => {
72
- if (modalTimerId) {
73
- clearTimeout(modalTimerId);
74
- }
75
- setTimeout(() => {
76
- setOpenWalletStateModal('');
77
- }, TIME_TO_CLOSE_MODAL);
78
- },
79
- });
62
+ const { list, error, handleClick } = useWalletList({
63
+ config,
64
+ chain,
65
+ onBeforeConnect: (type) => {
66
+ modalTimerId = setTimeout(() => {
67
+ setOpenWalletStateModal(type);
68
+ }, TIME_TO_IGNORE_MODAL);
69
+ },
70
+ onConnect: () => {
71
+ if (modalTimerId) {
72
+ clearTimeout(modalTimerId);
73
+ }
74
+ setTimeout(() => {
75
+ setOpenWalletStateModal('');
76
+ }, TIME_TO_CLOSE_MODAL);
77
+ },
78
+ });
80
79
  const [sortedList, setSortedList] = useState<WalletInfo[]>(list);
81
80
  const numberOfSupportedWallets = list.length;
82
81
  const shouldShowMoreWallets = limit && numberOfSupportedWallets - limit > 0;
@@ -134,11 +133,6 @@ export function WalletList(props: PropTypes) {
134
133
  };
135
134
  }, [addingExperimentalChainStatus]);
136
135
 
137
- const handleCloseWalletModal = () => {
138
- disconnectConnectingWallets();
139
- setOpenWalletStateModal('');
140
- };
141
-
142
136
  return (
143
137
  <>
144
138
  {sortedList.slice(0, limit).map((wallet) => {
@@ -201,13 +195,13 @@ export function WalletList(props: PropTypes) {
201
195
  <>
202
196
  <WalletModal
203
197
  open={openWalletStateModal === wallet.type}
204
- onClose={handleCloseWalletModal}
198
+ onClose={() => setOpenWalletStateModal('')}
205
199
  image={wallet.image}
206
200
  state={wallet.state}
207
201
  error={error}
208
202
  />
209
203
  {!!experimentalChainWallet && (
210
- <Modal
204
+ <WatermarkedModal
211
205
  open={!!experimentalChainWallet && showExperimentalChainModal}
212
206
  container={modalContainer}
213
207
  onClose={() => {
@@ -237,10 +231,10 @@ export function WalletList(props: PropTypes) {
237
231
  {i18n.t('Confirm')}
238
232
  </Button>
239
233
  </MessageBox>
240
- </Modal>
234
+ </WatermarkedModal>
241
235
  )}
242
236
  {addingExperimentalChainStatus && (
243
- <Modal
237
+ <WatermarkedModal
244
238
  open={!!addingExperimentalChainStatus}
245
239
  onClose={setAddingExperimentalChainStatus.bind(null, null)}
246
240
  container={modalContainer}>
@@ -292,7 +286,7 @@ export function WalletList(props: PropTypes) {
292
286
  )}
293
287
 
294
288
  <Divider direction="vertical" size={32} />
295
- </Modal>
289
+ </WatermarkedModal>
296
290
  )}
297
291
  <SelectableWallet
298
292
  key={wallet.type}
@@ -1,6 +1,7 @@
1
1
  import { styled } from '@rango-dev/ui';
2
2
 
3
3
  const WIDGET_HEIGHT = '700px';
4
+
4
5
  export const Container = styled('div', {
5
6
  position: 'relative',
6
7
  display: 'flex',
@@ -35,11 +36,17 @@ export const Content = styled('div', {
35
36
  padding: 0,
36
37
  overflowY: 'auto',
37
38
  });
39
+
38
40
  export const Footer = styled('div', {
39
- '& .footer__content': {
40
- padding: '$0 $20',
41
- },
41
+ padding: '0 $20 $10',
42
42
  '& .footer__logo': {
43
- padding: '$0 $20 $10 $20',
43
+ opacity: 0,
44
+ transition: 'opacity 1s ease-in-out',
45
+ '&.logo__show': {
46
+ opacity: 1,
47
+ },
48
+ '&.logo__hidden': {
49
+ visibility: 'hidden',
50
+ },
44
51
  },
45
52
  });
@@ -12,7 +12,7 @@ import { isAppLoadedIntoIframe } from '../../hooks/useIframe/useIframe.helpers';
12
12
  import { useNavigateBack } from '../../hooks/useNavigateBack';
13
13
  import { useTheme } from '../../hooks/useTheme';
14
14
  import { useAppStore } from '../../store/AppStore';
15
- import { setCurrentTabAsActive, useUiStore } from '../../store/ui';
15
+ import { tabManager, useUiStore } from '../../store/ui';
16
16
  import { useWalletsStore } from '../../store/wallets';
17
17
  import { getContainer } from '../../utils/common';
18
18
  import { getPendingSwaps } from '../../utils/queue';
@@ -25,12 +25,15 @@ import { onScrollContentAttachStatusToContainer } from './Layout.helpers';
25
25
  import { Container, Content, Footer } from './Layout.styles';
26
26
 
27
27
  function Layout(props: PropsWithChildren<PropTypes>) {
28
- const { children, header, footer, hasLogo = true, height = 'fixed' } = props;
29
28
  const { connectHeightObserver, disconnectHeightObserver } = useIframe();
29
+ const { children, header, footer, height = 'fixed' } = props;
30
30
  const connectedWallets = useWalletsStore.use.connectedWallets();
31
31
  const {
32
32
  config: { features, theme },
33
33
  } = useAppStore();
34
+ const { watermark } = useUiStore();
35
+
36
+ const hasWatermark = watermark === 'FULL';
34
37
  const { activeTheme } = useTheme(theme || {});
35
38
 
36
39
  const isConnectWalletHidden = isFeatureHidden(
@@ -53,7 +56,7 @@ function Layout(props: PropsWithChildren<PropTypes>) {
53
56
  const hasRunningSwap = pendingSwaps.some((swap) => swap.status === 'running');
54
57
 
55
58
  const onActivateTab = () =>
56
- activateCurrentTab(setCurrentTabAsActive, hasRunningSwap);
59
+ activateCurrentTab(tabManager.forceClaim, hasRunningSwap);
57
60
 
58
61
  const onConnectWallet = () => {
59
62
  header.onWallet?.();
@@ -83,7 +86,6 @@ function Layout(props: PropsWithChildren<PropTypes>) {
83
86
  'scroll',
84
87
  onScrollContentAttachStatusToContainer
85
88
  );
86
-
87
89
  return () => {
88
90
  scrollViewRef.current?.removeEventListener(
89
91
  'scroll',
@@ -121,25 +123,27 @@ function Layout(props: PropsWithChildren<PropTypes>) {
121
123
  onClose={() => setShowActivateTabModal(false)}
122
124
  onConfirm={onActivateTab}
123
125
  />
124
- {(hasLogo || footer) && (
125
- <Footer>
126
- <div className="footer__content">
127
- {footer}
128
- {tabManagerInitiated && !isActiveTab && (
129
- <>
130
- <Divider size={12} />
131
- <ActivateTabAlert onActivateTab={onActivateTab} />
132
- </>
133
- )}
134
- </div>
135
- <Divider size={12} />
136
- {hasLogo && (
137
- <div className="footer__logo">
138
- <BottomLogo />
139
- </div>
126
+
127
+ <Footer>
128
+ <div className="footer__content">
129
+ {footer}
130
+ {tabManagerInitiated && !isActiveTab && (
131
+ <>
132
+ <Divider size={12} />
133
+ <ActivateTabAlert onActivateTab={onActivateTab} />
134
+ </>
140
135
  )}
141
- </Footer>
142
- )}
136
+ </div>
137
+
138
+ <Divider size={12} />
139
+
140
+ <div
141
+ className={`footer__logo ${
142
+ hasWatermark ? 'logo__show' : 'logo__hidden'
143
+ }`}>
144
+ <BottomLogo />
145
+ </div>
146
+ </Footer>
143
147
  </Container>
144
148
  );
145
149
  }
@@ -15,7 +15,6 @@ export interface PropTypes {
15
15
  hasBackButton?: boolean;
16
16
  onCancel?: () => void;
17
17
  };
18
- hasLogo?: boolean;
19
18
  footer?: React.ReactNode;
20
19
  height?: ContainerHeightProp;
21
20
  }
@@ -7,7 +7,6 @@ import {
7
7
  CloseIcon,
8
8
  Divider,
9
9
  IconButton,
10
- Modal,
11
10
  QuoteCost,
12
11
  Tooltip,
13
12
  Typography,
@@ -36,6 +35,7 @@ import {
36
35
  getTotalFeesInUsd,
37
36
  getUsdFee,
38
37
  } from '../../utils/swap';
38
+ import { WatermarkedModal } from '../common/WatermarkedModal';
39
39
  import { CustomCollapsible } from '../CustomCollapsible/CustomCollapsible';
40
40
  import { ExpandedIcon } from '../CustomCollapsible/CustomCollapsible.styles';
41
41
 
@@ -96,7 +96,7 @@ export function QuoteCostDetails(props: QuoteCostDetailsProps) {
96
96
  tooltipContainer={container}
97
97
  />
98
98
 
99
- <Modal
99
+ <WatermarkedModal
100
100
  container={container}
101
101
  open={open}
102
102
  header={
@@ -212,7 +212,7 @@ export function QuoteCostDetails(props: QuoteCostDetailsProps) {
212
212
  </CustomCollapsible>
213
213
  )}
214
214
  </ModalContainer>
215
- </Modal>
215
+ </WatermarkedModal>
216
216
  </>
217
217
  );
218
218
  }
@@ -5,7 +5,6 @@ import {
5
5
  Button,
6
6
  Divider,
7
7
  MessageBox,
8
- Modal,
9
8
  Typography,
10
9
  WarningIcon,
11
10
  } from '@rango-dev/ui';
@@ -22,6 +21,7 @@ import {
22
21
  } from '../../constants/routing';
23
22
  import { getContainer } from '../../utils/common';
24
23
  import { numberToString } from '../../utils/numbers';
24
+ import { WatermarkedModal } from '../common/WatermarkedModal';
25
25
 
26
26
  import { QuoteErrorsModalItem } from './QuoteErrorsModalItem';
27
27
  import { Flex } from './QuoteWarningsAndErrors.styles';
@@ -37,6 +37,7 @@ type Props = {
37
37
  export function HighValueLossWarningModal(props: Props) {
38
38
  const { open, onClose, onConfirm, warning, confirmationDisabled } = props;
39
39
  const type = warning.warningLevel === 'high' ? 'error' : 'warning';
40
+
40
41
  const highValueLossData = [
41
42
  {
42
43
  title: i18n.t('Swapping'),
@@ -74,7 +75,7 @@ export function HighValueLossWarningModal(props: Props) {
74
75
  ];
75
76
 
76
77
  return (
77
- <Modal open={open} onClose={onClose} container={getContainer()}>
78
+ <WatermarkedModal open={open} onClose={onClose} container={getContainer()}>
78
79
  <MessageBox
79
80
  type={type}
80
81
  title={errorMessages().highValueLossError.impactTitle}
@@ -104,6 +105,6 @@ export function HighValueLossWarningModal(props: Props) {
104
105
  onClick={onConfirm}>
105
106
  {errorMessages().highValueLossError.confirmMessage}
106
107
  </Button>
107
- </Modal>
108
+ </WatermarkedModal>
108
109
  );
109
110
  }
@@ -4,7 +4,7 @@ import type {
4
4
  } from '../../types';
5
5
 
6
6
  import { i18n } from '@lingui/core';
7
- import { Button, Divider, MessageBox, Modal, Typography } from '@rango-dev/ui';
7
+ import { Button, Divider, MessageBox, Typography } from '@rango-dev/ui';
8
8
  import React from 'react';
9
9
  import { useNavigate } from 'react-router-dom';
10
10
 
@@ -12,6 +12,7 @@ import { navigationRoutes } from '../../constants/navigationRoutes';
12
12
  import { useAppStore } from '../../store/AppStore';
13
13
  import { QuoteWarningType } from '../../types';
14
14
  import { getContainer } from '../../utils/common';
15
+ import { WatermarkedModal } from '../common/WatermarkedModal';
15
16
 
16
17
  type PropsTypes = {
17
18
  open: boolean;
@@ -26,8 +27,9 @@ export function SlippageWarningModal(props: PropsTypes) {
26
27
  const { open, onClose, onConfirm, warning, confirmationDisabled } = props;
27
28
  const navigate = useNavigate();
28
29
  const userSlippage = customSlippage ?? slippage;
30
+
29
31
  return (
30
- <Modal
32
+ <WatermarkedModal
31
33
  anchor="bottom"
32
34
  open={open}
33
35
  prefix={
@@ -74,6 +76,6 @@ export function SlippageWarningModal(props: PropsTypes) {
74
76
  {i18n.t('Confirm anyway')}
75
77
  </Button>
76
78
  </MessageBox>
77
- </Modal>
79
+ </WatermarkedModal>
78
80
  );
79
81
  }
@@ -1,10 +1,11 @@
1
1
  import type { UnknownPriceWarning } from '../../types';
2
2
 
3
- import { Button, Divider, MessageBox, Modal, WarningIcon } from '@rango-dev/ui';
3
+ import { Button, Divider, MessageBox, WarningIcon } from '@rango-dev/ui';
4
4
  import React from 'react';
5
5
 
6
6
  import { errorMessages } from '../../constants/errors';
7
7
  import { getContainer } from '../../utils/common';
8
+ import { WatermarkedModal } from '../common/WatermarkedModal';
8
9
 
9
10
  type Props = {
10
11
  open: boolean;
@@ -16,9 +17,8 @@ type Props = {
16
17
 
17
18
  export function UnknownPriceWarningModal(props: Props) {
18
19
  const { open, onClose, onConfirm, confirmationDisabled } = props;
19
-
20
20
  return (
21
- <Modal open={open} onClose={onClose} container={getContainer()}>
21
+ <WatermarkedModal open={open} onClose={onClose} container={getContainer()}>
22
22
  <MessageBox
23
23
  type="warning"
24
24
  title={errorMessages().unknownPriceError.impactTitle}
@@ -35,6 +35,6 @@ export function UnknownPriceWarningModal(props: Props) {
35
35
  onClick={onConfirm}>
36
36
  {errorMessages().unknownPriceError.confirmMessage}
37
37
  </Button>
38
- </Modal>
38
+ </WatermarkedModal>
39
39
  );
40
40
  }
@@ -5,7 +5,6 @@ import {
5
5
  Button,
6
6
  Divider,
7
7
  MessageBox,
8
- Modal,
9
8
  TokenAmount,
10
9
  Typography,
11
10
  } from '@rango-dev/ui';
@@ -14,6 +13,7 @@ import { useNavigate } from 'react-router-dom';
14
13
 
15
14
  import { WIDGET_UI_ID } from '../../constants';
16
15
  import { getContainer } from '../../utils/common';
16
+ import { WatermarkedModal } from '../common/WatermarkedModal';
17
17
 
18
18
  export function SwapDetailsCompleteModal(props: CompleteModalPropTypes) {
19
19
  const {
@@ -33,7 +33,7 @@ export function SwapDetailsCompleteModal(props: CompleteModalPropTypes) {
33
33
  const navigate = useNavigate();
34
34
 
35
35
  return (
36
- <Modal
36
+ <WatermarkedModal
37
37
  open={open}
38
38
  onClose={onClose}
39
39
  container={
@@ -107,6 +107,6 @@ export function SwapDetailsCompleteModal(props: CompleteModalPropTypes) {
107
107
  {i18n.t('See Details')}
108
108
  </Typography>
109
109
  </Button>
110
- </Modal>
110
+ </WatermarkedModal>
111
111
  );
112
112
  }
@@ -1,8 +1,8 @@
1
1
  import type { WalletStateContentProps } from './SwapDetailsModal.types';
2
2
 
3
- import { MessageBox, Wallet, WalletState } from '@rango-dev/ui';
3
+ import { MessageBox, Wallet } from '@rango-dev/ui';
4
4
  import { useWallets } from '@rango-dev/wallets-react';
5
- import React, { useEffect, useRef } from 'react';
5
+ import React from 'react';
6
6
 
7
7
  import { getContainer } from '../../utils/common';
8
8
  import { mapStatusToWalletState } from '../../utils/wallets';
@@ -18,40 +18,14 @@ export const WalletStateContent = (props: WalletStateContentProps) => {
18
18
  showWalletButton,
19
19
  walletButtonDisabled,
20
20
  } = props;
21
- const { connect, getWalletInfo, state, disconnect } = useWallets();
21
+ const { connect, getWalletInfo, state } = useWallets();
22
22
  const walletType = currentStepWallet?.walletType;
23
23
  const walletState = walletType
24
24
  ? mapStatusToWalletState(state(walletType))
25
25
  : null;
26
- const componentWillUnmount = useRef(false);
27
-
28
26
  const walletInfo = walletType ? getWalletInfo(walletType) : null;
29
27
  const shouldShowWallet =
30
28
  showWalletButton && !!walletType && !!walletState && !!walletInfo;
31
-
32
- /*
33
- * The order of useEffects is crucial.
34
- * 1- The first useEffect for componentWillUnmount sets its value to true
35
- */
36
- useEffect(() => {
37
- return () => {
38
- componentWillUnmount.current = true;
39
- };
40
- }, []);
41
-
42
- // 2- The second useEffect checks if componentWillUnmount is true then it disconnects connecting wallet
43
- useEffect(() => {
44
- return () => {
45
- if (
46
- componentWillUnmount.current &&
47
- walletType &&
48
- walletState === WalletState.CONNECTING
49
- ) {
50
- void disconnect(walletType);
51
- }
52
- };
53
- }, [walletState]);
54
-
55
29
  return (
56
30
  <>
57
31
  <MessageBox type={type} title={title} description={message} />