import Link from 'next/link';
import { redirect } from 'next/navigation';
import { getCurrentAccount } from '@/lib/account';
import { isVendorAccount } from '@/lib/vendor';
import { ROUTES } from '@/lib/routes';
import { VendorNav } from '@/components/vendor/vendor-nav';
import { DashboardModeBanner } from '@/components/layout/dashboard-mode-banner';

export default async function VendorLayout({ children }: { children: React.ReactNode }) {
  const account = await getCurrentAccount();

  if (!account) {
    redirect(`${ROUTES.login}?redirect=${ROUTES.vendorDashboard}`);
    return;
  }

  if (!isVendorAccount(account)) {
    return (
      <section className="bg-beige py-14">
        <div className="container-page max-w-lg text-center">
          <h1 className="font-serif text-2xl font-bold text-navy-800">Vendor Dashboard</h1>
          <p className="mt-3 text-sm text-navy-600">
            This area is only for registered vendor accounts. Your account is currently a regular shopper account.
          </p>
          <Link href={ROUTES.vendorShow} className="btn-primary mt-6 inline-block">
            Become a Vendor
          </Link>
        </div>
      </section>
    );
  }

  return (
    <section className="bg-beige py-10">
      <div className="container-page">
        <DashboardModeBanner mode="vendor" />
        <div className="grid gap-8 lg:grid-cols-4">
          <VendorNav accountType={account.account_type} />
          <div className="lg:col-span-3">{children}</div>
        </div>
      </div>
    </section>
  );
}