refactor: improve code quality

Author: abbesBenayache

src/components/ui/use-toast.ts

@@ -12,37 +12,28 @@ type ToasterToast = ToastProps & {
   action?: ToastActionElement;
 };
 
-const actionTypes = {
-  ADD_TOAST: 'ADD_TOAST',
-  UPDATE_TOAST: 'UPDATE_TOAST',
-  DISMISS_TOAST: 'DISMISS_TOAST',
-  REMOVE_TOAST: 'REMOVE_TOAST',
-} as const;
-
 let count = 0;
 
 function genId() {
   count = (count + 1) % Number.MAX_SAFE_INTEGER;
   return count.toString();
 }
 
-type ActionType = typeof actionTypes;
-
 type Action =
   | {
-      type: ActionType['ADD_TOAST'];
+      type: 'ADD_TOAST';
       toast: ToasterToast;
     }
   | {
-      type: ActionType['UPDATE_TOAST'];
+      type: 'UPDATE_TOAST';
       toast: Partial<ToasterToast>;
     }
   | {
-      type: ActionType['DISMISS_TOAST'];
+      type: 'DISMISS_TOAST';
       toastId?: ToasterToast['id'];
     }
   | {
-      type: ActionType['REMOVE_TOAST'];
+      type: 'REMOVE_TOAST';
       toastId?: ToasterToast['id'];
     };
 

src/config/config.ts

@@ -8,18 +8,24 @@ export const LOCAL_STORAGE_PREFIX = 'Web3Messaging';
 export const CONTACT_URL =
   'https://airtable.com/appDiKrXe5wJgGpdP/pagm2GF2eNdX2ysw3/form';
 
+// Chain ID constants
+export const BELLECOUR_CHAIN_ID = 134;
+export const ARBITRUM_CHAIN_ID = 42161;
+
+// Workerpool configuration
+export const WORKERPOOL_ADDRESS_OR_ENS = 'prod-v8-learn.main.pools.iexec.eth';
+export const WORKERPOOL_MAX_PRICE = 0.1 * 1e9; // 0.1 RLC in wei
+
 /**
  * See smart-contract transactions:
  * https://blockscout-bellecour.iex.ec/address/0x781482C39CcE25546583EaC4957Fb7Bf04C277D2
  *
  * See all idapps in the whitelist:
  * https://explorer.iex.ec/bellecour/address/0x0c6c77a11068db9fadfba25182e02863361f58da
  */
