Merge branch 'main' into 503-bridge-back-to-stellar-max-amount-chosen…

…-by-the-user-allow-for-the-amount-that-is-incompatible

.prettierrc

@@ -0,0 +1,13 @@
+{
+  "arrowParens": "always",
+  "printWidth": 120,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "bracketSpacing": true,
+  "proseWrap": "always",
+  "plugins": ["prettier-plugin-tailwindcss"],
+  "tailwindConfig": "./tailwind.config.js"
+}

package.json

@@ -116,12 +116,13 @@
     "postcss": "^8.4.21",
     "postcss-import": "^15.1.0",
     "prettier": "^3.1.1",
+    "prettier-plugin-tailwindcss": "^0.6.4",
     "react-error-overlay": "6.0.9",
     "react-table": "^7.8.0",
     "sass": "^1.58.3",
     "semantic-release": "^22.0.12",
     "tailwindcss": "^3.4.3",
-    "typescript": "^5.4.5",
+    "typescript": "^5.5.4",
     "vite": "^3.2.7"
   },
   "engines": {

src/GlobalStateProvider/helpers.ts

@@ -0,0 +1,52 @@
+import { getWalletBySource, WalletAccount } from '@talismn/connect-wallets';
+import { getSdkError } from '@walletconnect/utils';
+import { storageService } from '../services/storage/local';
+import { walletConnectService } from '../services/walletConnect';
+import { initiateMetamaskInjectedAccount } from '../services/metamask';
+import { chainIds } from '../config/walletConnect';
+import { TenantName } from '../models/Tenant';
+import { LocalStorageKeys } from '../hooks/useLocalStorage';
+
+const initTalisman = async (dAppName: string, selected?: string) => {
+    const name = storageService.get(LocalStorageKeys.SELECTED_WALLET_NAME);
+    if (!name?.length) return;
+    const wallet = getWalletBySource(name);
+    if (!wallet) return;
+    await wallet.enable(dAppName);
+    const accounts = await wallet.getAccounts();
+    const selectedWallet = accounts.find((a) => a.address === selected) || accounts[0];
+    return selectedWallet;
+};
+
+const initWalletConnect = async (chainId: string) => {
+    const provider = await walletConnectService.getProvider();
+    if (!provider?.session) return;
+    return await walletConnectService.init(provider?.session, chainId);
+};
+
+const initMetamask = async (tenantName: TenantName) => {
+    const metamaskWalletAddress = storageService.get(LocalStorageKeys.SELECTED_WALLET_NAME);
+    if (metamaskWalletAddress) {
+      const injectedAccounts = await initiateMetamaskInjectedAccount(tenantName);
+      return injectedAccounts[0];
+    }
+};
+
+export const initSelectedWallet = async (dAppName: TenantName, tenantName: TenantName, storageAddress: string) => {
+  const appName = dAppName || TenantName.Amplitude;
+  return (await initTalisman(appName, storageAddress)) ||
+  (await initWalletConnect(chainIds[tenantName])) ||
+  (await initMetamask(tenantName));
+}
+
+export const handleWalletConnectDisconnect = async (walletAccount: WalletAccount | undefined) => {
+  if (walletAccount?.wallet?.extensionName === 'WalletConnect') {
+    const topic = walletConnectService.session?.topic;
+    if (topic) {
+      await walletConnectService.provider?.client.disconnect({
+        topic,
+        reason: getSdkError('USER_DISCONNECTED'),
+      });
+    }
+  }
+}

src/GlobalStateProvider.tsx → src/GlobalStateProvider/index.tsx

@@ -1,17 +1,14 @@
-import { getWalletBySource, WalletAccount } from '@talismn/connect-wallets';
-import { getSdkError } from '@walletconnect/utils';
 import { ComponentChildren, createContext } from 'preact';
 import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'preact/compat';
 import { useLocation } from 'react-router-dom';
-import { config } from './config';
-import { chainIds } from './config/walletConnect';
-import { storageKeys } from './constants/localStorage';
-import { useLocalStorage } from './hooks/useLocalStorage';
-import { TenantName } from './models/Tenant';
-import { ThemeName } from './models/Theme';
-import { initiateMetamaskInjectedAccount, WALLET_SOURCE_METAMASK } from './services/metamask/metamask';
-import { storageService } from './services/storage/local';
-import { walletConnectService } from './services/walletConnect';
+import { WalletAccount } from '@talismn/connect-wallets';
+import { config } from '../config';
+import { storageKeys } from '../constants/localStorage';
+import { LocalStorageKeys, useLocalStorage } from '../hooks/useLocalStorage';
+import { TenantName } from '../models/Tenant';
+import { ThemeName } from '../models/Theme';
+import { storageService } from '../services/storage/local';
+import { handleWalletConnectDisconnect, initSelectedWallet } from './helpers';
 
 const SECONDS_IN_A_DAY = 86400;
 const EXPIRATION_PERIOD = 2 * SECONDS_IN_A_DAY; // 2 days
@@ -29,31 +26,6 @@ export interface GlobalState {
 export const defaultTenant = TenantName.Pendulum;
 const GlobalStateContext = createContext<GlobalState | undefined>(undefined);
 
-const initTalisman = async (dAppName: string, selected?: string) => {
-  const name = storageService.get('@talisman-connect/selected-wallet-name');
-  if (!name?.length) return;
-  const wallet = getWalletBySource(name);
-  if (!wallet) return;
-  await wallet.enable(dAppName);
-  const accounts = await wallet.getAccounts();
-  const selectedWallet = accounts.find((a) => a.address === selected) || accounts[0];
-  return selectedWallet;
-};
-const initWalletConnect = async (chainId: string) => {
-  const provider = await walletConnectService.getProvider();
-  //const pairings = provider.client.pairing.getAll({ active: true });
-  if (!provider?.session) return;
-  return await walletConnectService.init(provider?.session, chainId);
-};
-
-const initMetamaskWallet = async (tenantName: TenantName) => {
-  const metamaskWalletAddress = storageService.get(`metamask-snap-account`);
-  if (metamaskWalletAddress) {
-    return await initiateMetamaskInjectedAccount(tenantName);
-  }
-  return;
-};
-
 const GlobalStateProvider = ({ children }: { children: ComponentChildren }) => {
   const tenantRef = useRef<string>();
   const [walletAccount, setWallet] = useState<WalletAccount | undefined>(undefined);
@@ -71,6 +43,7 @@ const GlobalStateProvider = ({ children }: { children: ComponentChildren }) => {
     [tenantName],
   );
 
+  // Get currently selected wallet account from local storage
   const {
     state: storageAddress,
     set,
@@ -80,34 +53,22 @@ const GlobalStateProvider = ({ children }: { children: ComponentChildren }) => {
     expire: EXPIRATION_PERIOD,
   });
 
-  const handleWalletConnectDisconnect = useCallback(async () => {
-    if (walletAccount?.wallet?.extensionName === 'WalletConnect') {
-      const topic = walletConnectService.session?.topic;
-      if (topic) {
-        await walletConnectService.provider?.client.disconnect({
-          topic,
-          reason: getSdkError('USER_DISCONNECTED'),
-        });
-      }
-    }
-  }, [walletAccount]);
+
+  const clearLocalStorageWallets = () => {
+    storageService.remove(LocalStorageKeys.SELECTED_WALLET_NAME);
+  }
 
   const removeWalletAccount = useCallback(async () => {
-    await handleWalletConnectDisconnect();
+    await handleWalletConnectDisconnect(walletAccount);
     clear();
-    // remove talisman
-    storageService.remove('@talisman-connect/selected-wallet-name');
-    storageService.remove(`metamask-snap-account`);
+    clearLocalStorageWallets()
     setWallet(undefined);
-  }, [clear, handleWalletConnectDisconnect]);
+  }, [clear, walletAccount]);
 
   const setWalletAccount = useCallback(
-    (wallet: WalletAccount | undefined) => {
-      set(wallet?.address);
-      setWallet(wallet);
-      if (wallet?.source === WALLET_SOURCE_METAMASK) {
-        storageService.set(`metamask-snap-account`, wallet.address);
-      }
+    (newWalletAccount: WalletAccount | undefined) => {
+      set(newWalletAccount?.address);
+      setWallet(newWalletAccount);
     },
     [set],
   );
@@ -122,11 +83,7 @@ const GlobalStateProvider = ({ children }: { children: ComponentChildren }) => {
       // skip if tenant already initialized
       if (tenantRef.current === tenantName || accountAddress) return;
       tenantRef.current = tenantName;
-      const appName = dAppName || TenantName.Amplitude;
-      const selectedWallet =
-        (await initTalisman(appName, storageAddress)) ||
-        (await initWalletConnect(chainIds[tenantName])) ||
-        (await initMetamaskWallet(tenantName));
+      const selectedWallet = await initSelectedWallet(dAppName, tenantName, storageAddress)
       if (selectedWallet) setWallet(selectedWallet);
     };
     run();

src/TermsAndConditions.tsx

@@ -1,9 +1,9 @@
 import { PropsWithChildren, useState } from 'preact/compat';
 import { Button, Checkbox, Link, Modal } from 'react-daisyui';
-import { useLocalStorage } from './hooks/useLocalStorage';
+import { useLocalStorage, LocalStorageKeys } from './hooks/useLocalStorage';
 
 const TermsAndConditions = (_props: PropsWithChildren) => {
-  const { state, set } = useLocalStorage<string | undefined>({ key: 'termsAndConditions' });
+  const { state, set } = useLocalStorage<string | undefined>({ key: LocalStorageKeys.TERMS_AND_CONDITIONS });
   const [checked, setChecked] = useState<boolean>(false);
 
   const acceptTerms = () => {

src/assets/CloseIcon.tsx

@@ -1,8 +1,10 @@
+import { FC } from "preact/compat";
+
 interface Props {
   className?: string;
 }
 
-export const CloseIcon: React.FC<Props> = ({ className = 'dark:fill-white fill-black' }) => (
+export const CloseIcon: FC<Props> = ({ className = 'dark:fill-white fill-black' }) => (
   <svg width="18" height="17" viewBox="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
     <path d="M1.51296 0.452847C1.21077 0.169549 0.736145 0.18486 0.452847 0.487044C0.169549 0.789228 0.18486 1.26386 0.487044 1.54715L1.51296 0.452847ZM16.487 16.5472C16.7892 16.8305 17.2639 16.8151 17.5472 16.513C17.8305 16.2108 17.8151 15.7361 17.513 15.4528L16.487 16.5472ZM17.513 1.54715C17.8151 1.26386 17.8305 0.789228 17.5472 0.487044C17.2639 0.18486 16.7892 0.169549 16.487 0.452847L17.513 1.54715ZM0.487044 15.4528C0.18486 15.7361 0.169549 16.2108 0.452847 16.513C0.736145 16.8151 1.21077 16.8305 1.51296 16.5472L0.487044 15.4528ZM0.487044 1.54715L8.48704 9.04715L9.51296 7.95285L1.51296 0.452847L0.487044 1.54715ZM8.48704 9.04715L16.487 16.5472L17.513 15.4528L9.51296 7.95285L8.48704 9.04715ZM9.51296 9.04715L17.513 1.54715L16.487 0.452847L8.48704 7.95285L9.51296 9.04715ZM16.487 0.452847L0.487044 15.4528L1.51296 16.5472L17.513 1.54715L16.487 0.452847Z" />
   </svg>