useGameState
The useGameState
hook is used for maintain updated state for a game.
a Game have a state
field that indicates their current state. For instance, GameState.Prematch
signifies the condition is currently in prematch state, while GameState.Stopped
indicates it has temporarily stopped accepting bets.
Usage
⚠️
Before utilizing useGameState
, it is essential to initialize the FeedSocketProvider
and the GameUpdatesProvider
:
import { ChainProvider, FeedSocketProvider, GameUpdatesProvider, useWatchers } from '@azuro-org/sdk'
function Providers(props: { children: React.ReactNode }) {
const { children } = props
return (
<ChainProvider>
<FeedSocketProvider>
<GameUpdatesProvider>
{children}
</GameUpdatesProvider>
</FeedSocketProvider>
</ChainProvider>
)
}
ℹ️
Example of usage: Condition wrapper around Outcome buttons.
We've retrieved markets with outcomes and rendered a button for each outcome and need to make sure that condition in a state to accept bets. The useGameState
hook offers a method to react to changes in the condition state. Full Example (opens in a new tab)
import { useGameState } from '@azuro-org/sdk'
import { GameQuery } from '@azuro-org/toolkit'
type ContentProps = {
game: NonNullable<GameQuery['game']>
}
const Content: React.FC<ContentProps> = ({ game }) => {
const { data: state } = useGameState({
gameId: game.gameId,
initialState: game.state,
})
return (
<>
<EventInfo game={game} state={state} />
<Markets game={game} gameState={state} />
</>
)
}
Props
{
gameId: string
initialState: GameState
}
enum GameState {
Finished = "Finished",
Live = "Live",
Prematch = "Prematch",
Stopped = "Stopped"
}
Return Value
{
data: GameState
}