import PageContainer from '@/components/layout/page-container';
import { buttonVariants } from '@/components/ui/button';
import TrainingRecordListingPage from '@/features/training-records/components/training-record-listing';
import { hasAllPermissions } from '@/lib/auth/authorization';
import { isHRD } from '@/lib/auth/roles';
import { requireEmployeeDashboardAccess } from '@/lib/auth/page-guards';
import { searchParamsCache } from '@/lib/searchparams';
import { cn } from '@/lib/utils';
import { Icons } from '@/components/icons';
import Link from 'next/link';
import { SearchParams } from 'nuqs/server';

export const metadata = {
  title: 'แดชบอร์ด: ประวัติการอบรม'
};

type PageProps = {
  searchParams: Promise<SearchParams>;
};

export default async function Page(props: PageProps) {
  const searchParams = await props.searchParams;
  searchParamsCache.parse(searchParams);
  const access = await requireEmployeeDashboardAccess();
  const canReview = isHRD({
    businessRole: access.session.user.businessRole,
    systemRole: access.session.user.systemRole,
    membershipRole: access.membership.role,
    role: access.session.user.role
  });
  const canImportTrainingRecords = hasAllPermissions(access.session.user.effectivePermissions, [
    'training_record:write_all',
    'training_record:approve'
  ]);

  return (
    <PageContainer
      pageTitle='ประวัติการอบรม'
      pageDescription='ดูประวัติการอบรม ชั่วโมงที่ส่ง ใบรับรอง และสถานะการตรวจสอบ'
      pageHeaderAction={
        <div className='flex flex-wrap gap-2'>
          {canImportTrainingRecords ? (
            <>
              <Link
                href='/api/training-records/import/template'
                className={cn(buttonVariants({ variant: 'outline' }), 'text-xs md:text-sm')}
              >
                <Icons.fileTypeXls className='mr-2 h-4 w-4' /> ดาวน์โหลด Template Excel
              </Link>
              <Link
                href='/dashboard/training-records/import'
                className={cn(buttonVariants({ variant: 'outline' }), 'text-xs md:text-sm')}
              >
                <Icons.upload className='mr-2 h-4 w-4' /> นำเข้าประวัติการอบรม
              </Link>
            </>
          ) : null}
          {canReview ? (
            <Link
              href='/dashboard/training-records?approval_status=pending'
              className={cn(buttonVariants({ variant: 'outline' }), 'text-xs md:text-sm')}
            >
              <Icons.clock className='mr-2 h-4 w-4' /> คิวรอตรวจสอบ
            </Link>
          ) : null}
          <Link
            href='/dashboard/training-records/new'
            className={cn(buttonVariants(), 'text-xs md:text-sm')}
          >
            <Icons.add className='mr-2 h-4 w-4' /> ส่งประวัติการอบรม
          </Link>
        </div>
      }
    >
      <TrainingRecordListingPage />
    </PageContainer>
  );
}
