import { ReactNode } from 'react';
import { Head } from '@inertiajs/react';
import AdminLayout from '@/layouts/AdminLayout';
import { Gift } from 'lucide-react';
import ReferralModule from '@/components/delegate/ReferralModule';

// Refer & Earn, brought over from the old /company-portal. ReferralModule is
// self-contained and user-scoped (it reads /api/delegate/referrals for the
// signed-in user), so it works unchanged inside the admin layout.
const ReferralsPage = () => (
  <>
    <Head title="Refer & Earn" />
    <div>
      <div className="mb-6">
        <h1 className="text-2xl font-bold text-foreground flex items-center gap-2">
          <Gift className="h-6 w-6" /> Refer &amp; Earn
        </h1>
        <p className="text-sm text-muted-foreground mt-1">
          Share your referral link and earn account credit when someone you refer books a course.
        </p>
      </div>
      <ReferralModule />
    </div>
  </>
);

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

export default ReferralsPage;
