import { getApplication } from "@/app/utils/app";
import { cookies } from "next/headers";
import Image from "next/image";
import Document from "../../component/Document";
import CTA from "../../component/CTA";
import { FaUserGraduate, FaBusinessTime, FaBirthdayCake, FaPhone, FaIdBadge, FaBook } from 'react-icons/fa';

import avatar from '@/app/img/avatar1.webp'
import { IoMdSchool } from "react-icons/io";


const fetchApplicant = async (stream, id) => {
    const applicant = await getApplication(cookies().get('admin')?.value, stream, id);

    return applicant?.data;
}

const page = async ({ params }) => {
    const { stream, id } = params
    console.log(stream, id)

    const applicant = await fetchApplicant(stream, id);

    return (
        <div className="container mx-auto px-4 py-3">
            <h1 className="text-4xl font-bold text-center text-orange-300 mb-12">Aspirant Application Details</h1>
            <div className="bg-white shadow-xl rounded-lg p-8 text-gray-800">
                <CTA stream={stream} id={id} />
                <div className="grid grid-cols-1 lg:grid-cols-2 gap-10">
                    <div>
                                <h2 className="text-2xl font-semibold mb-6 text-orange-400">Personal Information <FaUserGraduate className="inline-block" /></h2>
                                <div className="flex items-center space-x-4 mb-5">
                                    <Image src={applicant?.passportUrl || avatar} alt="Passport Photo" width={100} height={100} className="rounded-full" />
                                    <div>
                                        <h3 className="text-3xl font-bold">{applicant.first_name} {applicant.last_name}</h3>
                                        <p className="flex items-center text-gray-600"><FaPhone className="mr-2" />{applicant.phone}</p>
                                    </div>
                                </div>
                        {stream === 'full' && <p className="flex items-center text-sm"><FaIdBadge className="mr-2" /><strong>JAMB Registration Number: </strong> {applicant.jamb_reg}</p>}
                        <p className="flex items-center"><FaBirthdayCake className="mr-2" /><strong>Date of Birth:</strong> {new Date(applicant.DOB).toDateString()}</p>
                        <p className="flex items-center font-bold text-orange-900"><IoMdSchool className="mr-2" /><strong >Programme Applying For:</strong> {applicant.programme}({applicant.stream} time) </p>
                    </div>
                        {stream !== 'full' && stream !== 'part' && (
                            <div>
                                <h2 className="text-2xl font-semibold mb-6 text-orange-400">Professional Information <FaBusinessTime className="inline-block" /></h2>
                                <p className="flex justify-between"><strong className="font-bold mr-2">Workplace:</strong> {applicant.workplace}</p>
                                <p className="flex justify-between"><strong>Experience:</strong> {applicant.years_of_exp} year(s)</p>
                                <p className="flex justify-between"><strong>Qualification:</strong> {applicant.qualification}</p>
                                <p className="flex justify-between"><strong>Status:</strong> {applicant.status}</p>

                            </div>
                        )}
                    {stream === 'full' || stream === 'part' && (
                        <div className="col-span-1 lg:col-span-2">
                            <h2 className="text-2xl font-semibold mb-6 text-orange-400">Academic Information <FaBook className="inline-block" /></h2>
                            {/* <p className="flex justify-between"><strong>O'Level Result:</strong> {applicant.olevelResult}</p> */}
                            {stream === 'full' && <p className="flex justify-between"><strong>JAMB Result:</strong> {applicant.jambResult}</p>}
                            {stream === 'full' && <p className="flex justify-between"><strong>Entrance Score:</strong> {applicant.entranceScore}</p>}
                            <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
                                <Document name="O'level" token={cookies().get('admin')?.value} file={applicant.o_level} file_path={applicant.o_level_path} />
                                {stream === 'full' && <Document name='Jamb' file={applicant.jamb_result} file_path={applicant.jamb_result_path} /> }
                                <Document name='Admission letter' file={applicant.adm_letter} file_path={applicant.adm_letter_path} />
                            </div>
                        </div>
                    )}
                </div>
            </div>
        </div>
    );
};

export default page;
