update contract addresses in config files and enhance player move commitment handling

This commit is contained in:
averel10
2025-11-21 18:42:43 +01:00
parent 06176e74f2
commit 3bd61490f1
5 changed files with 193 additions and 141 deletions

View File

@@ -17,6 +17,8 @@ export default function Clash() {
const [phase, setPhase] = useState<"games" | "commit" | "reveal">("games");
const [selectedMove, setSelectedMove] = useState<string | null>(null);
const [secret, setSecret] = useState<string>("");
const [availableAccounts, setAvailableAccounts] = useState<string[]>([]);
const [selectedAccount, setSelectedAccount] = useState<string>("");
const handlePlayClick = (gameId: number) => {
setPhase("commit");
@@ -41,13 +43,15 @@ export default function Clash() {
data.GAME_CONTRACT_ADDRESS
);
setContract(contractInstance);
// Get account
// Get accounts from MetaMask
if (globalThis.window !== undefined && (globalThis as any).ethereum) {
try {
const accounts = await (globalThis as any).ethereum.request({
method: "eth_requestAccounts",
});
setAvailableAccounts(accounts);
setAccount(accounts[0]);
setSelectedAccount(accounts[0]);
} catch (err: any) {
setStatus(
"MetaMask not available or user denied access: " + err.message
@@ -79,10 +83,33 @@ export default function Clash() {
{phase === "reveal" && "Reveal your move."}
</p>
<div className="mb-8 p-4 bg-slate-100 dark:bg-slate-700 rounded-lg">
<div className="mb-4">
<label className="block text-sm font-semibold text-slate-600 dark:text-slate-300 mb-2">
Select Wallet Address:
</label>
{availableAccounts.length > 0 ? (
<select
value={selectedAccount}
onChange={(e) => {
setSelectedAccount(e.target.value);
setAccount(e.target.value);
}}
className="w-full px-3 py-2 border border-slate-300 dark:border-slate-600 rounded-lg bg-white dark:bg-slate-800 text-slate-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-blue-500"
>
{availableAccounts.map((acc) => (
<option key={acc} value={acc}>
{`${acc.slice(0, 6)}...${acc.slice(-4)}`}
</option>
))}
</select>
) : (
<p className="text-sm text-red-600 dark:text-red-400">No accounts available</p>
)}
</div>
<p className="text-sm text-slate-600 dark:text-slate-300">
<span className="font-semibold">Connected Account:</span>{" "}
{account
? `${account.slice(0, 6)}...${account.slice(-4)}`
<span className="font-semibold">Active Account:</span>{" "}
{selectedAccount
? `${selectedAccount.slice(0, 6)}...${selectedAccount.slice(-4)}`
: "Not connected"}
</p>
<p className="text-sm text-slate-600 dark:text-slate-300 mt-2">
@@ -125,7 +152,7 @@ export default function Clash() {
<div className="space-y-6">
{phase === "games" && (
<GameList
account={account}
account={selectedAccount}
contract={contract}
config={config}
web3={web3}
@@ -135,7 +162,7 @@ export default function Clash() {
)}
{phase === "commit" && (
<Commit
account={account}
account={selectedAccount}
contract={contract}
config={config}
web3={web3}
@@ -144,11 +171,12 @@ export default function Clash() {
setSelectedMove={setSelectedMove}
secret={secret}
setSecret={setSecret}
onBothPlayersCommitted={() => setPhase("reveal")}
/>
)}
{phase === "reveal" && (
<Reveal
account={account}
account={selectedAccount}
contract={contract}
config={config}
web3={web3}