import { Loader } from "lucide-react"
import { useFetchData } from '@/reducer/linkFetchReducer';

function ProgressStatus() {
  const  wr_id  = 18; 
  const { loading, htmlContent, sideContent, error } = useFetchData(wr_id);

  return (
    <>
      {loading ? (
        <div className="flex items-center justify-center h-full mx-[15px] mb-[30px] px-[17px] py-[12px] bg-[#3333336b] rounded-[3px]">
          <Loader className='loading'/>
        </div>
      ) : error ? (
        <div>Error: {error}</div>
      ) : (
        <div className="max-[1280px]:block flex mx-[15px] mb-[30px] px-[17px] py-[12px] box-content bg-[#3333336b] rounded-[3px] text-[13px] leading-[1.428571429] text-[#f8f8f8] ">
          {htmlContent}
          {sideContent}
        </div>
      )}
    </>
  )
}

export default ProgressStatus