import pageContentApi from '../api/pageContentApi'
import { useQuery } from 'react-query'
import Spinner from '@/core/components/elements/Spinner/Spinner'

const PageContent = ({ path }) => {
  const fetchContent = async () => await pageContentApi({ path })
  const content = useQuery(`content-${path}`, fetchContent)

  if (content.data) {
    return (
      <div
        className='p-4 prose prose-gray prose-a:text-red_r-10 prose-p:my-0'
        dangerouslySetInnerHTML={{ __html: content.data.content }}
      />
    )
  }

  if (content.isLoading) {
    return (
      <div className='flex justify-center my-6'>
        <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
      </div>
    )
  }

  return <></>
}

export default PageContent