Usegames – Azuro

Hook is used for fetch pre-match games.

Hook represents a logic wrapper over standard Apollo's useQuery hook. Explore Apollo's docs (opens in a new tab) to understand what data the hooks return.

You can find the list of available sports here (opens in a new tab).

Usage

import { useGames, Game_OrderBy, OrderDirection } from '@azuro-org/data'
 
const { loading, error, data } = useGames(props)
 
const games = data?.games

Props

{
  filter?: {
    limit?: number // limit the number of rows returned from a query
    offset?: number // omit a specified number of rows before the beginning of the result set
    sportSlug?: string // returns games from specific sport
  }
  orderBy?: Game_OrderBy // default: Game_OrderBy.CreatedBlockTimestamp` - orders rows by passed rule
  orderDir?: OrderDirection // order direction: asc, desc
  cacheTime?: number // the frequency with which to update data, **measured in seconds**
}

⚠️

Numerous completed games exist in the Subgraph database. Displaying these already-initiated games in the pre-match list is generally unnecessary. To filter out such games, we employ the startsAt_gt parameter in the GraphQL query variables. This only retrieves games for which the startsAt time is later than now().

However, using the direct now() value for this parameter can be problematic as it can lead to frequent data re-fetches with each hook call. To mitigate this, we've introduced a caching mechanism that, by default, stores the results for 3 minutes. This caching duration can be modified by using the cacheTime parameter.

Custom query options

To accommodate additional arguments within your GraphQL query, the optimal approach is to create a custom hook. This can be achieved by leveraging the fundamental Apollo useQuery hook as your starting point.

import { useQuery } from '@apollo/client'
import type { GamesDocument, GamesQueryResult, GamesQueryVariables } from '@azuro-org/data'
 
const options = {
  // your options
}
 
const { loading, error, data } = useQuery<GamesQueryResult, GamesQueryVariables>(GamesDocument, options)

Return Value

{
  loading: boolean
  error: Error | null
  data: { 
    games: Array<{ 
      id: string
      gameId: any
      title?: string | null
      startsAt: any
      sport: { 
        slug: string
        name: string 
      }
      league: {
        slug: string
        name: string
        country: { 
          slug: string
          name: string 
        } 
      }
      participants: Array<{ 
        image?: string | null
        name: string 
      }>
    }> 
  }
}

getBetStatus useSportsNavigation