From 7c64df6d8887655908f0adbbe7349ef661d5ca90 Mon Sep 17 00:00:00 2001 From: rasguy92 Date: Fri, 8 Dec 2023 21:31:14 +0700 Subject: [PATCH] feat: fix randomness bug --- .../CreateGameCard/CreateCoinFlipGameCard.tsx | 11 +++++----- .../CreateGameCard/CreateDiceGameCard.tsx | 12 +++++------ .../JoinGameCard/JoinCoinFlipGameCard.tsx | 10 +++++----- .../JoinGameCard/JoinDiceGamecard.tsx | 11 ++++++---- src/hooks/useDrand.ts | 20 +++++-------------- src/main.tsx | 4 ++-- 6 files changed, 30 insertions(+), 38 deletions(-) diff --git a/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx b/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx index 4aa5fbd..fe33fe3 100644 --- a/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx +++ b/src/components/CreateGameCard/CreateCoinFlipGameCard.tsx @@ -33,13 +33,13 @@ import { ErrorMessage } from '@hookform/error-message'; import { ArrowDownIcon, StarLoaderIcon } from '../../assets/icons'; import tw from 'twin.macro'; import { useForm } from 'react-hook-form'; -import { useCreateGameParams, useNavigateTo, useWegaStore, useTokenUSDValue, useDrand } from '../../hooks'; +import { useCreateGameParams, useNavigateTo, useWegaStore, useTokenUSDValue } from '../../hooks'; import { useCreateWagerAndDepositMutation, useAllowanceQuery, useApproveERC20Mutation, } from './blockchainApiSlice'; -import { useCreateGameMutation } from './apiSlice'; +import { useCreateGameMutation, useGetRandomNumberQuery } from './apiSlice'; import { toastSettings, toBigIntInWei, escrowConfig, parseTopicDataFromEventLogs, convertBytesToNumber, parseError } from '../../utils'; import Button from '../../common/Button'; import { ToggleWagerBadge } from '../../common/ToggleWagerBadge'; @@ -69,7 +69,7 @@ export const CreateCoinFlipGameCard = ({ const { wallet, network, user} = useWegaStore(); const formRef = useRef(null); const detailsBlock = useRef(null) - const drand = useDrand(); + const drand = useGetRandomNumberQuery(undefined); const [currentWagerType] = useState(wagerType); const [currentCurrencyType, setCurrentCurrencyType] = useState(currencyType); const [currentCoinSide, setCurrentCoinSide] = useState(CoinSideTypes[CoinSideTypesEnum.HEADS]); @@ -114,7 +114,6 @@ export const CreateCoinFlipGameCard = ({ const handleCreateGameClick = async ({ wager }: { wager: number }) => { try { if(!isWagerApproved(allowanceQuery.data, toBigIntInWei(String(wager), tokenDecimals))) { - console.log(toBigIntInWei(String(watch('wager')), tokenDecimals).toString()) await approveERC20({ spender: escrowConfig.address[network?.id as keyof typeof escrowConfig.address], wagerAsBigint: toBigIntInWei(String(wager), tokenDecimals), @@ -122,7 +121,7 @@ export const CreateCoinFlipGameCard = ({ }).unwrap(); } const receipt = await createWagerAndDeposit({ - tokenAddress, wagerAsBigint: toBigIntInWei(String(wager), tokenDecimals), gameType, randomness: [convertBytesToNumber(drand.randomness)] }).unwrap(); + tokenAddress, wagerAsBigint: toBigIntInWei(String(wager), tokenDecimals), gameType, randomness: [convertBytesToNumber(drand.data.randomness)] }).unwrap(); const parsedTopicData = parseTopicDataFromEventLogs(receipt.logs, ['event GameCreation(bytes32 indexed escrowHash, uint256 indexed nonce, address creator, string name)']); await createGame({ gameType, @@ -170,7 +169,7 @@ export const CreateCoinFlipGameCard = ({ tokenDecimals ]); - return drand && tokenDecimals ? ( + return drand?.data && tokenDecimals ? (
) => { const { openConnectModal } = useConnectModal(); const { wallet, user, network } = useWegaStore(); - const randomness = useDrand(); + const randomness = useGetRandomNumberQuery(undefined); const formRef = useRef(null); const detailsBlock = useRef(null) const [currentWagerType] = useState(wagerType); @@ -114,7 +115,6 @@ export const CreateDiceGameCard = ({ }] = useCreateGameMutation(); const handleCreateGameClick = async ({ wager }: { wager: number }) => { - try { if(!isWagerApproved(allowanceQuery.data, toBigIntInWei(String(wager), tokenDecimals))) { await approveERC20({ @@ -127,7 +127,7 @@ export const CreateDiceGameCard = ({ tokenAddress, wagerAsBigint: toBigIntInWei(String(wager), tokenDecimals), gameType, - randomness: [convertBytesToNumber(randomness.randomness)] + randomness: [convertBytesToNumber(randomness.data.randomness)] }).unwrap(); const parsedTopicData = parseTopicDataFromEventLogs(receipt.logs, ['event GameCreation(bytes32 indexed escrowHash, uint256 indexed nonce, address creator, string name)']); await createGame({ @@ -177,7 +177,7 @@ export const CreateDiceGameCard = ({ useEffect(() => { allowanceQuery.refetch(); }, [ watch('wager'), playerAddress, tokenAddress ]); - return randomness ? ( + return randomness?.data ? ( { const { openConnectModal } = useConnectModal(); const { wallet, user, network } = useWegaStore(); - const drand = useDrand(); - + const drand = useGetRandomNumberQuery(undefined); const formRef = useRef(null); const detailsBlock = useRef(null) const [currentWagerType] = useState(wagerType); @@ -127,7 +127,7 @@ const JoinCoinFlipGameCard = ({ }).unwrap(); } const playerChoices = [Number(gameAttributes[0].value), currentCoinSide]; - await depositAndJoinCoinflip({escrowHash: escrowId, playerChoices, randomness: [convertBytesToNumber(drand.randomness)] }).unwrap(); + await depositAndJoinCoinflip({escrowHash: escrowId, playerChoices, randomness: [convertBytesToNumber(drand?.data.randomness)] }).unwrap(); await joinGame({ newPlayerUuid: playerUuid, gameUuid }).unwrap(); await updateGame({ uuid: gameUuid, @@ -162,7 +162,7 @@ const JoinCoinFlipGameCard = ({ tokenDecimals ]); - return drand && tokenDecimals ? ( + return drand?.data && tokenDecimals ? ( = ({ }: JoinDiceGameCardProps) => { const { openConnectModal } = useConnectModal(); const { wallet, user, network } = useWegaStore(); - const drand = useDrand(); + const drand = useGetRandomNumberQuery(undefined); + const formRef = useRef(null); const detailsBlock = useRef(null) const [currentWagerType] = useState(wagerType); @@ -116,7 +119,7 @@ const JoinGameDiceCard: React.FC = ({ } await depositAndJoinDice({ escrowHash: escrowId, - randomness: [convertBytesToNumber(drand.randomness)] + randomness: [convertBytesToNumber(drand.data.randomness)] }).unwrap(); await joinGame({ newPlayerUuid: playerUuid, gameUuid }).unwrap(); await updateGame({ uuid: gameUuid, state: WegaState.PLAYING }).unwrap(); @@ -140,7 +143,7 @@ const JoinGameDiceCard: React.FC = ({ tokenDecimals ]); - return drand && tokenDecimals ? ( + return drand?.data && tokenDecimals ? ( (window.localStorage.getItem('drand') ?? 'empty'); const [currentDrand, setCurrentDrand] = useState(null); useEffect(() => { - if(drandInLocalStorage === 'empty' && randomness?.data) { + if(!currentDrand && randomness?.data){ setCurrentDrand(randomness.data); + console.log(randomness?.data.randomness && convertBytesToNumber(randomness?.data.randomness)) + } else { setTimeout(() => { randomness.refetch(); }, (60 * 1000) * 3); - } else if (drandInLocalStorage !== 'empty' && randomness?.data) { - setCurrentDrand(JSON.parse(drandInLocalStorage)); - window.localStorage.setItem('drand', JSON.stringify(randomness?.data ?? 'empty')) - } - if(drandInLocalStorage === 'empty' && (randomness.data && randomness.data?.round === JSON.parse(drandInLocalStorage).round)){ - setTimeout(() => { - randomness.refetch(); - }, (60 * 1000) * 3); - } else { - window.localStorage.setItem('drand', JSON.stringify(randomness?.data ?? 'empty')) } - }, [randomness?.data, randomness?.isLoading, setCurrentDrand]); - + }, [randomness?.data, randomness?.isLoading]); return currentDrand; } diff --git a/src/main.tsx b/src/main.tsx index d543e93..6ebebcd 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -7,10 +7,10 @@ import { gamesApiSlice } from './components/WegaGames/apiSlice.ts' import './themes/index.css' import GlobalStyles from "./themes/GlobalStyles.tsx"; import WalletProvider from './containers/WalletProvider/index.tsx' - +import { defaultNetwork } from "./models/constants.ts"; // TODO // remove old api files -store.dispatch(gamesApiSlice.endpoints.getGames.initiate(undefined)); +store.dispatch(gamesApiSlice.endpoints.getGames.initiate({ networkId: defaultNetwork?.id })); ReactDOM.createRoot(document.getElementById("root")!).render(