import { useEffect } from 'react'
import { useClient } from 'urql'
import { useTypedQuery } from '../graphql'
import { GetExercises } from '../queries'
import { exercises } from '../subscriptions'

const useExercisesSubscription = () => {
  const query = useTypedQuery({
    query: GetExercises,
    requestPolicy: 'cache-and-network',
  })
  const client = useClient()

  useEffect(() => {
    const { unsubscribe } = client
      .subscription(exercises, {})
      .subscribe(() => {})

    return () => {
      unsubscribe()
    }
  }, [client])

  return query
}

export default useExercisesSubscription
