@rango-dev/widget-embedded 0.17.1-next.6 → 0.17.1-next.7

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 (37) hide show
  1. package/dist/Widget.d.ts.map +1 -1
  2. package/dist/hooks/useSwapInput.d.ts.map +1 -1
  3. package/dist/index.js +1 -1
  4. package/dist/index.js.map +3 -3
  5. package/dist/store/AppStore.d.ts +2 -50
  6. package/dist/store/AppStore.d.ts.map +1 -1
  7. package/dist/store/app.d.ts +1 -25
  8. package/dist/store/app.d.ts.map +1 -1
  9. package/package.json +1 -1
  10. package/src/QueueManager.tsx +1 -1
  11. package/src/Wallets.tsx +3 -3
  12. package/src/Widget.tsx +2 -1
  13. package/src/components/AppRouter.tsx +1 -1
  14. package/src/components/BlockchainList/BlockchainList.tsx +1 -1
  15. package/src/components/BlockchainsSection/BlockchainsSection.tsx +1 -1
  16. package/src/components/ConfirmWalletsModal/ConfirmWalletsModal.tsx +2 -2
  17. package/src/components/ConfirmWalletsModal/WalletList.tsx +2 -2
  18. package/src/components/NoResult/NoResult.tsx +1 -1
  19. package/src/components/NotificationContent/NotificationContent.tsx +2 -2
  20. package/src/components/Quote/Quote.tsx +1 -1
  21. package/src/components/SwapDetails/SwapDetails.tsx +2 -2
  22. package/src/components/TokenList/TokenList.tsx +3 -3
  23. package/src/components/UpdateUrl.tsx +3 -3
  24. package/src/components/WidgetEvents.tsx +1 -1
  25. package/src/hooks/useConfirmSwap/useConfirmSwap.ts +2 -2
  26. package/src/hooks/useSwapInput.ts +2 -3
  27. package/src/hooks/useSyncStoresWithConfig.ts +4 -4
  28. package/src/hooks/useWalletList.ts +1 -1
  29. package/src/pages/Home.tsx +1 -1
  30. package/src/pages/LiquiditySourcePage.tsx +2 -2
  31. package/src/pages/SelectBlockchainPage.tsx +2 -2
  32. package/src/pages/SelectSwapItemsPage.tsx +2 -2
  33. package/src/pages/SettingsPage.tsx +3 -3
  34. package/src/pages/SwapDetailsPage.tsx +1 -1
  35. package/src/pages/WalletsPage.tsx +1 -1
  36. package/src/store/AppStore.tsx +1 -1
  37. package/src/store/app.ts +4 -7
@@ -4,56 +4,8 @@ import React from 'react';
4
4
  type AppStoreProviderProps = PropsWithChildren<{
5
5
  config?: WidgetConfig;
6
6
  }>;
