import { ReactNode } from 'react';
import { Head } from '@inertiajs/react';
import AdminLayout from '@/layouts/AdminLayout';
import { useAuth } from '@/hooks/useAuth';
import { CompanyBookingRequestsTab } from "@/components/admin/company-detail/CompanyBookingRequestsTab";

const CourseRequests = () => {
  const { companyId } = useAuth();

  if (!companyId) {
    return (
      <>
        <Head title="Course Requests" />
        <div>
          <h1 className="text-2xl font-bold text-foreground mb-4">Course Requests</h1>
          <p className="text-muted-foreground">No company associated with your account.</p>
        </div>
      </>
    );
  }

  return (
    <>
      <Head title="Course Requests" />
      <div>
        <h1 className="text-2xl font-bold text-foreground mb-6">Course Requests</h1>
        <CompanyBookingRequestsTab companyId={companyId} />
      </div>
    </>
  );
};

CourseRequests.layout = (page: ReactNode) => <AdminLayout>{page}</AdminLayout>;

export default CourseRequests;
