@rango-dev/widget-embedded 0.37.0 → 0.37.1-next.1

package/src/hooks/useConfirmSwap/useConfirmSwap.helpers.ts

@@ -7,27 +7,18 @@ import type {
   SelectedQuote,
   Wallet,
 } from '../../types';
-import type { BlockchainMeta, SwapResult, Token } from 'rango-sdk';
+import type BigNumber from 'bignumber.js';
+import type { BlockchainMeta, SwapResult } from 'rango-sdk';
 
 import { errorMessages } from '../../constants/errors';
-import { QuoteErrorType, QuoteUpdateType } from '../../types';
-import { numberToString } from '../../utils/numbers';
-import {
-  generateQuoteWarnings,
-  getPriceImpact,
-  isNumberOfSwapsChanged,
-  isQuoteChanged,
-  isQuoteInternalCoinsUpdated,
-  isQuoteSwappersUpdated,
-} from '../../utils/quote';
+import { QuoteErrorType } from '../../types';
+import { generateQuoteWarnings } from '../../utils/quote';
 import {
   checkSlippageErrors,
   generateBalanceWarnings,
   getLimitErrorMessage,
   getMinRequiredSlippage,
-  getQuoteOutputAmount,
   hasLimitError,
-  isOutputAmountChangedALot,
 } from '../../utils/swap';
 
 /**
@@ -82,72 +73,44 @@ export function getQuoteError(swaps: SwapResult[]): QuoteErrorResponse | null {
   return null;
 }
 
-export function generateWarnings(
-  previousQuote: SelectedQuote | undefined,
-  currentQuote: SelectedQuote,
-  params: {
-    fromToken: Token;
-    toToken: Token;
-    meta: { blockchains: BlockchainMeta[] };
-    selectedWallets: Wallet[];
-    userSlippage: number;
-    findToken: FindToken;
-  }
-): ConfirmSwapWarnings {
-  let quoteChanged = false;
-  if (previousQuote) {
-    quoteChanged = isQuoteChanged(previousQuote, currentQuote);
-  }
+export function generateWarnings(params: {
+  currentQuote: SelectedQuote;
+  previousQuote?: SelectedQuote;
+  meta: { blockchains: BlockchainMeta[] };
+  selectedWallets: Wallet[];
+  userSlippage: number;
+  inputUsdValue: BigNumber | null;
+  findToken: FindToken;
+}): ConfirmSwapWarnings {
+  const {
+    currentQuote,
+    previousQuote,
+    meta,
+    selectedWallets,
+    userSlippage,
+    findToken,
+  } = params;
+
   const output: ConfirmSwapWarnings = {
     quote: null,
-    quoteUpdate: null,
     balance: null,
   };
 
-  const quoteWarning = generateQuoteWarnings(currentQuote, {
-    fromToken: params.fromToken,
-    toToken: params.toToken,
-    findToken: params.findToken,
-    userSlippage: params.userSlippage,
+  const quoteWarning = generateQuoteWarnings({
+    previousQuote,
+    currentQuote,
+    findToken,
+    userSlippage,
   });
 
   if (quoteWarning) {
     output.quote = quoteWarning;
   }
 
-  if (previousQuote && quoteChanged) {
-    if (isOutputAmountChangedALot(previousQuote, currentQuote)) {
-      output.quoteUpdate = {
-        type: QuoteUpdateType.QUOTE_AND_OUTPUT_AMOUNT_UPDATED,
-        newOutputAmount: numberToString(getQuoteOutputAmount(currentQuote)),
-        percentageChange: numberToString(
-          getPriceImpact(
-            getQuoteOutputAmount(previousQuote) ?? '',
-            getQuoteOutputAmount(currentQuote) ?? ''
-          ),
-          null,
-          2
-        ),
-      };
-    } else if (isNumberOfSwapsChanged(previousQuote, currentQuote)) {
-      output.quoteUpdate = {
-        type: QuoteUpdateType.QUOTE_UPDATED,
-      };
-    } else if (isQuoteSwappersUpdated(previousQuote, currentQuote)) {
-      output.quoteUpdate = {
-        type: QuoteUpdateType.QUOTE_SWAPPERS_UPDATED,
-      };
-    } else if (isQuoteInternalCoinsUpdated(previousQuote, currentQuote)) {
-      output.quoteUpdate = {
-        type: QuoteUpdateType.QUOTE_COINS_UPDATED,
-      };
-    }
-  }
-
   const balanceWarnings = generateBalanceWarnings(
     currentQuote,
-    params.selectedWallets,
-    params.meta.blockchains
+    selectedWallets,
+    meta.blockchains
   );
 
   const enoughBalance = balanceWarnings.length === 0;

package/src/hooks/useConfirmSwap/useConfirmSwap.ts

@@ -21,10 +21,10 @@ export function useConfirmSwap(): ConfirmSwap {
     fromToken,
     toToken,
     inputAmount,
+    inputUsdValue,
     setSelectedQuote,
     selectedQuote: initialQuote,
     customDestination: customDestinationFromStore,
-    setQuoteWarningsConfirmed,
     resetAlerts,
   } = useQuoteStore();
 
@@ -95,21 +95,16 @@ export function useConfirmSwap(): ConfirmSwap {
           disabledSwappersGroups: disabledLiquiditySources,
         };
 
-        const confirmSwapWarnings = generateWarnings(
-          initialQuote ?? undefined,
+        const confirmSwapWarnings = generateWarnings({
+          previousQuote: initialQuote ?? undefined,
           currentQuote,
-          {
-            fromToken,
-            toToken,
-            meta: { blockchains },
-            findToken,
-            selectedWallets,
-            userSlippage,
-          }
-        );
-        if (confirmSwapWarnings.quoteUpdate) {
-          setQuoteWarningsConfirmed(false);
-        }
+          meta: { blockchains },
+          selectedWallets,
+          userSlippage,
+          inputUsdValue,
+          findToken,
+        });
+
         resetAlerts();
 
         const proceedAnyway = !!confirmSwapWarnings.balance;

package/src/hooks/useFetchApiConfig.ts

@@ -6,6 +6,9 @@ export type Watermark = 'NONE' | 'FULL';
 type ConfigResponse = {
   config: {
     watermark: Watermark;
+    banners: {
+      profile: boolean;
+    };
   };
 };
 
@@ -14,7 +17,7 @@ interface UseFetchApiConfig {
 }
 
 export function useFetchApiConfig(): UseFetchApiConfig {
-  const { setWatermark } = useUiStore();
+  const { setWatermark, setShowProfileBanner } = useUiStore();
 
   const fetchApiConfig: UseFetchApiConfig['fetchApiConfig'] = async () => {
     const response = await fetch(
@@ -28,6 +31,7 @@ export function useFetchApiConfig(): UseFetchApiConfig {
     const data: ConfigResponse = await response.json();
 
     setWatermark(data.config.watermark);
+    setShowProfileBanner(data.config.banners.profile);
   };
   return { fetchApiConfig };
 }

package/src/hooks/useFetchCustomToken.ts

@@ -103,6 +103,11 @@ export function useFetchCustomToken(): UseFetchCustomToken {
 
       return token;
     } catch (error: any) {
+      if (error?.code === 'ERR_BAD_REQUEST') {
+        const errorMessage = produceErrorMessage('not-found', blockchain);
+        setError(errorMessage);
+        return undefined;
+      }
       setError(undefined);
       throw new Error(error.message);
     } finally {

package/src/hooks/useStatefulConnect/useStatefulConnect.ts

@@ -1,10 +1,8 @@
 import type { HandleConnectOptions, Result } from './useStatefulConnect.types';
 import type { WalletInfoWithExtra } from '../../types';
-import type {
-  Namespace,
-  NamespaceData,
-  WalletType,
-} from '@rango-dev/wallets-shared';
+import type { ExtendedModalWalletInfo } from '../../utils/wallets';
+import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { NamespaceData, WalletType } from '@rango-dev/wallets-shared';
 
 import { WalletState } from '@rango-dev/ui';
 import { useWallets } from '@rango-dev/wallets-react';
@@ -61,7 +59,11 @@ export function useStatefulConnect(): UseStatefulConnect {
     });
 
     try {
-      await connect(type, undefined, namespaces);
+      const legacyNamespacesInput = namespaces?.map((namespaceInput) => ({
+        ...namespaceInput,
+        network: undefined,
+      }));
+      await connect(type, legacyNamespacesInput);
 
       return { status: ResultStatus.Connected };
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -75,7 +77,7 @@ export function useStatefulConnect(): UseStatefulConnect {
   };
 
   const handleConnect = async (
-    wallet: WalletInfoWithExtra,
+    wallet: ExtendedModalWalletInfo,
     options?: HandleConnectOptions
   ): Promise<{
     status: ResultStatus;
@@ -83,31 +85,60 @@ export function useStatefulConnect(): UseStatefulConnect {
     const isDisconnected = wallet.state === WalletState.DISCONNECTED;
 
     if (isDisconnected) {
-      if (!wallet.namespaces) {
+      // Legacy and hub have different structure to check wether we need to show namespace or not.
+
+      // Hub
+      const isHub = !!wallet.isHub;
+      if (isHub) {
+        const detachedInstances = wallet.properties?.find(
+          (item) => item.name === 'detached'
+        );
+        const needsNamespace =
+          detachedInstances && wallet.state !== 'connected';
+
+        if (needsNamespace) {
+          dispatch({
+            type: 'needsNamespace',
+            payload: {
+              targetWallet: wallet,
+            },
+          });
+          return { status: ResultStatus.Namespace };
+        }
+      }
+
+      /*
+       * Legacy
+       *
+       * For legacy there are 3 states:
+       * 1. a wallet doesn't have any namespace defined, we call the connect.
+       * 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.
+       * 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.
+       */
+      if (!wallet.needsNamespace) {
         return await runConnect(wallet.type, undefined, options);
       }
 
