From 565b94141419cff9dc3f2f09dcbd1a10b4e2188c Mon Sep 17 00:00:00 2001
From: Tiyo <tiyosheng@gmail.com>
Date: Sat, 28 Oct 2023 00:31:09 +0800
Subject: [PATCH] update: update Landing page

---
 .../client/src/pages/home/header/index.tsx    |   3 +-
 packages/client/src/pages/home/index.tsx      | 104 ++++++++++++------
 packages/client/src/pages/test/index.jsx      |  62 +++++++----
 packages/contracts/worlds.json                |   2 +-
 4 files changed, 113 insertions(+), 58 deletions(-)

diff --git a/packages/client/src/pages/home/header/index.tsx b/packages/client/src/pages/home/header/index.tsx
index fe5aaa8a..805cf240 100644
--- a/packages/client/src/pages/home/header/index.tsx
+++ b/packages/client/src/pages/home/header/index.tsx
@@ -9,6 +9,7 @@ import UserAddress from '@/components/UserAddress';
 interface IProps {
   onPlayBtnClick: () => void;
   walletAddress: string;
+  walletBalance: string;
 }
 
 const HomeHeader = (props: IProps) => {
@@ -41,7 +42,7 @@ const HomeHeader = (props: IProps) => {
 
       {
         props.walletAddress ?
-          <UserAddress address={props.walletAddress} account={'0.1ETH'}/>
+          <UserAddress address={props.walletAddress} account={props.walletBalance + 'ETH'}/>
           :
           <button className="play-btn mi-btn" onClick={props.onPlayBtnClick}>PLAY NOW</button>
       }
diff --git a/packages/client/src/pages/home/index.tsx b/packages/client/src/pages/home/index.tsx
index da467cd6..80ccf419 100644
--- a/packages/client/src/pages/home/index.tsx
+++ b/packages/client/src/pages/home/index.tsx
@@ -11,10 +11,23 @@ import { UserAddressKey } from '@/config';
 import { useNavigate } from 'react-router-dom';
 import Duck from '@/config/duck';
 import { delay } from '@/utils';
+import { useMUD } from '@/mud/MUDContext';
+import { useEntityQuery } from "@latticexyz/react";
+import { Has, getComponentValue } from '@latticexyz/recs';
+import { ethers } from 'ethers';
 
+const abi = [{"inputs":[{"internalType":"uint256","name":"_waitBlockCount","type":"uint256"},{"internalType":"string","name":"_symbol","type":"string"},{"internalType":"string","name":"_name","type":"string"},{"internalType":"string","name":"_notRevealedInfo","type":"string"},{"internalType":"string","name":"_revealedDesc","type":"string"}],"stateMutability":"nonpayable","type":"constructor"},{"inputs":[{"internalType":"address","name":"sender","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"},{"internalType":"address","name":"owner","type":"address"}],"name":"ERC721IncorrectOwner","type":"error"},{"inputs":[{"internalType":"address","name":"operator","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"ERC721InsufficientApproval","type":"error"},{"inputs":[{"internalType":"address","name":"approver","type":"address"}],"name":"ERC721InvalidApprover","type":"error"},{"inputs":[{"internalType":"address","name":"operator","type":"address"}],"name":"ERC721InvalidOperator","type":"error"},{"inputs":[{"internalType":"address","name":"owner","type":"address"}],"name":"ERC721InvalidOwner","type":"error"},{"inputs":[{"internalType":"address","name":"receiver","type":"address"}],"name":"ERC721InvalidReceiver","type":"error"},{"inputs":[{"internalType":"address","name":"sender","type":"address"}],"name":"ERC721InvalidSender","type":"error"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"ERC721NonexistentToken","type":"error"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"owner","type":"address"},{"indexed":true,"internalType":"address","name":"approved","type":"address"},{"indexed":true,"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"Approval","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"owner","type":"address"},{"indexed":true,"internalType":"address","name":"operator","type":"address"},{"indexed":false,"internalType":"bool","name":"approved","type":"bool"}],"name":"ApprovalForAll","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"internalType":"uint256","name":"randomId","type":"uint256"},{"indexed":false,"internalType":"address","name":"author","type":"address"}],"name":"NewRandom","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"from","type":"address"},{"indexed":true,"internalType":"address","name":"to","type":"address"},{"indexed":true,"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"Transfer","type":"event"},{"inputs":[{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"approve","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"owner","type":"address"}],"name":"balanceOf","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"getApproved","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"getStructInfo","outputs":[{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"getUserTokenIdList","outputs":[{"internalType":"uint256[]","name":"","type":"uint256[]"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"address","name":"owner","type":"address"},{"internalType":"address","name":"operator","type":"address"}],"name":"isApprovedForAll","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"mint","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[],"name":"name","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"owner","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"ownerOf","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"randomId","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"","type":"uint256"}],"name":"randomList","outputs":[{"internalType":"uint256","name":"blockNumber","type":"uint256"},{"internalType":"address","name":"author","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"revealNFT","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"safeTransferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"},{"internalType":"bytes","name":"data","type":"bytes"}],"name":"safeTransferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"operator","type":"address"},{"internalType":"bool","name":"approved","type":"bool"}],"name":"setApprovalForAll","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"bytes4","name":"interfaceId","type":"bytes4"}],"name":"supportsInterface","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"symbol","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"tokenId","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"tokenURI","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"transferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"uint256","name":"","type":"uint256"}],"name":"userList","outputs":[{"internalType":"uint256","name":"randomId","type":"uint256"},{"internalType":"address","name":"owner","type":"address"},{"internalType":"uint256","name":"HP","type":"uint256"},{"internalType":"uint256","name":"Attack","type":"uint256"},{"internalType":"uint256","name":"AttackRange","type":"uint256"},{"internalType":"uint256","name":"Speed","type":"uint256"},{"internalType":"uint256","name":"Strength","type":"uint256"},{"internalType":"uint256","name":"Space","type":"uint256"},{"internalType":"enum MRandom.RandomState","name":"state","type":"uint8"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"waitBlockCount","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"}]
+let userContract
 const Home = () => {
 
+  const {
+    components: { GlobalConfig },
+    systemCalls,
+    network
+  } = useMUD();
+
   const [walletAddress, setWalletAddress] = useState('');
+  const [walletBalance, setWalletBalance] = useState('');
   const [step, setStep] = useState('play');
   const usernameRef = useRef<HTMLInputElement>();
   const { Modal, open, close, setContent } = useModal({
@@ -26,6 +39,7 @@ const Home = () => {
   const navigate = useNavigate();
 
   useEffect(() => {
+    
     // const address = localStorage.getItem(UserAddressKey);
     // if (address) {
     //   setWalletAddress(address);
@@ -37,6 +51,18 @@ const Home = () => {
   const [head, setHead] = useState<string>();
   const [username, setUsername] = useState<string>();
 
+  const GlobalConfigData = useEntityQuery([Has(GlobalConfig)]).map((entity) => getComponentValue(GlobalConfig, entity));
+  console.log(GlobalConfigData, 'GlobalConfigData')
+
+  if (GlobalConfigData.length && GlobalConfigData[0].userContract) {
+    let privateKey = network.privateKey
+    let rpc = network.walletClient?.chain?.rpcUrls?.default?.http[0] || 'http://127.0.0.1:8545'
+    let provider = new ethers.providers.JsonRpcProvider(rpc)
+    let wallet = new ethers.Wallet(privateKey, provider)
+    console.log(wallet)
+    let userContractAddress = GlobalConfigData[0].userContract
+    userContract = new ethers.Contract(userContractAddress, abi, wallet)
+  }
 
   const createWallet = () => {
     setContent(
@@ -65,66 +91,78 @@ const Home = () => {
     // }, 3000);
   }
   
-  const toMint = () => {
+  const toMint = async () => {
     if (!usernameRef.current.value) {
       message.error('Please input your username');
       return;
     }
     setUsername(usernameRef.current.value);
-    setWalletAddress(UserAddress);
-    localStorage.setItem('mi_user_address', UserAddress)
+    await getBalance()
     close();
     setStep('mint');
   }
 
-  const mintAndGo = () => {
+  const mintAndGo = async () => {
     const clothes = Duck.Clothes[~~(Math.random() * Duck.Clothes.length)];
     const handheld = Duck.HandHeld[~~(Math.random() * Duck.HandHeld.length)];
     const head = Duck.Head[~~(Math.random() * Duck.Head.length)];
 
     setMinting(true);
 
-    delay(1000).then(() => {
-      setClothes(clothes);
-      setHandheld(handheld);
-      setHead(head);
-    }).delay(3000).then(() => {
-      navigate('/game', {
-        state: {
-          username,
-          clothes,
-          handheld,
-          head,
-        }
-      });
-    })
+    if (userContract) {
+      console.log(userContract, 'userContract')
+      try {
+        let tx = await userContract.mint()
+        await tx.wait()
+        console.log(tx, 'tx')
+        let tokenIds = await userContract.getUserTokenIdList()
+        console.log(tokenIds, 'tokenIds')
+        let tokenId = tokenIds[0].toString()
+        let t = await userContract.revealNFT(tokenId)
+        await t.wait()
+        console.log(t, 't')
+        delay(100).then(() => {
+          setClothes(clothes);
+          setHandheld(handheld);
+          setHead(head);
+        }).delay(3000).then(() => {
+          navigate('/game', {
+            state: {
+              username,
+              clothes,
+              handheld,
+              head,
+            }
+          });
+        })
+      } catch (error) {
+        console.log(error)
+      }
+    }
 
   }
 
   const play = () => {
-    // if (walletAddress) {
-    //   setContent(
-    //     <div className="create-wallet-wrapper">
-    //       <div className="create-wallet-content">
-    //         You have successfully created a wallet.Name your character and start your journey!
-    //       </div>
-    //       <div className="mint-name">
-    //         <input type="text" className="mi-input" ref={usernameRef} />
-    //         <button className="mi-btn" onClick={toMint}>OK</button>
-    //       </div>
-    //     </div>
-    //   );
-    //   open();
-    //   return;
-    // }
     createWallet();
   }
 
+  const getBalance = async () => {
+    let balance = await network.publicClient.getBalance({
+      address: network.walletClient.account.address
+    })
+    // 转成eth
+    let walletBalance = (+ethers.utils.formatEther(balance.toString())).toFixed(2)
+    setWalletAddress(network.walletClient.account.address);
+    setWalletBalance(walletBalance);
+    localStorage.setItem('mi_user_address', network.walletClient.account.address)
+  }
+
   return (
     <div className="mi-home-page">
       <Header
         onPlayBtnClick={play}
         walletAddress={walletAddress}
+        walletBalance={walletBalance}
       />
       {
         step === 'play' && (
diff --git a/packages/client/src/pages/test/index.jsx b/packages/client/src/pages/test/index.jsx
index 7f9c16cc..5d5e34c7 100644
--- a/packages/client/src/pages/test/index.jsx
+++ b/packages/client/src/pages/test/index.jsx
@@ -10,7 +10,8 @@ import { solidityKeccak256 } from 'ethers/lib/utils';
 import { getRandomStr } from '../../utils/utils';
 import './index.scss';
 
-const abi = [{"inputs":[{"internalType":"uint256","name":"_waitBlockCount","type":"uint256"},{"internalType":"string","name":"_symbol","type":"string"},{"internalType":"string","name":"_name","type":"string"},{"internalType":"string","name":"_notRevealedInfo","type":"string"},{"internalType":"string","name":"_revealedDesc","type":"string"}],"stateMutability":"nonpayable","type":"constructor"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"owner","type":"address"},{"indexed":true,"internalType":"address","name":"approved","type":"address"},{"indexed":true,"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"Approval","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"owner","type":"address"},{"indexed":true,"internalType":"address","name":"operator","type":"address"},{"indexed":false,"internalType":"bool","name":"approved","type":"bool"}],"name":"ApprovalForAll","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"internalType":"uint256","name":"randomId","type":"uint256"},{"indexed":false,"internalType":"address","name":"author","type":"address"}],"name":"NewRandom","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"from","type":"address"},{"indexed":true,"internalType":"address","name":"to","type":"address"},{"indexed":true,"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"Transfer","type":"event"},{"inputs":[{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"approve","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"owner","type":"address"}],"name":"balanceOf","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"getApproved","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"address","name":"owner","type":"address"},{"internalType":"address","name":"operator","type":"address"}],"name":"isApprovedForAll","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"mint","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[],"name":"name","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"owner","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"ownerOf","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"randomId","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"","type":"uint256"}],"name":"randomList","outputs":[{"internalType":"uint256","name":"blockNumber","type":"uint256"},{"internalType":"address","name":"author","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"revealNFT","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"safeTransferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"},{"internalType":"bytes","name":"data","type":"bytes"}],"name":"safeTransferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"operator","type":"address"},{"internalType":"bool","name":"approved","type":"bool"}],"name":"setApprovalForAll","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"bytes4","name":"interfaceId","type":"bytes4"}],"name":"supportsInterface","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"symbol","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"tokenId","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"tokenURI","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"transferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"uint256","name":"","type":"uint256"}],"name":"userList","outputs":[{"internalType":"uint256","name":"randomId","type":"uint256"},{"internalType":"address","name":"owner","type":"address"},{"internalType":"uint256","name":"HP","type":"uint256"},{"internalType":"uint256","name":"Attack","type":"uint256"},{"internalType":"uint256","name":"AttackRange","type":"uint256"},{"internalType":"uint256","name":"Speed","type":"uint256"},{"internalType":"uint256","name":"Strength","type":"uint256"},{"internalType":"uint256","name":"Space","type":"uint256"},{"internalType":"enum MRandom.RandomState","name":"state","type":"uint8"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"waitBlockCount","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"}]
+const abi = [{"inputs":[{"internalType":"uint256","name":"_waitBlockCount","type":"uint256"},{"internalType":"string","name":"_symbol","type":"string"},{"internalType":"string","name":"_name","type":"string"},{"internalType":"string","name":"_notRevealedInfo","type":"string"},{"internalType":"string","name":"_revealedDesc","type":"string"}],"stateMutability":"nonpayable","type":"constructor"},{"inputs":[{"internalType":"address","name":"sender","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"},{"internalType":"address","name":"owner","type":"address"}],"name":"ERC721IncorrectOwner","type":"error"},{"inputs":[{"internalType":"address","name":"operator","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"ERC721InsufficientApproval","type":"error"},{"inputs":[{"internalType":"address","name":"approver","type":"address"}],"name":"ERC721InvalidApprover","type":"error"},{"inputs":[{"internalType":"address","name":"operator","type":"address"}],"name":"ERC721InvalidOperator","type":"error"},{"inputs":[{"internalType":"address","name":"owner","type":"address"}],"name":"ERC721InvalidOwner","type":"error"},{"inputs":[{"internalType":"address","name":"receiver","type":"address"}],"name":"ERC721InvalidReceiver","type":"error"},{"inputs":[{"internalType":"address","name":"sender","type":"address"}],"name":"ERC721InvalidSender","type":"error"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"ERC721NonexistentToken","type":"error"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"owner","type":"address"},{"indexed":true,"internalType":"address","name":"approved","type":"address"},{"indexed":true,"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"Approval","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"owner","type":"address"},{"indexed":true,"internalType":"address","name":"operator","type":"address"},{"indexed":false,"internalType":"bool","name":"approved","type":"bool"}],"name":"ApprovalForAll","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"internalType":"uint256","name":"randomId","type":"uint256"},{"indexed":false,"internalType":"address","name":"author","type":"address"}],"name":"NewRandom","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"from","type":"address"},{"indexed":true,"internalType":"address","name":"to","type":"address"},{"indexed":true,"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"Transfer","type":"event"},{"inputs":[{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"approve","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"owner","type":"address"}],"name":"balanceOf","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"getApproved","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"getStructInfo","outputs":[{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"getUserTokenIdList","outputs":[{"internalType":"uint256[]","name":"","type":"uint256[]"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"address","name":"owner","type":"address"},{"internalType":"address","name":"operator","type":"address"}],"name":"isApprovedForAll","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"mint","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[],"name":"name","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"owner","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"ownerOf","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"randomId","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"","type":"uint256"}],"name":"randomList","outputs":[{"internalType":"uint256","name":"blockNumber","type":"uint256"},{"internalType":"address","name":"author","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"revealNFT","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"safeTransferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"},{"internalType":"bytes","name":"data","type":"bytes"}],"name":"safeTransferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"address","name":"operator","type":"address"},{"internalType":"bool","name":"approved","type":"bool"}],"name":"setApprovalForAll","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"bytes4","name":"interfaceId","type":"bytes4"}],"name":"supportsInterface","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"symbol","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"tokenId","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"_tokenId","type":"uint256"}],"name":"tokenURI","outputs":[{"internalType":"string","name":"","type":"string"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"address","name":"from","type":"address"},{"internalType":"address","name":"to","type":"address"},{"internalType":"uint256","name":"tokenId","type":"uint256"}],"name":"transferFrom","outputs":[],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"uint256","name":"","type":"uint256"}],"name":"userList","outputs":[{"internalType":"uint256","name":"randomId","type":"uint256"},{"internalType":"address","name":"owner","type":"address"},{"internalType":"uint256","name":"HP","type":"uint256"},{"internalType":"uint256","name":"Attack","type":"uint256"},{"internalType":"uint256","name":"AttackRange","type":"uint256"},{"internalType":"uint256","name":"Speed","type":"uint256"},{"internalType":"uint256","name":"Strength","type":"uint256"},{"internalType":"uint256","name":"Space","type":"uint256"},{"internalType":"enum MRandom.RandomState","name":"state","type":"uint8"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"waitBlockCount","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"}]
+let userContract
 
 const Test = () => {
   const [stepData, setStepData] = useState([]);
@@ -21,6 +22,7 @@ const Test = () => {
   const [boxData, setBoxData] = useState([]);
   const [boxId, setBoxId] = useState([]);
   const [revealNFTData, setRevealNFTData] = useState([]);
+  const [nftListData, setNftListData] = useState([]);
 
   const {
     components: { Player, GameConfig, BattleList, BoxList, GlobalConfig },
@@ -50,6 +52,15 @@ const Test = () => {
   const GlobalConfigData = useEntityQuery([Has(GlobalConfig)]).map((entity) => getComponentValue(GlobalConfig, entity));
   console.log(GlobalConfigData, 'GlobalConfigData')
 
+  if (GlobalConfigData.length && GlobalConfigData[0].userContract) {
+    let privateKey = network.privateKey
+    let rpc = network.walletClient?.chain?.rpcUrls?.default?.http[0] || 'http://127.0.0.1:8545'
+    let provider = new ethers.providers.JsonRpcProvider(rpc)
+    let wallet = new ethers.Wallet(privateKey, provider)
+    let userContractAddress = GlobalConfigData[0].userContract
+    userContract = new ethers.Contract(userContractAddress, abi, wallet)
+  }
+
   const battles = useEntityQuery([Has(BattleList)]).map((entity) => {
     let id = decodeEntity({ battleId: "uint256" }, entity);
     let battle = getComponentValue(BattleList, entity)
@@ -92,33 +103,27 @@ const Test = () => {
     return player;
   });
   console.log('players', players)
-  // console.log(playerData, 'playerData')
-  console.log(account, 'account')
+
+  const getNftList = async () => {
+    let nftList = await userContract.getUserTokenIdList()
+    nftList = nftList.map(e => e.toString())
+    console.log(nftList)
+    setNftListData(nftList)
+  }
 
   const mintFun = () => {
-    let privateKey = network.privateKey
-    let provider = new ethers.providers.JsonRpcProvider('http://127.0.0.1:8545')
-    let wallet = new ethers.Wallet(privateKey, provider)
-    console.log(wallet)
-    let userContractAddress = '0x2498e8059929e18e2a2cED4e32ef145fa2F4a744'
-    let userContract = new ethers.Contract(userContractAddress, abi, wallet)
-    console.log(userContract)
+    console.log(1, userContract)
     userContract.mint().then(async res => {
-      console.log(res, 'res')
       await res.wait()
-      userContract.tokenId().then(res => {
-        console.log(res, 'tokenId')
-      })
+      console.log(res)
+      getNftList()
+      // userContract.tokenId().then(res => {
+      //   console.log(res, 'tokenId')
+      // })
     })
   }
   
   const revealNFTFun = () => {
-    let privateKey = network.privateKey
-    let provider = new ethers.providers.JsonRpcProvider('http://127.0.0.1:8545')
-    let wallet = new ethers.Wallet(privateKey, provider)
-    console.log(wallet)
-    let userContractAddress = '0x2498e8059929e18e2a2cED4e32ef145fa2F4a744'
-    let userContract = new ethers.Contract(userContractAddress, abi, wallet)
     userContract.revealNFT(revealNFTData).then(async res => {
       console.log(res)
       await res.wait()
@@ -141,7 +146,7 @@ const Test = () => {
 
   const tokenIdChange = (e) => {
     console.log(e)
-    let value = e.target.value
+    let value = +e.target.value
     setRevealNFTData(value);
   }
 
@@ -344,14 +349,25 @@ const Test = () => {
         </div>
         <div className="section">
           <div className="title">revealNFT</div>
+          
           <div className="input">
-          <input type="text" onChange={tokenIdChange} placeholder='tokenId' />
+          <select value={revealNFTData} onChange={tokenIdChange}>
+            {
+              nftListData.map((item, index) => (<option key={index} value={item}>{item}</option>))
+            }
+          </select>
           </div>
           <div className="btn" onClick={revealNFTFun}>确认</div>
         </div>
         <div className="section">
           <div className="title">初始化玩家</div>
-          <div className="input"></div>
+          <div className="input">
+            <select value={revealNFTData} onChange={tokenIdChange}>
+              {
+                nftListData.map((item, index) => (<option key={index} value={item}>{item}</option>))
+              }
+            </select>
+          </div>
           <div className="btn" onClick={selectUserNftFun}>确认</div>
         </div>
         <div className="section">
diff --git a/packages/contracts/worlds.json b/packages/contracts/worlds.json
index 38b9f6f1..3f96c6d6 100644
--- a/packages/contracts/worlds.json
+++ b/packages/contracts/worlds.json
@@ -4,7 +4,7 @@
     "blockNumber": 27950347
   },
   "31337": {
-    "address": "0x492844c46CEf2d751433739fc3409B7A4a5ba9A7"
+    "address": "0x086ce0Da44C88Dac96cF0Dc4c5b2237eACca2E71"
   },
   "421613": {
     "address": "0x2Bc1034975c3df48D6f3026802f372677844b85d",