refactor network management

.prettierignore

@@ -1,2 +1,3 @@
 packages/snap/snap.manifest.json
+packages/dapp/.next
 

packages/dapp/src/components/NetworkMenu.tsx

@@ -8,7 +8,6 @@ import {
   Spinner,
 } from '@chakra-ui/react';
 import { CHAIN_ID, DefaultProviderUrls } from '@massalabs/massa-web3';
-import { useMemo } from 'react';
 
 import { invalidateNetwork, useNetwork } from '@/hooks/useNetwork';
 import { invalidateOperations } from '@/hooks/useOperations';
@@ -28,18 +27,10 @@ export const NetworkMenu = () => {
   const { data: activeNetwork } = useNetwork();
   const setNetwork = useSetNetwork();
 
-  const activeNetworkDisplay = useMemo(() => {
-    if (activeNetwork === undefined) {
-      return;
-    }
-    return networkList.find((network) => network.url === activeNetwork.network)
-      ?.name;
-  }, [activeNetwork]);
-
   return (
     <Menu>
       <MenuButton as={Button} rightIcon={<ChevronDownIcon />}>
-        {activeNetworkDisplay ?? <Spinner />}
+        {activeNetwork?.networkName ?? <Spinner />}
       </MenuButton>
       <MenuList>
         {networkList.map((network) => (

packages/dapp/src/hooks/useMassaClient.ts

@@ -1,12 +1,8 @@
 import type { Client } from '@massalabs/massa-web3';
-import {
-  CHAIN_ID,
-  ClientFactory,
-  DefaultProviderUrls,
-} from '@massalabs/massa-web3';
+import { ClientFactory } from '@massalabs/massa-web3';
 import { useCallback, useEffect, useState } from 'react';
 
-import type { NetworkResponse } from './useNetwork';
+import type { NetworkInfos } from './useNetwork';
 import { useNetwork } from './useNetwork';
 
 /**
@@ -17,14 +13,10 @@ export const useMassaClient = () => {
   const { data: network } = useNetwork();
   const [client, setClient] = useState<Client>();
   const createClient = useCallback(
-    async (net: NetworkResponse) => {
+    async (net: NetworkInfos) => {
       const newClient = await ClientFactory.createDefaultClient(
-        net?.network === DefaultProviderUrls.MAINNET
-          ? DefaultProviderUrls.MAINNET
-          : DefaultProviderUrls.BUILDNET,
-        net?.network === DefaultProviderUrls.MAINNET
-          ? CHAIN_ID.MainNet
-          : CHAIN_ID.BuildNet,
+        net.rpcUrl as any,
+        BigInt(net.chainId),
       );
       setClient(newClient);
     },

packages/dapp/src/hooks/useNetwork.ts

@@ -5,8 +5,11 @@ import { MetaMaskContext } from './MetamaskContext';
 
 import { defaultSnapOrigin } from '@/config';
 
-export type NetworkResponse = {
-  network: string; // chainId
+export type NetworkInfos = {
+  rpcUrl: string;
+  chainId: string;
+  minimalFees: string;
+  networkName: string;
 };
 
 /**
@@ -25,7 +28,7 @@ export const useNetwork = () => {
         },
       },
     });
-    return res as NetworkResponse;
+    return res as NetworkInfos;
   };
 
   useEffect(() => {

packages/snap/.eslintrc.js

@@ -15,6 +15,10 @@ module.exports = {
     },
     {
       files: ['*.test.ts', '*.test.tsx'],
+      extends: [
+        '@metamask/eslint-config-nodejs',
+        '@metamask/eslint-config-typescript',
+      ],
       rules: {
         '@typescript-eslint/unbound-method': 'off',
         '@typescript-eslint/no-shadow': [

packages/snap/snap.manifest.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/massalabs/metamask-massa.git"
   },
   "source": {
-    "shasum": "vv52I6lYwAfHXV/0FJq4G3IEDhbfx97qNKpqHrva6do=",
+    "shasum": "iiRWI4joXMEzwWG6xh2p4qU/av3uF8sSap8XaFvJseE=",
     "location": {
       "npm": {
         "filePath": "dist/bundle.js",

packages/snap/src/accounts/clients.ts

@@ -1,40 +1,27 @@
 import type { Client, WalletClient } from '@massalabs/massa-web3';
 import { ClientFactory, ProviderType } from '@massalabs/massa-web3';
 
-import { getActiveChainId, getActiveRPC } from '../active-chain';
 import { getHDAccount } from './hd-deriver';
+import { getActiveNetwork } from '../active-chain';
 
-/**
- *
- * @param address
- * @param chainId
- */
-export async function getClient(url?: string): Promise<Client | undefined> {
+export async function getClient(): Promise<Client | undefined> {
   const account = await getHDAccount();
-  const rpc = url ?? (await getActiveRPC());
-  const chain_id = await getActiveChainId();
+  const networkInfos = await getActiveNetwork();
 
   if (!account) {
     return undefined;
   }
 
-  return await ClientFactory.createCustomClient(
-    [{ url: rpc, type: ProviderType.PUBLIC }],
-    chain_id,
+  return ClientFactory.createCustomClient(
+    [{ url: networkInfos.rpcUrl, type: ProviderType.PUBLIC }],
+    BigInt(networkInfos.chainId),
     true,
     account,
   );
 }
 
-/**
- *
- * @param address
- * @param chainId
- */
-export async function getClientWallet(
-  url?: string,
-): Promise<WalletClient | undefined> {
-  const client = await getClient(url);
+export async function getClientWallet(): Promise<WalletClient | undefined> {
+  const client = await getClient();
   if (!client) {
     return undefined;
   }

packages/snap/src/active-chain.ts

@@ -1,72 +1,39 @@
-import { CHAIN_ID, DefaultProviderUrls } from '@massalabs/massa-web3';
-
+import {
+  CHAIN_ID,
+  DefaultProviderUrls,
+  fromMAS,
+  MAINNET,
+} from '@massalabs/massa-web3';
 import { StateManager } from './state-manager';
-import { DEFAULT_MINIMAL_FEES } from './handlers';
-
-/**
- * @description Get the current network chain id
- * @returns Promise of the chain id as a bigint
- */
-export async function getActiveChainId(): Promise<bigint> {
-  const chain = await StateManager.getState('activeChainId');
-
-  if (!chain) {
-    await StateManager.setState('activeChainId', CHAIN_ID.MainNet.toString());
-    return CHAIN_ID.MainNet;
-  }
-  return BigInt(chain);
-}
-
-/**
- * @description Set the current network using a chain id
- * @param chainId - Chain id as a bigint
- */
-export async function setActiveChainId(chainId: bigint) {
-  await StateManager.setState('activeChainId', chainId.toString());
-}
+import { NetworkInfos } from './network';
 
-/**
- * @description Get the current network url
- * @returns Promise of the url as a string
- */
-export async function getActiveRPC(): Promise<string> {
-  const rpc = await StateManager.getState('activeRPC');
-
-  if (!rpc) {
-    await setActiveRPC(DefaultProviderUrls.MAINNET);
-    return DefaultProviderUrls.MAINNET;
-  }
-
-  return rpc;
-}
+const NETWORK_INFO_KEY = 'network_info';
 
+export const DEFAULT_MINIMAL_FEES = fromMAS('0.01').toString();
+export const DEFAULT_NETWORK = {
+  rpcUrl: DefaultProviderUrls.MAINNET,
+  chainId: CHAIN_ID.MainNet.toString(),
+  minimalFees: DEFAULT_MINIMAL_FEES,
+  networkName: MAINNET,
+};
 /**
- * @description Set the current network using a rpc URL
- * @param chainId - Chain id as a bigint
+ * @description Get the current network
+ * @returns NetworkInfos
  */
-export async function setActiveRPC(url: string) {
-  await StateManager.setState('activeRPC', url);
-}
+export async function getActiveNetwork(): Promise<NetworkInfos> {
+  const infos = await StateManager.getState(NETWORK_INFO_KEY);
 
-/**
- * @description Get the current minimal fees
- * @returns Promise of the minimal fees as a string
- */
-export async function getActiveMinimalFees(): Promise<string> {
-  const minimalFees = await StateManager.getState('minimalFees');
-
-  if (!minimalFees) {
-    await setActiveMinimalFees(DEFAULT_MINIMAL_FEES);
-    return DEFAULT_MINIMAL_FEES.toString();
+  if (!infos) {
+    await setActiveNetwork(DEFAULT_NETWORK);
+    return DEFAULT_NETWORK;
   }
-
-  return minimalFees;
+  return infos;
 }
 
 /**
- * @description Get the current minimal fees
- * @returns Promise of the minimal fees as a string
+ * @description Set the current network
+ * @param infos - Network infos
  */
-export async function setActiveMinimalFees(minimal_fees: string) {
-  await StateManager.setState('minimalFees', minimal_fees);
+export async function setActiveNetwork(infos: NetworkInfos) {
+  await StateManager.setState(NETWORK_INFO_KEY, infos);
 }