7
- export declare const AppStoreContext: React.Context<({
8
- (): import("./app").AppStoreState;
9
- <U>(selector: (state: import("./app").AppStoreState) => U, equals?: ((a: U, b: U) => boolean) | undefined): U;
10
- } & import("zustand").StoreApi<import("./app").AppStoreState> & {
11
- use: {
12
- _blockchains: () => import("rango-sdk").BlockchainMeta[];
13
- _tokens: () => import("rango-sdk").Token[];
14
- _popularTokens: () => import("rango-sdk").Token[];
15
- _swappers: () => import("rango-sdk").SwapperMeta[];
16
- fetchStatus: () => import("./slices/data").FetchStatus;
17
- blockchains: () => (options?: {
18
- type?: "source" | "destination" | undefined;
19
- } | undefined) => import("rango-sdk").BlockchainMeta[];
20
- tokens: () => (options?: {
21
- type?: "source" | "destination" | undefined;
22
- blockchain?: string | undefined;
23
- searchFor?: string | undefined;
24
- } | undefined) => import("rango-sdk").Token[];
25
- swappers: () => () => import("rango-sdk").SwapperMeta[];
26
- isTokenPinned: () => (token: import("rango-sdk").Token) => boolean;
27
- fetch: () => () => Promise<void>;
28
- config: () => WidgetConfig;
29
- updateConfig: () => (config: WidgetConfig) => void;
30
- };
31
- }) | null>;
32
- export declare function useAppStore(): {
33
- (): import("./app").AppStoreState;
34
- <U>(selector: (state: import("./app").AppStoreState) => U, equals?: ((a: U, b: U) => boolean) | undefined): U;
35
- } & import("zustand").StoreApi<import("./app").AppStoreState> & {
36
- use: {
37
- _blockchains: () => import("rango-sdk").BlockchainMeta[];
38
- _tokens: () => import("rango-sdk").Token[];
39
- _popularTokens: () => import("rango-sdk").Token[];
40
- _swappers: () => import("rango-sdk").SwapperMeta[];
41
- fetchStatus: () => import("./slices/data").FetchStatus;
42
- blockchains: () => (options?: {
43
- type?: "source" | "destination" | undefined;
44
- } | undefined) => import("rango-sdk").BlockchainMeta[];
45
- tokens: () => (options?: {
46
- type?: "source" | "destination" | undefined;
47
- blockchain?: string | undefined;
48
- searchFor?: string | undefined;
49
- } | undefined) => import("rango-sdk").Token[];
50
- swappers: () => () => import("rango-sdk").SwapperMeta[];
51
- isTokenPinned: () => (token: import("rango-sdk").Token) => boolean;
52
- fetch: () => () => Promise<void>;
53
- config: () => WidgetConfig;
54
- updateConfig: () => (config: WidgetConfig) => void;
55
- };
56
- };
7
+ export declare const AppStoreContext: React.Context<import("zustand").UseBoundStore<import("zustand").StoreApi<import("./app").AppStoreState>> | null>;
8
+ export declare function useAppStore(): import("./app").AppStoreState;
57
9
  export declare function AppStoreProvider(props: AppStoreProviderProps): React.JSX.Element;
58
10
  export {};
59
11
  //# sourceMappingURL=AppStore.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AppStore.d.ts","sourceRoot":"","sources":["../../src/store/AppStore.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAA4C,MAAM,OAAO,CAAC;AAKjE,KAAK,qBAAqB,GAAG,iBAAiB,CAAC;IAAE,MAAM,CAAC,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAE1E,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;UAAuC,CAAC;AAEpE,wBAAgB,WAAW;;;;;;;;;;;;;;;;;;;;;;;;EAQ1B;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,qBAY5D"}
