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


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
}