useSports

The useSports hook is used to fetch sports with pre-match and live games.

ℹ️

Hook represents a logic wrapper over TanStack Query’s useQuery hook. Explore TanStack Query docs to understand what data the hook returns.

Usage


import { useSports } from '@azuro-org/sdk'
 
const { data: sports, isFetching, error } = useSports(props)

Props


type UseSportsProps = {
  filter?: {
    sportSlug?: string
    countrySlug?: string
    leagueSlug?: string
    sportIds?: Array<string | number>
    /**
     * Limit the number of games returned from a query for each league in each sport.
     * Default: 1000,
     * minimum: 10.
     * */
    maxGamesPerLeague?: number
    /** @deprecated pass `maxGamesPerLeague` instead */
    limit?: number
  }
  gameOrderBy?: GameOrderBy // default: GameOrderBy.StartsAt - supports Turnover or StartsAt
  orderDir?: OrderDirection // order direction: asc, desc
  /** if false or undefined, follows games sorting order */
  sortLeaguesAndCountriesByName?: boolean
  isLive?: boolean // if `true`, the hook will retrieve live sports
  chainId?: ChainId
  query?: QueryParameterWithSelect<UseSportsQueryFnData, TData> // useQuery params
}


type UseSportsQueryFnData = SportData[]


type ChainId =
  | 100     // Gnosis
  | 137     // Polygon
  | 80002   // Polygon Amoy
  | 88888   // Chiliz
  | 88882   // Chiliz Spicy
  | 8453    // Base
  | 84532   // Base Sepolia
 
enum GameOrderBy {
  StartsAt = 'startsAt',
  Turnover = 'turnover'
}
 
enum OrderDirection {
  Asc = 'asc',
  Desc = 'desc'
}

Return Value


UseQueryResult<SportData[]>


import { type UseQueryResult } from '@tanstack/react-query'
 
type SportData = {
  sportId: string
  slug: string
  name: string
  turnover: string
  countries: Array<{
    slug: string
    name: string
    turnover: string
    leagues: Array<{
      slug: string
      name: string
      turnover: string
      games: Array<{
        gameId: string
        slug: string
        title: string
        startsAt: number
        state: GameState
        sportId: string
        sportSlug: string
        sportName: string
        leagueId: string
        leagueSlug: string
        leagueName: string
        countrySlug: string
        countryName: string
        participants: Array<{
          image?: string
          name: string
        }>
      }>
    }>
  }>
}

Query Options Helper

getUseSportsQueryOptions lets you build query options outside a component — useful for prefetching, SSR, or composing queries.


import { getUseSportsQueryOptions } from '@azuro-org/sdk'
 
const options = getUseSportsQueryOptions({ ...props, chainId })
await queryClient.prefetchQuery(options)


type GetUseSportsQueryOptionsProps = UseSportsProps & {
  chainId: ChainId
}