@dynamic-labs/sdk-react-core 0.18.0-RC.1 → 0.18.0-RC.10

package/src/lib/shared/utils/classes/storage/localStorage.cjs

@@ -0,0 +1,74 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var localStorage = require('../../../../utils/constants/localStorage.cjs');
+require('../../../../utils/constants/colors.cjs');
+var logger = require('../../../logger.cjs');
+
+class LocalStorage {
+    static getDynamicLSKey(key) {
+        return `${key}${LocalStorage.getSuffix()}`;
+    }
+    static setSuffix(localStorageSuffix) {
+        if (!LocalStorage.__suffix__) {
+            const suffix = (localStorageSuffix && `_${localStorageSuffix}`) || '';
+            LocalStorage.__suffix__ = suffix;
+        }
+    }
+    // Will be refactored on INC-155
+    static getAuthTokenValue() {
+        if (typeof window === 'undefined') {
+            return undefined;
+        }
+        const value = window.localStorage.getItem(LocalStorage.getDynamicLSKey(localStorage.AUTH_TOKEN));
+        try {
+            if (value) {
+                return JSON.parse(value);
+            }
+        }
+        catch (e) {
+            logger.logger.debug(e);
+            // Return auth token string for backwards compatibility
+            return value || undefined;
+        }
+        return undefined;
+    }
+    static getFromLS(key) {
+        if (typeof window === 'undefined') {
+            return undefined;
+        }
+        const value = window.localStorage.getItem(LocalStorage.getDynamicLSKey(key));
+        try {
+            if (value) {
+                return JSON.parse(value);
+            }
+        }
+        catch (e) {
+            logger.logger.error(e);
+        }
+        return undefined;
+    }
+    static removeFromLS(key) {
+        if (typeof window === 'undefined') {
+            return undefined;
+        }
+        return window.localStorage.removeItem(LocalStorage.getDynamicLSKey(key));
+    }
+    static setToLS(key, value) {
+        if (typeof window === 'undefined') {
+            return;
+        }
+        window.localStorage.setItem(LocalStorage.getDynamicLSKey(key), JSON.stringify(value));
+    }
+    static getKeys() {
+        if (typeof window === 'undefined') {
+            return [];
+        }
+        return Object.keys(window.localStorage);
+    }
+}
+LocalStorage.getSuffix = () => LocalStorage.__suffix__ || '';
+
+exports.LocalStorage = LocalStorage;
+exports["default"] = LocalStorage;

package/src/lib/shared/utils/classes/storage/localStorage.d.ts

@@ -0,0 +1,12 @@
+export declare class LocalStorage {
+    private static __suffix__;
+    static getSuffix: () => string;
+    private static getDynamicLSKey;
+    static setSuffix(localStorageSuffix?: string): void;
+    static getAuthTokenValue(): string | undefined;
+    static getFromLS<T = any>(key: string): T | undefined;
+    static removeFromLS(key: string): void;
+    static setToLS<T = any>(key: string, value: T): void;
+    static getKeys(): string[];
+}
+export default LocalStorage;

package/src/lib/shared/utils/classes/storage/localStorage.js

@@ -0,0 +1,69 @@
+import { AUTH_TOKEN } from '../../../../utils/constants/localStorage.js';
+import '../../../../utils/constants/colors.js';
+import { logger } from '../../../logger.js';
+
+class LocalStorage {
+    static getDynamicLSKey(key) {
+        return `${key}${LocalStorage.getSuffix()}`;
+    }
+    static setSuffix(localStorageSuffix) {
+        if (!LocalStorage.__suffix__) {
+            const suffix = (localStorageSuffix && `_${localStorageSuffix}`) || '';
+            LocalStorage.__suffix__ = suffix;
+        }
+    }
+    // Will be refactored on INC-155
+    static getAuthTokenValue() {
+        if (typeof window === 'undefined') {
+            return undefined;
+        }
+        const value = window.localStorage.getItem(LocalStorage.getDynamicLSKey(AUTH_TOKEN));
+        try {
+            if (value) {
+                return JSON.parse(value);
+            }
+        }
+        catch (e) {
+            logger.debug(e);
+            // Return auth token string for backwards compatibility
+            return value || undefined;
+        }
+        return undefined;
+    }
+    static getFromLS(key) {
+        if (typeof window === 'undefined') {
+            return undefined;
+        }
+        const value = window.localStorage.getItem(LocalStorage.getDynamicLSKey(key));
+        try {
+            if (value) {
+                return JSON.parse(value);
+            }
+        }
+        catch (e) {
+            logger.error(e);
+        }
+        return undefined;
+    }
+    static removeFromLS(key) {
+        if (typeof window === 'undefined') {
+            return undefined;
+        }
+        return window.localStorage.removeItem(LocalStorage.getDynamicLSKey(key));
+    }
+    static setToLS(key, value) {
+        if (typeof window === 'undefined') {
+            return;
+        }
+        window.localStorage.setItem(LocalStorage.getDynamicLSKey(key), JSON.stringify(value));
+    }
+    static getKeys() {
+        if (typeof window === 'undefined') {
+            return [];
+        }
+        return Object.keys(window.localStorage);
+    }
+}
+LocalStorage.getSuffix = () => LocalStorage.__suffix__ || '';
+
+export { LocalStorage, LocalStorage as default };

