feat: centralize instances of hex address type in app commons package

packages/app-commons/src/index.ts

@@ -2,3 +2,4 @@ export * from './chains';
 export * from './components';
 export * from './config';
 export * from './utils';
+export * from './types';

packages/app-commons/src/types/address.ts

@@ -0,0 +1 @@
+export type HexAddress = `0x${string}`;

packages/app-commons/src/types/index.ts

@@ -0,0 +1 @@
+export * from './address';

packages/app-commons/src/utils/contractIds.ts

@@ -2,6 +2,7 @@ import { toUtf8Bytes, zeroPadValue } from 'ethers';
 import { ZeroBytes32, concat, sha256 } from 'fuels';
 
 import { ETH_CHAIN_NAME, FUEL_CHAIN_NAME } from '../config';
+import type { HexAddress } from '../types/address';
 
 export type BridgeTokenContracts = {
   ETH_ERC20: string;
@@ -10,10 +11,10 @@ export type BridgeTokenContracts = {
   FUEL_TokenContractImplementation?: string;
 };
 export type BridgeSolidityContracts = {
-  FuelChainState: `0x${string}`;
-  FuelMessagePortal: `0x${string}`;
-  FuelERC20GatewayV4: `0x${string}`;
-  FuelERC721Gateway: `0x${string}`;
+  FuelChainState: HexAddress;
+  FuelMessagePortal: HexAddress;
+  FuelERC20GatewayV4: HexAddress;
+  FuelERC721Gateway: HexAddress;
 };
 
 let bridgeTokenContract: BridgeTokenContracts;
@@ -115,8 +116,8 @@ export async function getBridgeSolidityContracts() {
 }
 
 export function getContractTokenId(
-  contractId: `0x${string}`,
-  erc20Address: `0x${string}`,
+  contractId: HexAddress,
+  erc20Address: HexAddress,
   tokenId = ZeroBytes32,
   chainId = '1',
 ) {

packages/app-portal/src/systems/Assets/services/asset.tsx

@@ -1,7 +1,7 @@
 import { assets } from '@fuel-ts/account';
 import type { Asset } from '@fuel-ts/account';
-import { BridgeTokenContracts } from 'app-commons';
-import { Provider, bn } from 'fuels';
+import type { BridgeTokenContracts, HexAddress } from 'app-commons';
+import { type Provider, bn } from 'fuels';
 import { isAddress } from 'viem';
 import type { PublicClient, WalletClient } from 'viem';
 import { ETH_CHAIN } from '~portal/systems/Chains';
@@ -37,7 +37,7 @@ export class AssetService {
 
     const erc20 = EthConnectorService.connectToErc20({
       walletClient,
-      address: address as `0x${string}`,
+      address: address as HexAddress,
     });
 
     const erc20MintHash = await erc20.write.mint(

packages/app-portal/src/systems/Bridge/events.tsx

@@ -6,6 +6,7 @@ import type { FromToNetworks } from '../Chains';
 import type { Store } from '../Store';
 import { Services } from '../Store';
 
+import type { HexAddress } from 'app-commons';
 import type { BridgeInputs, PossibleBridgeInputs } from './services';
 
 export function bridgeEvents(store: Store) {
@@ -31,7 +32,7 @@ export function bridgeEvents(store: Store) {
       store.send(Services.bridgeTxs, { type: 'FETCH_NEXT_PAGE' });
     },
     addTxEthToFuel(
-      input?: { ethTxId?: `0x${string}` } & BridgeInputs['fetchTxs'],
+      input?: { ethTxId?: HexAddress } & BridgeInputs['fetchTxs'],
     ) {
       if (!input) return;
 
@@ -70,7 +71,7 @@ export function bridgeEvents(store: Store) {
       input?: {
         fuelWallet: FuelWallet;
       };
-      ethTxId: `0x${string}`;
+      ethTxId: HexAddress;
     }) {
       if (!input) return;
 

packages/app-portal/src/systems/Bridge/hooks/useBridge.tsx

@@ -15,7 +15,7 @@ import {
   useFuelAccountConnection,
 } from '~portal/systems/Chains';
 
-import { FUEL_CHAIN } from 'app-commons';
+import { FUEL_CHAIN, type HexAddress } from 'app-commons';
 import { useEthBalance } from '~portal/systems/Chains/eth/hooks/useEthBalance';
 import { useSyncEthWallets } from '~portal/systems/Chains/eth/hooks/useSyncEthWallets';
 import { BridgeStatus } from '../machines';
@@ -85,7 +85,7 @@ export function useBridge() {
   } = useEthAccountConnection();
   const { ethBalance } = useEthBalance(
     ethAssetAddress?.startsWith('0x')
-      ? (ethAssetAddress as `0x${string}`)
+      ? (ethAssetAddress as HexAddress)
       : undefined,
   );
 
@@ -99,7 +99,7 @@ export function useBridge() {
     provider: fuelProvider,
   } = useFuelAccountConnection({
     assetId: fuelAssetAddress?.startsWith('0x')
-      ? (fuelAssetAddress as `0x${string}`)
+      ? (fuelAssetAddress as HexAddress)
       : undefined,
   });
 

packages/app-portal/src/systems/Bridge/machines/bridgeTxsMachine.tsx

@@ -10,6 +10,7 @@ import { txEthToFuelMachine } from '~portal/systems/Chains/eth/machines';
 import { FetchMachine } from '~portal/systems/Core/machines';
 import { delay } from '~portal/systems/Core/utils';
 
+import type { HexAddress } from 'app-commons';
 import type { PublicClient } from 'viem';
 import { BridgeService } from '../services';
 import type { BridgeInputs } from '../services';
@@ -48,7 +49,7 @@ export type BridgeTxsMachineEvents =
   | {
       type: 'ADD_TX_ETH_TO_FUEL';
       input: {
-        ethTxId?: `0x${string}`;
+        ethTxId?: HexAddress;
       } & BridgeInputs['fetchTxs'];
     }
   | {
@@ -153,7 +154,7 @@ export const bridgeTxsMachine = createMachine(
               ...prev,
               [tx.txHash]: spawn(
                 txEthToFuelMachine.withContext({
-                  ethTxId: tx.txHash as `0x${string}`,
+                  ethTxId: tx.txHash as HexAddress,
                   fuelAddress: ctx.fuelAddress,
                   fuelProvider: ctx.fuelProvider,
                   ethPublicClient: ctx.ethPublicClient,
@@ -207,7 +208,7 @@ export const bridgeTxsMachine = createMachine(
           const newRef = {
             [ethTxId]: spawn(
               txEthToFuelMachine.withContext({
-                ethTxId: ethTxId as `0x${string}`,
+                ethTxId: ethTxId as HexAddress,
                 fuelAddress: fuelAddress,
                 fuelProvider: fuelProvider,
                 ethPublicClient: ethPublicClient,
@@ -233,7 +234,7 @@ export const bridgeTxsMachine = createMachine(
           const newRef = {
             [fuelTxId]: spawn(
               txFuelToEthMachine.withContext({
-                fuelTxId: fuelTxId as `0x${string}`,
+                fuelTxId: fuelTxId as HexAddress,
                 fuelProvider: fuelProvider,
                 ethPublicClient: ethPublicClient,
               }),

packages/app-portal/src/systems/Chains/eth/contracts/FuelChainState.ts

@@ -1,5 +1,5 @@
 import { FuelChainState } from '@fuel-bridge/solidity-contracts';
-import { getBridgeSolidityContracts } from 'app-commons';
+import { type HexAddress, getBridgeSolidityContracts } from 'app-commons';
 import type { PublicClient } from 'viem';
 
 export const FUEL_CHAIN_STATE = {
@@ -33,7 +33,7 @@ export const FUEL_CHAIN_STATE = {
     const logs = await FUEL_CHAIN_STATE.getCommitSubmitted({ ethPublicClient });
     const lastCommitBlockHash = logs[logs.length - 1]?.blockHash;
     const lastBlockCommited = await ethPublicClient.getBlock({
-      blockHash: lastCommitBlockHash as `0x${string}`,
+      blockHash: lastCommitBlockHash as HexAddress,
     });
 
     return lastBlockCommited;
@@ -46,12 +46,12 @@ export const FUEL_CHAIN_STATE = {
     fuelBlockHashCommited: string;
   }) => {
     const logs = await FUEL_CHAIN_STATE.getCommitSubmitted({ ethPublicClient });
-    let ethBlockHash: `0x${string}` | undefined = undefined;
+    let ethBlockHash: HexAddress | undefined = undefined;
     for (let i = logs.length - 1; i >= 0; i--) {
       const log = logs[i];
       const args = log.args as unknown as { blockHash: string };
       if (args.blockHash === fuelBlockHashCommited) {
-        ethBlockHash = log.blockHash as `0x${string}`;
+        ethBlockHash = log.blockHash as HexAddress;
         break;
       }
     }

packages/app-portal/src/systems/Chains/eth/contracts/FuelErc20Gateway.ts

@@ -1,10 +1,11 @@
 import FuelERC20Gateway from '@fuel-bridge/solidity-contracts/artifacts/contracts/messaging/gateway/FuelERC20Gateway/FuelERC20GatewayV4.sol/FuelERC20GatewayV4.json';
+import type { HexAddress } from 'app-commons';
 
 export type FuelERC20GatewayArgs = {
   Deposit: {
     amount: bigint;
-    sender: `0x${string}`;
-    tokenAddress: `0x${string}`;
+    sender: HexAddress;
+    tokenAddress: HexAddress;
   };
 };
 

packages/app-portal/src/systems/Chains/eth/contracts/FuelMessagePortal.ts

@@ -1,17 +1,18 @@
 import FuelMessagePortal from '@fuel-bridge/solidity-contracts/artifacts/contracts/fuelchain/FuelMessagePortal/v3/FuelMessagePortalV3.sol/FuelMessagePortalV3.json';
+import type { HexAddress } from 'app-commons';
 
 export type FuelMessagePortalArgs = {
   MessageSent: {
     amount: bigint;
     nonce: bigint;
-    sender: `0x${string}`;
-    recipient: `0x${string}`;
-    data: `0x${string}`;
+    sender: HexAddress;
+    recipient: HexAddress;
+    data: HexAddress;
   };
 };
 
 export const decodeMessageSentData = {
-  erc20Deposit: (data: `0x${string}`) => {
+  erc20Deposit: (data: HexAddress) => {
     const pattern =
       /^0x([A-f0-9]{64})([A-f0-9]{64})([A-f0-9]{64})([A-f0-9]{64})([A-f0-9]{64})([A-f0-9]{64})([A-f0-9]{64})([A-f0-9]{64})$/;
     const match = data.match(pattern);

packages/app-portal/src/systems/Chains/eth/hooks/useEthBalance.tsx

@@ -1,6 +1,7 @@
+import type { HexAddress } from 'app-commons';
 import { useAccount, useBalance } from 'wagmi';
 
-export function useEthBalance(token?: `0x${string}`) {
+export function useEthBalance(token?: HexAddress) {
   const { address } = useAccount();
   const { data: ethBalance } = useBalance({
     address,

packages/app-portal/src/systems/Chains/eth/hooks/useTxEthToFuel.tsx

@@ -9,10 +9,11 @@ import { useFuelAccountConnection } from '../../fuel';
 import type { TxEthToFuelMachineState } from '../machines';
 import { isErc20Address } from '../utils';
 
+import type { HexAddress } from 'app-commons';
 import { deepCompare } from '../utils/deepCompare';
 
 const bridgeTxsSelectors = {
-  txEthToFuel: (txId?: `0x${string}`) => (state: BridgeTxsMachineState) => {
+  txEthToFuel: (txId?: HexAddress) => (state: BridgeTxsMachineState) => {
     if (!txId) return undefined;
 
     const machine = state.context?.ethToFuelTxRefs?.[txId]?.getSnapshot();
@@ -114,7 +115,7 @@ const txEthToFuelSelectors = {
 
 export function useTxEthToFuel({ id }: { id: string }) {
   const { wallet: fuelWallet } = useFuelAccountConnection();
-  const txId = id.startsWith('0x') ? (id as `0x${string}`) : undefined;
+  const txId = id.startsWith('0x') ? (id as HexAddress) : undefined;
   const { href: explorerLink } = useExplorerLink({
     network: 'ethereum',
     id,

packages/app-portal/src/systems/Chains/eth/machines/txEthToFuelMachine.tsx

@@ -11,6 +11,7 @@ import type { InterpreterFrom, StateFrom } from 'xstate';
 import { assign, createMachine } from 'xstate';
 import { FetchMachine } from '~portal/systems/Core/machines';
 
+import type { HexAddress } from 'app-commons';
 import type { PublicClient } from 'viem';
 import type { GetReceiptsInfoReturn, TxEthToFuelInputs } from '../services';
 import { TxEthToFuelService } from '../services';
@@ -19,7 +20,7 @@ import { EthTxCache } from '../utils';
 const FUEL_MESSAGE_GET_INTERVAL = 10000;
 
 type MachineContext = {
-  ethTxId?: `0x${string}`;
+  ethTxId?: HexAddress;
   ethTxNonce?: BN;
   fuelAddress?: FuelAddress;
   fuelProvider?: FuelProvider;

packages/app-portal/src/systems/Chains/eth/services/connectors.ts

@@ -1,7 +1,7 @@
 import type { GetContractReturnType, PublicClient, WalletClient } from 'viem';
 import { getContract } from 'viem';
 
-import type { BridgeSolidityContracts } from 'app-commons';
+import type { BridgeSolidityContracts, HexAddress } from 'app-commons';
 import { ERC_20 } from '../contracts/Erc20';
 import { FUEL_CHAIN_STATE } from '../contracts/FuelChainState';
 import { FUEL_ERC_20_GATEWAY } from '../contracts/FuelErc20Gateway';
@@ -49,7 +49,7 @@ export class EthConnectorService {
   static connectToErc20(options: {
     walletClient?: WalletClient;
     publicClient?: PublicClient;
-    address: `0x${string}`;
+    address: HexAddress;
   }) {
     const { walletClient, publicClient, address } = options;
 

packages/app-portal/src/systems/Chains/eth/services/txEthToFuel.ts

@@ -27,6 +27,7 @@ import {
 import { getBlockDate, isErc20Address } from '../utils';
 
 import {
+  type HexAddress,
   getBridgeSolidityContracts,
   getBridgeTokenContracts,
 } from 'app-commons';
@@ -49,7 +50,7 @@ export type TxEthToFuelInputs = {
     asset?: Asset;
   };
   getReceiptsInfo: {
-    ethTxId?: `0x${string}`;
+    ethTxId?: HexAddress;
     ethPublicClient?: PublicClient;
   };
   getFuelMessage: {
@@ -73,7 +74,7 @@ export type TxEthToFuelInputs = {
 
 export type GetReceiptsInfoReturn = {
   erc20Token?: {
-    address: `0x${string}`;
+    address: HexAddress;
     decimals: number;
   };
   amount?: BN;
@@ -132,7 +133,7 @@ export class TxEthToFuelService {
         });
 
         const txHash = await fuelPortal.write.depositETH(
-          [fuelAddress.toB256() as `0x${string}`],
+          [fuelAddress.toB256() as HexAddress],
           {
             value: BigInt(amount),
             account: ethWalletClient.account,
@@ -172,7 +173,7 @@ export class TxEthToFuelService {
         ethPublicClient
       ) {
         const erc20Token = EthConnectorService.connectToErc20({
-          address: ethAssetAddress as `0x${string}`,
+          address: ethAssetAddress as HexAddress,
           walletClient: ethWalletClient,
         });
 
@@ -205,7 +206,7 @@ export class TxEthToFuelService {
           bridgeSolidityContracts,
         });
         const depositTxHash = await fuelErc20Gateway.write.deposit([
-          fuelAddress.toB256() as `0x${string}`,
+          fuelAddress.toB256() as HexAddress,
           ethAssetAddress,
           amount,
         ]);
@@ -431,7 +432,7 @@ export class TxEthToFuelService {
         inputs: abiMessageSent?.inputs || [],
       },
       args: {
-        recipient: fuelAddress?.toHexString() as `0x${string}`,
+        recipient: fuelAddress?.toHexString() as HexAddress,
       },
       fromBlock: 'earliest' as const,
     });

packages/app-portal/src/systems/Chains/eth/utils/block.ts

@@ -1,13 +1,14 @@
 import { bn } from 'fuels';
 
+import type { HexAddress } from 'app-commons';
 import type { PublicClient } from 'viem';
 import { EthTxCache } from './txCache';
 
 export const getBlockDate = async ({
   blockHash,
   publicClient,
 }: {
-  blockHash: `0x${string}`;
+  blockHash: HexAddress;
   publicClient: PublicClient;
 }) => {
   const cachedBlockDate = EthTxCache.getBlockDate(blockHash);