dumb relay data fetching hook

hook.ts

import { fetchQuery, useRelayEnvironment } from 'react-relay'
import { useEffect, useState } from 'react'

interface ArgsInterface {
  numResults: number
  pollingInterval: number
}

export function useSomeRelayQuery({ numResults, pollingInterval }: ArgsInterface): {
  data: SomeTypeQuery$data | null
  loading: boolean
  error: Error | null
} {
  const [data, setData] = useState<SomeTypeQuery$data | null>(null)
  const [loading, setLoading] = useState(false)
  const [error, setError] = useState<Error | null>(null)

  const [reload, setReload] = useState(false)
  useEffect(() => {
    const interval = setInterval(() => setReload(true), pollingInterval)
    return () => clearInterval(interval)
  })

  const environment = useRelayEnvironment()
  useEffect(() => {
    if (!reload) {
      return
    }
    const subscription = fetchQuery<SomeTypeQuery>(environment, query, { numResults }).subscribe({
      start() {
        setReload(false)
        setError(null)
        setLoading(true)
      },
      next(newData) {
        setData(newData)
      },
      error(e: Error) {
        setError(e)
      },
      complete() {
        setLoading(false)
      },
    })
    return () => subscription.unsubscribe()
  }, [environment, numResults, reload])

  return { data, error, loading }
}