-export const WORKERPOOL_ADDRESS_OR_ENS = 'prod-v8-learn.main.pools.iexec.eth';
-
 export const SUPPORTED_CHAINS = [
   {
-    id: 134,
+    id: BELLECOUR_CHAIN_ID,
     name: 'Bellecour',
     slug: 'bellecour',
     color: '#F4942566',
@@ -37,7 +43,7 @@ export const SUPPORTED_CHAINS = [
     },
   },
   {
-    id: 42161,
+    id: ARBITRUM_CHAIN_ID,
     name: 'Arbitrum',
     slug: 'arbitrum-mainnet',
     color: '#F4942566',

src/hooks/useWatchAccount.ts

@@ -15,14 +15,12 @@ export function useWatchAccount() {
     useUserStore();
 
   useEffect(() => {
-    // Update userStore
     setConnector(connector);
     setIsConnected(isConnected);
     setAddress(address);
-    if (accountChain?.id && chainId !== accountChain?.id) {
-      setTimeout(() => {
-        setChainId(accountChain?.id);
-      }, 10);
+
+    if (accountChain?.id && chainId !== accountChain.id) {
+      setChainId(accountChain.id);
     }
 
     // Update dataProtector client
@@ -31,5 +29,16 @@ export function useWatchAccount() {
       return;
     }
     cleanIExecSDKs();
-  }, [connector, status, address, accountChain]);
+  }, [
+    connector,
+    status,
+    address,
+    accountChain,
+    chainId,
+    isConnected,
+    setConnector,
+    setIsConnected,
+    setAddress,
+    setChainId,
+  ]);
 }

src/utils/chain.utils.ts

@@ -4,24 +4,27 @@ export function getSupportedChains() {
   return SUPPORTED_CHAINS;
 }
 
-export function getSubgraphUrl(chainId: number) {
-  const subgraphUrl = getSupportedChains().find(
-    (chain) => chain.id === chainId
-  )?.subgraphUrl;
-  if (!subgraphUrl) {
+export function getSubgraphUrl(chainId: number): string {
+  const chain = getSupportedChains().find((chain) => chain.id === chainId);
+  if (!chain?.subgraphUrl) {
     throw new Error(`Subgraph URL not found for chain ID: ${chainId}`);
   }
-  return subgraphUrl;
+  return chain.subgraphUrl;
 }
 
-export function getWhitelistAddresses(chainId: number | undefined) {
+export function getWhitelistAddresses(chainId: number | undefined): {
+  web3mail: string;
+  web3telegram: string;
+} {
   if (chainId === undefined) {
     throw new Error('Chain ID is required to get whitelist addresses');
   }
+
   const chain = getSupportedChains().find((chain) => chain.id === chainId);
   if (!chain?.whitelist) {
     throw new Error(`Whitelist not found for chain ID: ${chainId}`);
   }
+
   return chain.whitelist;
 }
 
@@ -33,7 +36,24 @@ export function getChainFromId(id: number | undefined) {
   return getSupportedChains().find((c) => c.id === id);
 }
 
-export function getBlockExplorerUrl(chainId: number) {
+export function getBlockExplorerUrl(chainId: number): string {
+  const chain = getChainFromId(chainId);
+  if (!chain?.blockExplorerUrl) {
+    console.warn(
+      `Block explorer URL not found for chain ID: ${chainId}, using default`
+    );
+    return 'https://blockscout.com/';
+  }
+  return chain.blockExplorerUrl;
+}
+
+// Helper function to check if a chain is supported
+export function isChainSupported(chainId: number): boolean {
+  return getSupportedChains().some((chain) => chain.id === chainId);
+}
+
+// Helper function to get chain name
+export function getChainName(chainId: number): string {
   const chain = getChainFromId(chainId);
-  return chain?.blockExplorerUrl ?? 'https://blockscout.com/';
+  return chain?.name || `Unknown Chain (${chainId})`;
 }

src/utils/getUserFriendlyStatues.ts

@@ -1,5 +1,5 @@
 export function getUserFriendlyStatues(status: string) {
-  const statusMessages = {
+  const statusMessages: { [key: string]: string } = {
     DEPLOY_PROTECTED_DATA:
       'Create protected data into DataProtector registry smart-contract',
     PUSH_SECRET_TO_SMS: 'Push protected data encryption key to iExec SMS',

src/views/contact/sendMessage.tsx

@@ -1,4 +1,8 @@
-import { WORKERPOOL_ADDRESS_OR_ENS } from '@/config/config';
+import {
+  WORKERPOOL_ADDRESS_OR_ENS,
+  BELLECOUR_CHAIN_ID,
+  WORKERPOOL_MAX_PRICE,
+} from '@/config/config';
 import { Address } from '@/types';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { useState } from 'react';
@@ -73,6 +77,13 @@ export default function SendMessage() {
     protectedData.data?.schema &&
     getDataType(protectedData.data?.schema) === 'mail';
 
+  // Helper function to create workerpool configuration
+  const getWorkerpoolConfig = () => ({
+    workerpoolAddressOrEns:
+      chainId === BELLECOUR_CHAIN_ID ? WORKERPOOL_ADDRESS_OR_ENS : undefined,
+    workerpoolMaxPrice: WORKERPOOL_MAX_PRICE,
+  });
+
   const handleChange = (e: { target: { name: string; value: string } }) => {
     const { name, value } = e.target;
     setFormData((prevData) => ({
@@ -116,7 +127,8 @@ export default function SendMessage() {
           senderName: formData.senderName,
           contentType: formData.contentType,
           emailContent: formData.messageContent,
-          workerpoolAddressOrEns: WORKERPOOL_ADDRESS_OR_ENS,
+          workerpoolAddressOrEns: getWorkerpoolConfig().workerpoolAddressOrEns,
+          workerpoolMaxPrice: getWorkerpoolConfig().workerpoolMaxPrice,
         });
         return sendMail;
       } else {
@@ -126,7 +138,8 @@ export default function SendMessage() {
           protectedData: protectedDataAddress!,
           senderName: formData.senderName,
           telegramContent: formData.messageContent,
-          workerpoolAddressOrEns: WORKERPOOL_ADDRESS_OR_ENS,
+          workerpoolAddressOrEns: getWorkerpoolConfig().workerpoolAddressOrEns,
+          workerpoolMaxPrice: getWorkerpoolConfig().workerpoolMaxPrice,
         });
         return sendTelegram;
       }