import JobDetailPage from '../../../components/clientcomponents/JobDetailPage';

async function fetchData(id) {
  // Use Promise.all to fetch data from three APIs concurrently
  const jobResponse = await fetch(`${process.env.NEXT_PUBLIC_APP_URL}/api/frontend/jobs/${id}`, {
    method:"GET"
  })

  // Convert the responses to JSON
  const jobData = await jobResponse.json();

  return jobData;
}

export async function generateMetadata({params}) {

  const { id } = await params;

  const singlejob = await fetchData(id);
  
  const pageTitle = `${singlejob?.data?.title} | Apply Now at UniversitiesPage`
  const currentUrl = `${process.env.NEXT_PUBLIC_APP_WEBSITE_NAME}/job/job-detail/${id}`;

  return {
    title: pageTitle,
    icons: {
      icon: "/assets/fav.png",
    },
    siteName: process.env.NEXT_PUBLIC_APP_WEBSITE_NAME,
    alternates: {
      canonical: currentUrl,
    },
    robots: {
      index: true,
      follow: true,
      nocache: true,
    },
  };
}

const page = async ({params}) => {

  const {id} = await params;

  const jobData = await fetchData(id)

  console.log("Jobs Data", jobData);

  return (
    <div>
      <JobDetailPage data = {jobData} />
    </div>
  )
}

export default page