1
+ {"version":3,"file":"AppStore.d.ts","sourceRoot":"","sources":["../../src/store/AppStore.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAA4C,MAAM,OAAO,CAAC;AAKjE,KAAK,qBAAqB,GAAG,iBAAiB,CAAC;IAAE,MAAM,CAAC,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAE1E,eAAO,MAAM,eAAe,kHAAuC,CAAC;AAEpE,wBAAgB,WAAW,kCAQ1B;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,qBAY5D"}
@@ -4,29 +4,5 @@ import type { WidgetConfig } from '../types';
4
4
  import type { StateCreator } from 'zustand';
5
5
  export type StateCreatorWithInitialData<T extends Partial<WidgetConfig>, R extends Record<string, unknown>, V extends Record<string, unknown>> = (initialData: T | undefined, ...rest: Parameters<StateCreator<R, [], [], V>>) => ReturnType<StateCreator<R, [], [], V>>;
6
6
  export type AppStoreState = DataSlice & ConfigSlice;
7
- export declare function createAppStore(initialData?: WidgetConfig): {
8
- (): AppStoreState;
9
- <U>(selector: (state: AppStoreState) => U, equals?: ((a: U, b: U) => boolean) | undefined): U;
10
- } & import("zustand").StoreApi<AppStoreState> & {
11
- use: {
12
- _blockchains: () => import("rango-sdk").BlockchainMeta[];
13
- _tokens: () => import("rango-sdk").Token[];
14
- _popularTokens: () => import("rango-sdk").Token[];
15
- _swappers: () => import("rango-sdk").SwapperMeta[];
16
- fetchStatus: () => import("./slices/data").FetchStatus;
17
- blockchains: () => (options?: {
18
- type?: "source" | "destination" | undefined;
19
- } | undefined) => import("rango-sdk").BlockchainMeta[];
20
- tokens: () => (options?: {
21
- type?: "source" | "destination" | undefined;
22
- blockchain?: string | undefined;
23
- searchFor?: string | undefined;
24
- } | undefined) => import("rango-sdk").Token[];
25
- swappers: () => () => import("rango-sdk").SwapperMeta[];
26
- isTokenPinned: () => (token: import("rango-sdk").Token) => boolean;
27
- fetch: () => () => Promise<void>;
28
- config: () => WidgetConfig;
29
- updateConfig: () => (config: WidgetConfig) => void;
30
- };
31
- };
7
+ export declare function createAppStore(initialData?: WidgetConfig): import("zustand").UseBoundStore<import("zustand").StoreApi<AppStoreState>>;
32
8
  //# sourceMappingURL=app.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../src/store/app.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAQ5C,MAAM,MAAM,2BAA2B,CACrC,CAAC,SAAS,OAAO,CAAC,YAAY,CAAC,EAC/B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAC/B,CACF,WAAW,EAAE,CAAC,GAAG,SAAS,EAC1B,GAAG,IAAI,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,KAC5C,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAE5C,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,CAAC;AAEpD,wBAAgB,cAAc,CAAC,WAAW,CAAC,EAAE,YAAY;;;;;;;;;;;;;;;;;;;;;;;;EAOxD"}
1
+ {"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../src/store/app.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAO5C,MAAM,MAAM,2BAA2B,CACrC,CAAC,SAAS,OAAO,CAAC,YAAY,CAAC,EAC/B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAC/B,CACF,WAAW,EAAE,CAAC,GAAG,SAAS,EAC1B,GAAG,IAAI,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,KAC5C,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAE5C,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,CAAC;AAEpD,wBAAgB,cAAc,CAAC,WAAW,CAAC,EAAE,YAAY,8EAKxD"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rango-dev/widget-embedded",
3
- "version": "0.17.1-next.6",
3
+ "version": "0.17.1-next.7",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
@@ -33,7 +33,7 @@ function QueueManager(props: PropsWithChildren) {
33
33
  });
34
34
  }, []);
35
35
 
36
- const blockchains = useAppStore().use.blockchains()();
36
+ const blockchains = useAppStore().blockchains();
37
37
  const connectedWallets = useWalletsStore.use.connectedWallets();
38
38
 
