clippingkk / web / #1022

'use client'

import React, { useEffect } from 'react'

import { useAuthSuccessed } from '@/hooks/hooks'

import { useGithubLoginLazyQuery } from '@/schema/generated'

import LoadingIcon from '@/components/icons/loading.svg'

type GithubOAuthContentProps = {

  code: string

}

function GithubOAuthContent(props: GithubOAuthContentProps) {

  const { code } = props

  const [exec, resp] = useGithubLoginLazyQuery()

  useAuthSuccessed(resp.called, resp.loading, resp.error, resp.data?.githubAuth)

  useEffect(() => {

    if (!code) {

      console.log('no code')

      // TODO: redirect

      return

    }

    exec({

      variables: {

        code

      }

    })

  }, [code])

  return (

    <div className='p-10 bg-gray-300 bg-opacity-40 rounded text-4xl backdrop-blur-lg'>

      {resp.loading && (

        <LoadingIcon className='animate-spin' />

      )}

      {resp.error && (

        <div className='max-w-sm h-96 overflow-y-auto'>{resp.error.message}</div>

      )}

    </div>

  )

}

export default GithubOAuthContent