import type { FindSocialById, FindSocialByIdVariables } from 'types/graphql'

import type {
  CellSuccessProps,
  CellFailureProps,
  TypedDocumentNode,
} from '@redwoodjs/web'

import CellEmpty from 'src/components/Cell/CellEmpty/CellEmpty'
import CellFailure from 'src/components/Cell/CellFailure/CellFailure'
import CellLoading from 'src/components/Cell/CellLoading/CellLoading'
import Social from 'src/components/Social/Social'

export const QUERY: TypedDocumentNode<
  FindSocialById,
  FindSocialByIdVariables
> = gql`
  query FindSocialById($id: Int!) {
    social: social(id: $id) {
      id
      name
      type
      username
    }
  }
`

export const Loading = () => <CellLoading />

export const Empty = () => <CellEmpty />

export const Failure = ({
  error,
}: CellFailureProps<FindSocialByIdVariables>) => <CellFailure error={error} />

export const Success = ({
  social,
}: CellSuccessProps<FindSocialById, FindSocialByIdVariables>) => {
  return <Social social={social} />
}