39
39
  const wallets = {
package/src/Wallets.tsx CHANGED
@@ -35,9 +35,9 @@ function Main(
35
35
  config: WidgetConfig;
36
36
  }>
37
37
  ) {
38
- const updateConfig = useAppStore().use.updateConfig();
39
- const blockchains = useAppStore().use.blockchains()();
40
- const tokens = useAppStore().use.tokens()();
38
+ const updateConfig = useAppStore().updateConfig;
39
+ const blockchains = useAppStore().blockchains();
40
+ const tokens = useAppStore().tokens();
41
41
  const { providers } = useWalletProviders(props.providers, props?.options);
42
42
  const disconnectWallet = useWalletsStore.use.disconnectWallet();
43
43
  const connectWallet = useWalletsStore.use.connectWallet();
package/src/Widget.tsx CHANGED
@@ -43,7 +43,7 @@ export type WidgetProps = {
43
43
  export function Main() {
44
44
  globalFont();
45
45
 
46
- const { fetch: fetchMeta, config } = useAppStore()();
46
+ const { fetch: fetchMeta, config } = useAppStore();
47
47
  const { activeTheme } = useTheme(config?.theme || {});
48
48
  const { activeLanguage, changeLanguage } = useLanguage();
49
49
  const [lastConnectedWalletWithNetwork, setLastConnectedWalletWithNetwork] =
@@ -69,6 +69,7 @@ export function Main() {
69
69
  changeLanguage(config.language);
70
70
  }
71
71
  }, [config?.language]);
72
+
72
73
  return (
73
74
  <I18nManager language={activeLanguage}>
74
75
  <MainContainer id="swap-container" className={activeTheme()}>
@@ -46,7 +46,7 @@ export function AppRouter({
46
46
  }) {
47
47
  const isRouterInContext = useInRouterContext();
48
48
  const Router = isRouterInContext ? Route : MemoryRouter;
49
- const blockchains = useAppStore().use.blockchains()();
49
+ const blockchains = useAppStore().blockchains();
50
50
  const { canSwitchNetworkTo } = useWallets();
51
51
 
52
52
  const evmChains = blockchains.filter(isEvmBlockchain);
@@ -20,7 +20,7 @@ import { LoadingBlockchainList } from './LoadingBlockchainList';
20
20
  export function BlockchainList(props: PropTypes) {
21
21
  const { list, searchedFor, onChange, blockchainCategory } = props;
22
22
  const [blockchains, setBlockchains] = useState<BlockchainMeta[]>(list);
23
- const { fetchStatus } = useAppStore()();
23
+ const { fetchStatus } = useAppStore();
24
24
 
25
25
  useEffect(() => {
26
26
  setBlockchains([
@@ -27,7 +27,7 @@ export function BlockchainsSection(props: PropTypes) {
27
27
  selected: blockchain?.name,
28
28
  });
29
29
 
30
- const { fetchStatus } = useAppStore()();
30
+ const { fetchStatus } = useAppStore();
31
31
  const resetToBlockchain = useQuoteStore.use.resetToBlockchain();
32
32
  const resetFromBlockchain = useQuoteStore.use.resetFromBlockchain();
33
33
  const hasMoreItemsInList = blockchainsList.more.length > 0;
@@ -51,8 +51,8 @@ const NUMBER_OF_WALLETS_TO_DISPLAY = 2;
51
51
  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
- const config = useAppStore().use.config();
55
- const blockchains = useAppStore().use.blockchains()();
54
+ const config = useAppStore().config;
55
+ const blockchains = useAppStore().blockchains();
56
56
  const {
57
57
  quote,
58
58
  setSelectedWallets: selectQuoteWallets,
@@ -42,10 +42,10 @@ import {
42
42
 
43
43
  export function WalletList(props: PropTypes) {
44
44
  const { chain, isSelected, selectWallet, limit, onShowMore } = props;
45
- const { config } = useAppStore()();
45
+ const { config } = useAppStore();
46
46
 
47
47
  const connectedWallets = useWalletsStore.use.connectedWallets();
48
- const { blockchains } = useAppStore()();
48
+ const { blockchains } = useAppStore();
49
49
  const [openWalletStateModal, setOpenWalletStateModal] =
50
50
  useState<WalletType>('');
51
51
  const [experimentalChainWallet, setExperimentalChainWallet] =
@@ -24,7 +24,7 @@ export function NoResult(props: PropTypes) {
24
24
  const toggleAllLiquiditySources =
25
25
  useSettingsStore.use.toggleAllLiquiditySources();
26
26
 
27
- const swappers = useAppStore().use.swappers()();
27
+ const swappers = useAppStore().swappers();
28
28
 
29
29
  const info = makeInfo(
30
30
  error,
@@ -26,8 +26,8 @@ export function NotificationContent() {
26
26
  const { getUnreadNotifications } = useNotificationStore();
27
27
 
28
28
  const notifications: Notification[] = getUnreadNotifications();
29
- const blockchains = useAppStore().use.blockchains()();
30
- const tokens = useAppStore().use.tokens()();
29
+ const blockchains = useAppStore().blockchains();
30
+ const tokens = useAppStore().tokens();
31
31
  const sortedNotification = notifications
32
32
  .sort((a, b) => b.creationTime - a.creationTime)
33
33
  .slice(0, MAX_NOTIFICATIONS_DISPLAYED);
@@ -62,7 +62,7 @@ export function Quote(props: QuoteProps) {
62
62
  type,
63
63
  recommended = true,
64
64
  } = props;
65
- const tokens = useAppStore().use.tokens()();
65
+ const tokens = useAppStore().tokens();
66
66
 
67
67
  const [expanded, setExpanded] = useState(props.expanded);
68
68
  const quoteRef = useRef<HTMLButtonElement | null>(null);
@@ -64,8 +64,8 @@ import { Container, HeaderDetails, StepsList } from './SwapDetails.styles';
64
64
  export function SwapDetails(props: SwapDetailsProps) {
65
65
  const { swap, requestId, onDelete, onCancel: onCancelProps } = props;
66
66
  const { canSwitchNetworkTo, connect, getWalletInfo } = useWallets();
67
- const blockchains = useAppStore().use.blockchains()();
68
- const tokens = useAppStore().use.tokens()();
67
+ const blockchains = useAppStore().blockchains();
68
+ const tokens = useAppStore().tokens();
69
69
  const retry = useQuoteStore.use.retry();
70
70
  const navigate = useNavigate();
71
71
  const { navigateBackFrom } = useNavigateBack();
@@ -86,11 +86,11 @@ export function TokenList(props: PropTypes) {
86
86
  const { list, searchedFor = '', onChange, selectedBlockchain } = props;
87
87
 
88
88
  const [tokens, setTokens] = useState<TokenWithBalance[]>(list);
89
- const fetchStatus = useAppStore().use.fetchStatus();
90
- const blockchains = useAppStore().use.blockchains()();
89
+ const fetchStatus = useAppStore().fetchStatus;
90
+ const blockchains = useAppStore().blockchains();
91
91
  const [hasNextPage, setHasNextPage] = useState<boolean>(true);
92
92
  const loadingWallet = useWalletsStore.use.loading();
93
- const { isTokenPinned } = useAppStore()();
93
+ const { isTokenPinned } = useAppStore();
94
94
 
95
95
  // eslint-disable-next-line react/display-name
96
96
  const innerElementType: React.FC<CommonProps> = forwardRef((render, ref) => {
@@ -29,9 +29,9 @@ export function UpdateUrl() {
29
29
  const setToToken = useQuoteStore.use.setToToken();
30
30
  const inputAmount = useQuoteStore.use.inputAmount();
31
31
  const setInputAmount = useQuoteStore.use.setInputAmount();
32
- const fetchMetaStatus = useAppStore().use.fetchStatus();
33
- const blockchains = useAppStore().use.blockchains()();
34
- const tokens = useAppStore().use.tokens()();
32
+ const fetchMetaStatus = useAppStore().fetchStatus;
33
+ const blockchains = useAppStore().blockchains();
34
+ const tokens = useAppStore().tokens();
35
35
  const setSelectedSwap = useUiStore.use.setSelectedSwap();
36
36
  useSyncStoresWithConfig();
37
37
 
@@ -14,7 +14,7 @@ import { useWalletsStore } from '../store/wallets';
14
14
  import { validBlockedStatuses } from '../types/notification';
15
15
 
16
16
  export function WidgetEvents() {
17
- const tokens = useAppStore().use.tokens()();
17
+ const tokens = useAppStore().tokens();
18
18
  const connectedWallets = useWalletsStore.use.connectedWallets();
19
19
  const getWalletsDetails = useWalletsStore.use.getWalletsDetails();
20
20
  const setNotification = useNotificationStore.use.setNotification();
@@ -40,8 +40,8 @@ export function useConfirmSwap(): ConfirmSwap {
40
40
  disabledLiquiditySources,
41
41
  } = useSettingsStore();
42
42
  const { connectedWallets } = useWalletsStore();
43
- const blockchains = useAppStore().use.blockchains()();
44
- const tokens = useAppStore().use.tokens()();
43
+ const blockchains = useAppStore().blockchains();
44
+ const tokens = useAppStore().tokens();
45
45
 
46
46
  const userSlippage = customSlippage || slippage;
47
47
 
@@ -33,9 +33,8 @@ type UseSwapInput = {
33
33
  */
34
34
  export function useSwapInput(): UseSwapInput {
35
35
  const { fetch: fetchQuote, cancelFetch } = useFetchQuote();
36
- const { liquiditySources, enableNewLiquiditySources } =
37
- useAppStore().use.config();
38
- const tokens = useAppStore().use.tokens()();
36
+ const { liquiditySources, enableNewLiquiditySources } = useAppStore().config;
37
+ const tokens = useAppStore().tokens();
39
38
  const {
40
39
  fromToken,
41
40
  toToken,
@@ -20,10 +20,10 @@ export function useSyncStoresWithConfig() {
20
20
  toBlockchain,
21
21
  } = useQuoteStore();
22
22
 
23
- const config = useAppStore().use.config();
24
- const fetchMetaStatus = useAppStore().use.fetchStatus();
25
- const blockchains = useAppStore().use.blockchains()();
26
- const tokens = useAppStore().use.tokens()();
23
+ const config = useAppStore().config;
24
+ const fetchMetaStatus = useAppStore().fetchStatus;
25
+ const blockchains = useAppStore().blockchains();
26
+ const tokens = useAppStore().tokens();
27
27
 
28
28
  const { setAffiliateRef, setAffiliatePercent, setAffiliateWallets } =
29
29
  useSettingsStore();
@@ -37,7 +37,7 @@ export function useWalletList(params: Params) {
37
37
  const { config, chain, onBeforeConnect, onConnect } = params;
38
38
  const { state, disconnect, getWalletInfo, connect } = useWallets();
39
39
  const { connectedWallets } = useWalletsStore();
40
- const blockchains = useAppStore().use.blockchains()();
40
+ const blockchains = useAppStore().blockchains();
41
41
 
42
42
  /** It can be what has been set by widget config or as a fallback we use all the supported wallets by our library */
43
43
  const listAvailableWalletTypes =
@@ -76,7 +76,7 @@ export function Home() {
76
76
  setQuoteWarningsConfirmed,
77
77
  } = useQuoteStore();
78
78
 
79
- const fetchMetaStatus = useAppStore().use.fetchStatus();
79
+ const fetchMetaStatus = useAppStore().fetchStatus;
80
80
 
81
81
  const connectedWallets = useWalletsStore.use.connectedWallets();
82
82
  const setCurrentPage = useUiStore.use.setCurrentPage();
@@ -35,8 +35,8 @@ interface PropTypes {
35
35
  }
36
36
 
37
37
  export function LiquiditySourcePage({ sourceType }: PropTypes) {
38
- const fetchStatus = useAppStore().use.fetchStatus();
39
- const swappers = useAppStore().use.swappers()();
38
+ const fetchStatus = useAppStore().fetchStatus;
39
+ const swappers = useAppStore().swappers();
40
40
  const [searchedFor, setSearchedFor] = useState<string>('');
41
41
  const toggleLiquiditySource = useSettingsStore.use.toggleLiquiditySource();
42
42
  const { navigateBackFrom } = useNavigateBack();
@@ -21,9 +21,9 @@ export function SelectBlockchainPage(props: PropTypes) {
21
21
  const [blockchainCategory, setBlockchainCategory] = useState<string>('ALL');
22
22
  const setToBlockchain = useQuoteStore.use.setToBlockchain();
23
23
  const setFromBlockchain = useQuoteStore.use.setFromBlockchain();
24
- const fetchStatus = useAppStore().use.fetchStatus();
24
+ const fetchStatus = useAppStore().fetchStatus;
25
25
 
26
- const blockchains = useAppStore().use.blockchains()({
26
+ const blockchains = useAppStore().blockchains({
27
27
  type: type,
28
28
  });
29
29
  const routeKey = type === 'source' ? 'fromBlockchain' : 'toBlockchain';
@@ -39,10 +39,10 @@ export function SelectSwapItemsPage(props: PropTypes) {
39
39
  const selectedBlockchainName = selectedBlockchain?.name ?? '';
40
40
 
41
41
  // Tokens & Blockchains list
42
- const blockchains = useAppStore().use.blockchains()({
42
+ const blockchains = useAppStore().blockchains({
43
43
  type: type,
44
44
  });
45
- const tokens = useAppStore().use.tokens()({
45
+ const tokens = useAppStore().tokens({
46
46
  type,
47
47
  blockchain: selectedBlockchainName,
48
48
  searchFor: searchedFor,
@@ -26,9 +26,9 @@ import { getUniqueSwappersGroups } from '../utils/settings';
26
26
 
27
27
  export function SettingsPage() {
28
28
  const navigate = useNavigate();
29
- const { theme } = useAppStore().use.config();
30
- const fetchStatus = useAppStore().use.fetchStatus();
31
- const swappers = useAppStore().use.swappers()();
29
+ const { theme } = useAppStore().config;
30
+ const fetchStatus = useAppStore().fetchStatus;
31
+ const swappers = useAppStore().swappers();
32
32
  const { navigateBackFrom } = useNavigateBack();
33
33
 
34
34
  const infiniteApprove = useSettingsStore.use.infiniteApprove();
@@ -16,7 +16,7 @@ export function SwapDetailsPage() {
16
16
  const pendingSwaps = getPendingSwaps(manager);
17
17
  const requestId = useUiStore.use.selectedSwapRequestId();
18
18
  const { navigateBackFrom } = useNavigateBack();
19
- const { fetchStatus: fetchMetaStatus } = useAppStore()();
19
+ const { fetchStatus: fetchMetaStatus } = useAppStore();
20
20
 
21
21
  const showSkeleton = loading || fetchMetaStatus === 'loading';
22
22
 
@@ -29,7 +29,7 @@ export const TIME_TO_CLOSE_MODAL = 3_000;
29
29
  export const TIME_TO_IGNORE_MODAL = 300;
30
30
 
31
31
  export function WalletsPage() {
32
- const { config, fetchStatus: fetchMetaStatus } = useAppStore()();
32
+ const { config, fetchStatus: fetchMetaStatus } = useAppStore();
33
33
  const { navigateBackFrom } = useNavigateBack();
34
34
  const [openModal, setOpenModal] = useState(false);
35
35
  const [selectedWalletType, setSelectedWalletType] = useState<WalletType>('');
@@ -17,7 +17,7 @@ export function useAppStore() {
17
17
  throw new Error('Missing AppStoreContext.Provider in the tree');
18
18
  }
19
19
 
20
- return store;
20
+ return store();
21
21
  }
22
22
 
23
23
  export function AppStoreProvider(props: AppStoreProviderProps) {
package/src/store/app.ts CHANGED
@@ -5,7 +5,6 @@ import type { StateCreator } from 'zustand';
5
5
 
6
6
  import { create } from 'zustand';
7
7
 
8
- import createSelectors from './selectors';
9
8
  import { createConfigSlice } from './slices/config';
10
9
  import { createDataSlice } from './slices/data';
11
10
 
@@ -21,10 +20,8 @@ export type StateCreatorWithInitialData<
21
20
  export type AppStoreState = DataSlice & ConfigSlice;
22
21
 
23
22
  export function createAppStore(initialData?: WidgetConfig) {
24
- return createSelectors(
25
- create<AppStoreState>()((...a) => ({
26
- ...createDataSlice(...a),
27
- ...createConfigSlice(initialData, ...a),
28
- }))
29
- );
23
+ return create<AppStoreState>()((...a) => ({
24
+ ...createDataSlice(...a),
25
+ ...createConfigSlice(initialData, ...a),
26
+ }));
30
27
  }