-      const needsNamespace = wallet.namespaces.length > 1;
+      const needsNamespace = wallet.needsNamespace.data.length > 1;
       const needsDerivationPath = wallet.needsDerivationPath;
 
       if (needsNamespace) {
         dispatch({
           type: 'needsNamespace',
           payload: {
-            providerType: wallet.type,
-            providerImage: wallet.image,
-            availableNamespaces: wallet.namespaces,
-            singleNamespace: wallet.singleNamespace,
+            targetWallet: wallet,
           },
         });
         return { status: ResultStatus.Namespace };
       } else if (needsDerivationPath) {
+        const namespace = wallet.needsNamespace.data[0];
+
         dispatch({
           type: 'needsDerivationPath',
           payload: {
             providerType: wallet.type,
             providerImage: wallet.image,
-            namespace: wallet.namespaces[0],
+            namespace: namespace.value,
           },
         });
         return { status: ResultStatus.DerivationPath };
@@ -115,7 +146,9 @@ export function useStatefulConnect(): UseStatefulConnect {
 
       return await runConnect(
         wallet.type,
-        wallet.namespaces.map((namespace) => ({ namespace })),
+        wallet.needsNamespace?.data.map((namespace) => ({
+          namespace: namespace.value,
+        })),
         options
       );
     }
@@ -132,7 +165,7 @@ export function useStatefulConnect(): UseStatefulConnect {
     wallet: WalletInfoWithExtra,
     selectedNamespaces: Namespace[]
   ): Promise<Result> => {
-    const isSingleNamespace = wallet.singleNamespace;
+    const isSingleNamespace = wallet.needsNamespace?.selection === 'single';
     const needsDerivationPath = wallet.needsDerivationPath;
     const firstSelectedNamespace = selectedNamespaces[0];
 
@@ -172,7 +205,7 @@ export function useStatefulConnect(): UseStatefulConnect {
       );
     }
 
-    const type = connectState.namespace.providerType;
+    const type = connectState.namespace.targetWallet.type;
     const namespaces = selectedNamespaces.map((namespace) => ({
       namespace,
     }));

package/src/hooks/useStatefulConnect/useStatefulConnect.types.ts

@@ -1,4 +1,5 @@
-import type { Namespace } from '@rango-dev/wallets-shared';
+import type { ExtendedModalWalletInfo } from '../../utils/wallets';
+import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
 
 export interface HandleConnectOptions {
   // To have a switch between connect and disconnect when user is clicking on a button, this option can be helpful.
@@ -6,10 +7,7 @@ export interface HandleConnectOptions {
 }
 
 export interface NeedsNamespacesState {
-  providerType: string;
-  providerImage: string;
-  availableNamespaces?: Namespace[];
-  singleNamespace?: boolean;
+  targetWallet: ExtendedModalWalletInfo;
 }
 
 export interface NeedsDerivationPathState {

package/src/hooks/useSubscribeToWidgetEvents/useSubscribeToWidgetEvents.ts

@@ -12,13 +12,10 @@ import { useEffect } from 'react';
 import { eventEmitter } from '../../services/eventEmitter';
 import { useAppStore } from '../../store/AppStore';
 import { useNotificationStore } from '../../store/notification';
-import { useWalletsStore } from '../../store/wallets';
 
 export function useSubscribeToWidgetEvents() {
-  const connectedWallets = useWalletsStore.use.connectedWallets();
-  const getWalletsDetails = useWalletsStore.use.getWalletsDetails();
   const setNotification = useNotificationStore.use.setNotification();
-  const { findToken } = useAppStore();
+  const { connectedWallets, fetchBalances } = useAppStore();
 
   useEffect(() => {
     const handleStepEvent = (widgetEvent: StepEventData) => {
@@ -39,8 +36,12 @@ export function useSubscribeToWidgetEvents() {
             (wallet) => wallet.chain === step?.toBlockchain
           );
 
-        fromAccount && getWalletsDetails([fromAccount], findToken);
-        toAccount && getWalletsDetails([toAccount], findToken);
+        if (fromAccount) {
+          void fetchBalances([fromAccount]);
+        }
+        if (toAccount) {
+          void fetchBalances([toAccount]);
+        }
       }
 
       setNotification(event, route);

package/src/hooks/useSwapInput.ts

@@ -4,15 +4,12 @@ import { useCallback, useEffect, useRef, useState } from 'react';
 
 import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
-import { useWalletsStore } from '../store/wallets';
 import { QuoteErrorType } from '../types';
 import { debounce } from '../utils/common';
 import { isPositiveNumber } from '../utils/numbers';
 import {
   generateQuoteWarnings,
   getDefaultQuote,
-  getQuoteFromTokenUsdPrice,
-  getQuoteToTokenUsdPrice,
   sortQuotesBy,
 } from '../utils/quote';
 import { isRoutingEnabled } from '../utils/settings';
@@ -50,7 +47,7 @@ export function useSwapInput({
   const { fetch: fetchQuote, cancelFetch } = useFetchAllQuotes();
   const { excludeLiquiditySources: configExcludeLiquiditySources, routing } =
     useAppStore().config;
-  const connectedWallets = useWalletsStore.use.connectedWallets();
+  const { connectedWallets } = useAppStore();
 
   const {
     fromToken,
@@ -157,15 +154,10 @@ export function useSwapInput({
             requestId: quote?.requestId || '',
             swaps: quote?.swaps,
           });
-          const outputUsdValue =
-            getQuoteToTokenUsdPrice(quote) || toToken?.usdPrice;
-          const inputUsdValue =
-            getQuoteFromTokenUsdPrice(quote) || fromToken?.usdPrice;
           const quoteWarning =
             quote &&
-            generateQuoteWarnings(quote, {
-              fromToken: { ...fromToken, usdPrice: inputUsdValue },
-              toToken: { ...toToken, usdPrice: outputUsdValue },
+            generateQuoteWarnings({
+              currentQuote: quote,
               userSlippage,
               findToken,
             });

package/src/hooks/useWalletList.ts

@@ -12,7 +12,6 @@ import {
 import { useCallback, useEffect } from 'react';
 
 import { useAppStore } from '../store/AppStore';
-import { useWalletsStore } from '../store/wallets';
 import { configWalletsToWalletName } from '../utils/providers';
 import {
   hashWalletsState,
@@ -23,8 +22,6 @@ import {
 
 import { useStatefulConnect } from './useStatefulConnect/useStatefulConnect';
 
-const ALL_SUPPORTED_WALLETS = Object.values(WalletTypes);
-
 interface Params {
   chain?: string;
 }
@@ -43,21 +40,22 @@ interface API {
  */
 export function useWalletList(params?: Params): API {
   const { chain } = params || {};
-  const { config } = useAppStore();
+  const { config, connectedWallets, getAvailableProviders } = useAppStore();
   const { state, getWalletInfo } = useWallets();
-  const { connectedWallets } = useWalletsStore();
   const blockchains = useAppStore().blockchains();
   const { handleDisconnect } = useStatefulConnect();
 
   /** It can be what has been set by widget config or as a fallback we use all the supported wallets by our library */
-  const listAvailableWalletTypes =
-    configWalletsToWalletName(config?.wallets, {
+  const listAvailableWalletTypes = configWalletsToWalletName(
+    getAvailableProviders(),
+    {
       trezorManifest: config?.trezorManifest,
       walletConnectProjectId: config?.walletConnectProjectId,
       walletConnectListedDesktopWalletLink:
         config.__UNSTABLE_OR_INTERNAL__?.walletConnectListedDesktopWalletLink,
       tonConnect: config.tonConnect,
-    }) || ALL_SUPPORTED_WALLETS;
+    }
+  );
 
   let wallets = mapWalletTypesToWalletInfo(
     state,

package/src/hooks/useWalletProviders/useWalletProviders.ts

@@ -1,34 +1,30 @@
 import type { WidgetConfig } from '../../types';
 import type { ProvidersOptions } from '../../utils/providers';
-import type { ProviderInterface } from '@rango-dev/wallets-react';
 
 import { useEffect } from 'react';
 
-import { useWalletsStore } from '../../store/wallets';
-import { matchAndGenerateProviders } from '../../utils/providers';
+import { useAppStore } from '../../store/AppStore';
 
 import { hashProviders } from './useWalletProviders.helpers';
 
 export function useWalletProviders(
-  providers: WidgetConfig['wallets'],
+  configWallets: WidgetConfig['wallets'],
   options?: ProvidersOptions
 ) {
-  const clearConnectedWallet = useWalletsStore.use.clearConnectedWallet();
-  let generateProviders: ProviderInterface[] = matchAndGenerateProviders(
-    providers,
-    options
-  );
+  const { clearConnectedWallet, getAvailableProviders, buildAndSetProviders } =
+    useAppStore();
+  const providers = getAvailableProviders();
 
   useEffect(() => {
     clearConnectedWallet();
-    generateProviders = matchAndGenerateProviders(providers, options);
+    buildAndSetProviders();
   }, [
-    hashProviders(providers ?? []),
+    hashProviders(configWallets ?? []),
     options?.walletConnectProjectId,
     options?.walletConnectListedDesktopWalletLink,
   ]);
 
   return {
-    providers: generateProviders,
+    providers,
   };
 }

package/src/index.ts

@@ -1,5 +1,5 @@
 import type { WidgetProps } from './containers/Widget';
-import type { ConnectedWallet } from './store/wallets';
+import type { ConnectedWallet } from './store/slices/wallets';
 import type {
   BlockchainAndTokenConfig,
   QuoteEventData,

package/src/pages/ConfirmSwapPage.tsx

@@ -24,12 +24,12 @@ import { RefreshButton } from '../components/HeaderButtons/RefreshButton';
 import { Layout, PageContainer } from '../components/Layout';
 import { QuoteWarningsAndErrors } from '../components/QuoteWarningsAndErrors';
 import { navigationRoutes } from '../constants/navigationRoutes';
-import { getQuoteUpdateWarningMessage } from '../constants/warnings';
 import { QuoteInfo } from '../containers/QuoteInfo';
 import { useConfirmSwap } from '../hooks/useConfirmSwap';
 import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
 import { useUiStore } from '../store/ui';
+import { isQuoteWarningConfirmationRequired } from '../utils/quote';
 import { joinList } from '../utils/ui';
 
 const Buttons = styled('div', {
@@ -133,7 +133,12 @@ export function ConfirmSwapPage() {
   };
 
   const onStartConfirmSwap = async () => {
-    if (confirmSwapResult?.warnings?.quote && !quoteWarningsConfirmed) {
+    const shouldShowWarningModal =
+      confirmSwapResult.warnings?.quote &&
+      isQuoteWarningConfirmationRequired(confirmSwapResult.warnings.quote) &&
+      !quoteWarningsConfirmed;
+
+    if (shouldShowWarningModal) {
       setShowQuoteWarningModal(true);
     } else {
       await onConfirm();
@@ -196,19 +201,6 @@ export function ConfirmSwapPage() {
     alerts.push(<Alert type="error" variant="alarm" title={dbErrorMessage} />);
   }
 
-  if (confirmSwapResult.warnings?.quoteUpdate) {
-    alerts.push(
-      <Alert
-        variant="alarm"
-        type="warning"
-        title={
-          confirmSwapResult.warnings.quoteUpdate &&
-          getQuoteUpdateWarningMessage(confirmSwapResult.warnings.quoteUpdate)
-        }
-      />
-    );
-  }
-
   if (quoteWarning || quoteError) {
     const settings_url = `../${navigationRoutes.settings}`;
     alerts.push(

package/src/pages/Home.tsx

@@ -19,7 +19,6 @@ import { useSwapInput } from '../hooks/useSwapInput';
 import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
 import { useUiStore } from '../store/ui';
-import { useWalletsStore } from '../store/wallets';
 import { UiEventTypes } from '../types';
 import { isVariantExpandable } from '../utils/configs';
 import { emitPreventableEvent } from '../utils/events';
@@ -55,9 +54,12 @@ export function Home() {
   const { isLargeScreen, isExtraLargeScreen } = useScreenDetect();
 
   const { fetch: fetchQuote, loading } = useSwapInput({ refetchQuote });
-  const { config, fetchStatus: fetchMetaStatus } = useAppStore();
+  const {
+    config,
+    fetchStatus: fetchMetaStatus,
+    connectedWallets,
+  } = useAppStore();
 
-  const { connectedWallets } = useWalletsStore();
   const { isActiveTab } = useUiStore();
   const [showQuoteWarningModal, setShowQuoteWarningModal] = useState(false);
 

package/src/pages/SelectSwapItemsPage.tsx

@@ -13,7 +13,6 @@ import { navigationRoutes } from '../constants/navigationRoutes';
 import { useNavigateBack } from '../hooks/useNavigateBack';
 import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
-import { useWalletsStore } from '../store/wallets';
 
 interface PropTypes {
   type: 'source' | 'destination';
@@ -31,7 +30,7 @@ export function SelectSwapItemsPage(props: PropTypes) {
     setFromBlockchain,
     setToBlockchain,
   } = useQuoteStore();
-  const getBalanceFor = useWalletsStore.use.getBalanceFor();
+  const { getBalanceFor } = useAppStore();
   const [searchedFor, setSearchedFor] = useState<string>('');
 
   const selectedBlockchain = type === 'source' ? fromBlockchain : toBlockchain;

package/src/store/app.ts

@@ -1,6 +1,4 @@
-import type { ConfigSlice } from './slices/config';
-import type { DataSlice } from './slices/data';
-import type { SettingsSlice } from './slices/settings';
+import type { AppStoreState } from './slices/types';
 import type { WidgetConfig } from '../types';
 import type { StateCreator } from 'zustand';
 
@@ -10,6 +8,7 @@ import { persist } from 'zustand/middleware';
 import { createConfigSlice } from './slices/config';
 import { createDataSlice } from './slices/data';
 import { createSettingsSlice } from './slices/settings';
+import { createWalletsSlice } from './slices/wallets';
 
 export type StateCreatorWithInitialData<
   T extends Partial<WidgetConfig>,
@@ -20,12 +19,13 @@ export type StateCreatorWithInitialData<
   ...rest: Parameters<StateCreator<R, [], [], V>>
 ) => ReturnType<StateCreator<R, [], [], V>>;
 
-export type AppStoreState = DataSlice & ConfigSlice & SettingsSlice;
+export type { AppStoreState };
 
 export function createAppStore(initialData?: WidgetConfig) {
   return create<AppStoreState>()(
     persist(
       (...a) => ({
+        ...createWalletsSlice(...a),
         ...createDataSlice(...a),
         ...createSettingsSlice(...a),
         ...createConfigSlice(initialData, ...a),