package/src/lib/shared/utils/functions/getWalletListItemLabel/getWalletListItemLabel.cjs

@@ -3,15 +3,14 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var utils = require('@dynamic-labs/utils');
-var localStorage = require('../../../../utils/constants/localStorage.cjs');
+var localStorage$1 = require('../../../../utils/constants/localStorage.cjs');
 require('../../../../utils/constants/colors.cjs');
-var getFromLS = require('../storage/getFromLS.cjs');
-require('../../../../config/LSSuffix.cjs');
+var localStorage = require('../../classes/storage/localStorage.cjs');
 var isWalletGroup = require('../../../../utils/functions/walletListBuilder/utils/isWalletGroup/isWalletGroup.cjs');
 
 const comingSoonToMultiWalletMobile = ['Coinbase', 'MyAlgo', 'Braavos'];
 const comingSoonToMultiWalletDesktop = ['MyAlgo'];
-const getLastUsedWalletName = () => getFromLS.getFromLS(localStorage.LAST_USED_WALLET);
+const getLastUsedWalletName = () => localStorage.LocalStorage.getFromLS(localStorage$1.LAST_USED_WALLET);
 const getWalletGroupLabel = (walletGroup) => {
     const lastUsedWalletName = getLastUsedWalletName();
     const hasNestedLastUsedWallet = walletGroup.groupedWallets.some((walletOption) => walletOption.walletConnector.name === lastUsedWalletName);

package/src/lib/shared/utils/functions/getWalletListItemLabel/getWalletListItemLabel.js

@@ -1,13 +1,12 @@
 import { isMobile } from '@dynamic-labs/utils';
 import { LAST_USED_WALLET } from '../../../../utils/constants/localStorage.js';
 import '../../../../utils/constants/colors.js';
-import { getFromLS } from '../storage/getFromLS.js';
-import '../../../../config/LSSuffix.js';
+import { LocalStorage } from '../../classes/storage/localStorage.js';
 import { isWalletGroup } from '../../../../utils/functions/walletListBuilder/utils/isWalletGroup/isWalletGroup.js';
 
 const comingSoonToMultiWalletMobile = ['Coinbase', 'MyAlgo', 'Braavos'];
 const comingSoonToMultiWalletDesktop = ['MyAlgo'];
-const getLastUsedWalletName = () => getFromLS(LAST_USED_WALLET);
+const getLastUsedWalletName = () => LocalStorage.getFromLS(LAST_USED_WALLET);
 const getWalletGroupLabel = (walletGroup) => {
     const lastUsedWalletName = getLastUsedWalletName();
     const hasNestedLastUsedWallet = walletGroup.groupedWallets.some((walletOption) => walletOption.walletConnector.name === lastUsedWalletName);

package/src/lib/shared/utils/functions/index.d.ts

@@ -1,5 +1,4 @@
 export * from './decodeJwt';
-export * from './storage';
 export * from './validateType';
 export * from './chain';
 export * from './wallet';

package/src/lib/shared/utils/functions/wallet/createWallet.cjs

@@ -4,10 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var walletBook = require('@dynamic-labs/wallet-book');
 
-const createWallet = (wallet) => {
+const createWallet = (walletBook$1, wallet) => {
     var _a, _b;
     return ({
-        group: (_a = walletBook.findWalletBookWallet(wallet.name)) === null || _a === void 0 ? void 0 : _a.group,
+        group: (_a = walletBook.findWalletBookWallet(walletBook$1, wallet.name)) === null || _a === void 0 ? void 0 : _a.group,
         isInstalledOnBrowser: (_b = wallet.isInstalledOnBrowser()) !== null && _b !== void 0 ? _b : false,
         key: wallet.key,
         name: wallet.name,

package/src/lib/shared/utils/functions/wallet/createWallet.d.ts

@@ -1,3 +1,4 @@
+import { WalletBookSchema } from '@dynamic-labs/wallet-book';
 import type { WalletConnector } from '@dynamic-labs/wallet-connector-core';
 import { WalletOption } from '../../../types';
-export declare const createWallet: (wallet: WalletConnector) => WalletOption;
+export declare const createWallet: (walletBook: WalletBookSchema, wallet: WalletConnector) => WalletOption;

package/src/lib/shared/utils/functions/wallet/createWallet.js

@@ -1,9 +1,9 @@
 import { findWalletBookWallet } from '@dynamic-labs/wallet-book';
 
-const createWallet = (wallet) => {
+const createWallet = (walletBook, wallet) => {
     var _a, _b;
     return ({
-        group: (_a = findWalletBookWallet(wallet.name)) === null || _a === void 0 ? void 0 : _a.group,
+        group: (_a = findWalletBookWallet(walletBook, wallet.name)) === null || _a === void 0 ? void 0 : _a.group,
         isInstalledOnBrowser: (_b = wallet.isInstalledOnBrowser()) !== null && _b !== void 0 ? _b : false,
         key: wallet.key,
         name: wallet.name,

package/src/lib/shared/utils/hooks/index.d.ts

@@ -2,3 +2,4 @@ export { useLocalStorage } from './useLocalStorage';
 export { useOnClickOutside } from './useOnClickOutside';
 export { usePreventPageScroll } from './usePreventPageScroll';
 export { useGlobalLoading } from './useGlobalLoading';
+export { useMediaQuery } from './useMediaQuery';

package/src/lib/shared/utils/hooks/useGlobalLoading/useGlobalLoading.cjs

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var index = require('../../functions/lastAuthenticatedAccount/index.cjs');
 
-const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSettings, primaryWallet, user, }) => {
+const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSettings, primaryWallet, user, walletBook, }) => {
     var _a;
     const [sdkHasLoaded, setSdkHasLoaded] = React.useState(false);
     const primaryWalletIsLoading = user &&
@@ -13,6 +13,10 @@ const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSet
         !primaryWallet;
     const connectOnlyUserIsLoading = authMode === 'connect-only' && connectedInfo && !connectedWallet;
     React.useEffect(() => {
+        var _a;
+        if (!Object.keys((_a = walletBook === null || walletBook === void 0 ? void 0 : walletBook.wallets) !== null && _a !== void 0 ? _a : {}).length) {
+            return;
+        }
         if (projectSettings) {
             if (primaryWalletIsLoading || connectOnlyUserIsLoading) {
                 return;
@@ -25,6 +29,7 @@ const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSet
         user,
         primaryWalletIsLoading,
         connectOnlyUserIsLoading,
+        walletBook,
     ]);
     return {
         sdkHasLoaded,

package/src/lib/shared/utils/hooks/useGlobalLoading/useGlobalLoading.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import { ProjectSettings } from '@dynamic-labs/sdk-api';
+import { WalletBookSchema } from '@dynamic-labs/wallet-book';
 import { UserProfile, Wallet } from '../../../types';
 import { ConnectedWalletConnectorType } from '../../../../utils/hooks/useConnectWallet/useConnectWallet';
 type Props = {
@@ -9,8 +10,9 @@ type Props = {
     primaryWallet: Wallet | null;
     projectSettings: ProjectSettings | undefined;
     user: UserProfile | undefined;
+    walletBook: WalletBookSchema;
 };
-export declare const useGlobalLoading: ({ authMode, connectedInfo, connectedWallet, projectSettings, primaryWallet, user, }: Props) => {
+export declare const useGlobalLoading: ({ authMode, connectedInfo, connectedWallet, projectSettings, primaryWallet, user, walletBook, }: Props) => {
     sdkHasLoaded: boolean;
     setSdkHasLoaded: import("react").Dispatch<import("react").SetStateAction<boolean>>;
 };

package/src/lib/shared/utils/hooks/useGlobalLoading/useGlobalLoading.js

@@ -1,7 +1,7 @@
 import { useState, useEffect } from 'react';
 import { lastAuthenticatedAccount } from '../../functions/lastAuthenticatedAccount/index.js';
 
-const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSettings, primaryWallet, user, }) => {
+const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSettings, primaryWallet, user, walletBook, }) => {
     var _a;
     const [sdkHasLoaded, setSdkHasLoaded] = useState(false);
     const primaryWalletIsLoading = user &&
@@ -9,6 +9,10 @@ const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSet
         !primaryWallet;
     const connectOnlyUserIsLoading = authMode === 'connect-only' && connectedInfo && !connectedWallet;
     useEffect(() => {
+        var _a;
+        if (!Object.keys((_a = walletBook === null || walletBook === void 0 ? void 0 : walletBook.wallets) !== null && _a !== void 0 ? _a : {}).length) {
+            return;
+        }
         if (projectSettings) {
             if (primaryWalletIsLoading || connectOnlyUserIsLoading) {
                 return;
@@ -21,6 +25,7 @@ const useGlobalLoading = ({ authMode, connectedInfo, connectedWallet, projectSet
         user,
         primaryWalletIsLoading,
         connectOnlyUserIsLoading,
+        walletBook,
     ]);
     return {
         sdkHasLoaded,

package/src/lib/shared/utils/hooks/useLocalStorage/useLocalStorage.cjs

@@ -4,27 +4,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var logger = require('../../../logger.cjs');
-require('@dynamic-labs/sdk-api');
-var getFromLS = require('../../functions/storage/getFromLS.cjs');
-require('../../../../config/LSSuffix.cjs');
-var removeFromLS = require('../../functions/storage/removeFromLS.cjs');
-var setToLS = require('../../functions/storage/setToLS.cjs');
-require('@dynamic-labs/iconic');
-require('@dynamic-labs/wallet-connector-core');
-require('react/jsx-runtime');
-require('../../../../context/ViewContext/ViewContext.cjs');
-require('@dynamic-labs/wallet-book');
-require('@dynamic-labs/utils');
-require('../../../../utils/constants/colors.cjs');
-require('ethers');
+var localStorage = require('../../classes/storage/localStorage.cjs');
 
 const useLocalStorage = (key, initialValue, valueValidator, otherKeysToRemove) => {
     const [storedValue, setStoredValue] = React.useState(() => {
         try {
-            const item = getFromLS.getFromLS(key);
+            const item = localStorage.LocalStorage.getFromLS(key);
             if (Boolean(item) && valueValidator && !valueValidator(item)) {
-                removeFromLS.removeFromLS(key);
-                otherKeysToRemove === null || otherKeysToRemove === void 0 ? void 0 : otherKeysToRemove.forEach((k) => removeFromLS.removeFromLS(k));
+                localStorage.LocalStorage.removeFromLS(key);
+                otherKeysToRemove === null || otherKeysToRemove === void 0 ? void 0 : otherKeysToRemove.forEach((k) => localStorage.LocalStorage.removeFromLS(k));
                 return initialValue;
             }
             else {
@@ -40,14 +28,14 @@ const useLocalStorage = (key, initialValue, valueValidator, otherKeysToRemove) =
         try {
             const valueToStore = value instanceof Function ? value(storedValue) : value;
             setStoredValue(valueToStore);
-            setToLS.setToLS(key, valueToStore);
+            localStorage.LocalStorage.setToLS(key, valueToStore);
         }
         catch (error) {
             logger.logger.error(error);
         }
     }, [key, storedValue]);
     const removeValue = React.useCallback(() => {
-        removeFromLS.removeFromLS(key);
+        localStorage.LocalStorage.removeFromLS(key);
         setStoredValue(initialValue);
     }, [initialValue, key]);
     return [storedValue, setValue, removeValue];

package/src/lib/shared/utils/hooks/useLocalStorage/useLocalStorage.js

@@ -1,26 +1,14 @@
 import { useState, useCallback } from 'react';
 import { logger } from '../../../logger.js';
-import '@dynamic-labs/sdk-api';
-import { getFromLS } from '../../functions/storage/getFromLS.js';
-import '../../../../config/LSSuffix.js';
-import { removeFromLS } from '../../functions/storage/removeFromLS.js';
-import { setToLS } from '../../functions/storage/setToLS.js';
-import '@dynamic-labs/iconic';
-import '@dynamic-labs/wallet-connector-core';
-import 'react/jsx-runtime';
-import '../../../../context/ViewContext/ViewContext.js';
-import '@dynamic-labs/wallet-book';
-import '@dynamic-labs/utils';
-import '../../../../utils/constants/colors.js';
-import 'ethers';
+import { LocalStorage } from '../../classes/storage/localStorage.js';
 
 const useLocalStorage = (key, initialValue, valueValidator, otherKeysToRemove) => {
     const [storedValue, setStoredValue] = useState(() => {
         try {
-            const item = getFromLS(key);
+            const item = LocalStorage.getFromLS(key);
             if (Boolean(item) && valueValidator && !valueValidator(item)) {
-                removeFromLS(key);
-                otherKeysToRemove === null || otherKeysToRemove === void 0 ? void 0 : otherKeysToRemove.forEach((k) => removeFromLS(k));
+                LocalStorage.removeFromLS(key);
+                otherKeysToRemove === null || otherKeysToRemove === void 0 ? void 0 : otherKeysToRemove.forEach((k) => LocalStorage.removeFromLS(k));
                 return initialValue;
             }
             else {
@@ -36,14 +24,14 @@ const useLocalStorage = (key, initialValue, valueValidator, otherKeysToRemove) =
         try {
             const valueToStore = value instanceof Function ? value(storedValue) : value;
             setStoredValue(valueToStore);
-            setToLS(key, valueToStore);
+            LocalStorage.setToLS(key, valueToStore);
         }
         catch (error) {
             logger.error(error);
         }
     }, [key, storedValue]);
     const removeValue = useCallback(() => {
-        removeFromLS(key);
+        LocalStorage.removeFromLS(key);
         setStoredValue(initialValue);
     }, [initialValue, key]);
     return [storedValue, setValue, removeValue];

package/src/lib/shared/utils/hooks/useMediaQuery/index.d.ts

@@ -0,0 +1 @@
+export { useMediaQuery } from './useMediaQuery';

package/src/lib/shared/utils/hooks/useMediaQuery/useMediaQuery.cjs

@@ -0,0 +1,31 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+// This hook is based on https://usehooks-ts.com/react-hook/use-media-query
+const useMediaQuery = (query) => {
+    const getMatches = (query) => {
+        // Prevents SSR issues
+        if (typeof window !== 'undefined') {
+            return window.matchMedia(query).matches;
+        }
+        return false;
+    };
+    const [matches, setMatches] = React.useState(getMatches(query));
+    const handleChange = () => setMatches(getMatches(query));
+    React.useEffect(() => {
+        const matchMedia = window.matchMedia(query);
+        // Triggered at the first client-side load and if query changes
+        handleChange();
+        matchMedia.addEventListener('change', handleChange);
+        return () => {
+            matchMedia.removeEventListener('change', handleChange);
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [query]);
+    return matches;
+};
+
+exports.useMediaQuery = useMediaQuery;

package/src/lib/shared/utils/hooks/useMediaQuery/useMediaQuery.d.ts

@@ -0,0 +1 @@
+export declare const useMediaQuery: (query: string) => boolean;

package/src/lib/shared/utils/hooks/useMediaQuery/useMediaQuery.js

@@ -0,0 +1,27 @@
+import { useState, useEffect } from 'react';
+
+// This hook is based on https://usehooks-ts.com/react-hook/use-media-query
+const useMediaQuery = (query) => {
+    const getMatches = (query) => {
+        // Prevents SSR issues
+        if (typeof window !== 'undefined') {
+            return window.matchMedia(query).matches;
+        }
+        return false;
+    };
+    const [matches, setMatches] = useState(getMatches(query));
+    const handleChange = () => setMatches(getMatches(query));
+    useEffect(() => {
+        const matchMedia = window.matchMedia(query);
+        // Triggered at the first client-side load and if query changes
+        handleChange();
+        matchMedia.addEventListener('change', handleChange);
+        return () => {
+            matchMedia.removeEventListener('change', handleChange);
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [query]);
+    return matches;
+};
+
+export { useMediaQuery };

package/src/lib/shared/utils/index.d.ts

@@ -1,2 +1,3 @@
 export * from './functions';
 export * from './hooks';
+export * from './classes';