feat(app/reputation): support Monad testnet for NFT minting

Author: ourai

src/domain/reputation/views/my-reputation-list/MyReputationItem.js

@@ -21,7 +21,6 @@ import { toast } from 'react-toastify';
 import { useAccount, useSwitchNetwork } from 'wagmi';
 
 import { Button } from '@/components/Button';
-import { NFT_SUPPORTED_CHAIN } from '@/constants/chain';
 import { contracts } from '@/constants/contract';
 import { formatTime } from '@/utils/date';
 
@@ -37,14 +36,14 @@ export default function MyReputationItem({ dataSource, onNotConnected, onMint })
   const [mintLoading, setMintLoading] = useState(null);
   const mediaUrl = useMediaUrl();
 
-  const { wrap } = useEnsureRightEnv({ chainId: NFT_SUPPORTED_CHAIN(), autoConnect: true, walletRequired: true });
+  const { wrap } = useEnsureRightEnv({ chainId: dataSource.mint_chain_id, autoConnect: true, walletRequired: true });
 
   const mint = wrap(async ({ id, mint_chain_id }) => {
     setMintLoading(id);
     await mintNft({
       id,
       chainId: mint_chain_id,
-      contract: contracts[NFT_SUPPORTED_CHAIN()].nft,
+      contract: contracts[mint_chain_id].nft,
       address,
       userId: user?.base.user_id,
     })

src/shared/constants/chain.js

@@ -28,13 +28,34 @@ import {
   trustWallet,
 } from '@rainbow-me/rainbowkit/wallets';
 import { bsc } from '@wagmi/chains';
+import { defineChain } from 'viem';
 import { configureChains, createConfig } from 'wagmi';
 import { bscTestnet } from 'wagmi/chains';
 import { alchemyProvider } from 'wagmi/providers/alchemy';
 import { infuraProvider } from 'wagmi/providers/infura';
 import { publicProvider } from 'wagmi/providers/public';
 
-const supportedChains = [bsc];
+const monadTestnet = defineChain({
+  id: 10143,
+  name: 'Monad Testnet',
+  network: 'monad-testnet',
+  nativeCurrency: {
+    decimals: 18,
+    name: 'MON',
+    symbol: 'MON',
+  },
+  rpcUrls: {
+    default: { http: ['https://testnet-rpc.monad.xyz'] },
+    public: { http: ['https://testnet-rpc.monad.xyz'] },
+  },
+  blockExplorers: {
+    etherscan: { name: 'MonadExplorer', url: 'https://testnet.monadexplorer.com' },
+    default: { name: 'MonadExplorer', url: 'https://testnet.monadexplorer.com' },
+  },
+  testnet: true,
+});
+
+const supportedChains = [bsc, monadTestnet];
 
 if (process.env.NODE_ENV !== 'production') {
   supportedChains.push(bscTestnet);
@@ -95,12 +116,3 @@ export function BOUNTY_SUPPORTED_CHAIN() {
     return 56;
   }
 }
-
-export function NFT_SUPPORTED_CHAIN() {
-  if (process.env.NEXT_PUBLIC_DOMAIN_ENV === 'development' || process.env.NEXT_PUBLIC_DOMAIN_ENV === 'test') {
-    return 97;
-  } else {
-    return 56;
-  }
-}
-

src/shared/constants/contract.js

@@ -27,7 +27,9 @@ export const contracts = {
     nft: '0xD3763ccfb312b14758848f47575b20Be6bE5AD04',
     bounty: '0x728206E44A0AD7E4226D3Ca6f2a3E79e344373E3',
   },
-  
+  10143: {
+    nft: '0xD27b2f759dD59B32401aBa3B94D5d27f44164832',
+  },
 };
 
 // nft: `0x${string}`

src/state/application/updater.js

@@ -20,9 +20,7 @@ import { useCallback, useEffect } from 'react';
 
 import { useMediaQuery } from '@/hooks/useMediaQuery';
 
-import { useAppDispatch } from '#/state/hooks';
-
-// import { getConfig } from '#/services/common'
+import { useAppDispatch } from '../hooks';
 import { updateConfig, updateOpenFilter, updateLessonMenu } from './reducer';
 
 export default function Updater({ datas }) {