import { redirect } from 'next/navigation';
import { Anchor, FileText, Receipt, Sailboat, Building2, CalendarCheck } from 'lucide-react';
import type { Metadata } from 'next';

import { getPortalSession } from '@/lib/portal/auth';
import { getPortalDashboard } from '@/lib/services/portal.service';
import { PortalCard } from '@/components/portal/portal-card';

export const metadata: Metadata = { title: 'Dashboard' };

export default async function PortalDashboardPage() {
  const session = await getPortalSession();
  if (!session) redirect('/portal/login');

  const dashboard = await getPortalDashboard(session.clientId, session.portId);
  if (!dashboard) redirect('/portal/login');

  return (
    <div className="space-y-6">
      <div>
        <h1 className="text-2xl font-semibold text-gray-900">
          Welcome back, {dashboard.client.fullName.split(' ')[0]}
        </h1>
        {dashboard.client.nationality && (
          <p className="text-sm text-gray-400 mt-0.5">{dashboard.client.nationality}</p>
        )}
      </div>

      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
        <PortalCard
          title="Berth Interests"
          value={dashboard.counts.interests}
          description="Your berth enquiries and applications"
          icon={Anchor}
          href="/portal/interests"
        />
        <PortalCard
          title="Documents"
          value={dashboard.counts.documents}
          description="Contracts, EOIs and signed agreements"
          icon={FileText}
          href="/portal/documents"
        />
        <PortalCard
          title="Invoices"
          value={dashboard.counts.invoices}
          description="Billing statements and payment history"
          icon={Receipt}
          href="/portal/invoices"
        />
        <PortalCard
          title="My Yachts"
          value={dashboard.counts.yachts}
          description="Vessels you own directly or through a company"
          icon={Sailboat}
          href="/portal/my-yachts"
        />
        <PortalCard
          title="My Memberships"
          value={dashboard.counts.memberships}
          description="Companies where you hold an active role"
          icon={Building2}
        />
        <PortalCard
          title="My Active Reservations"
          value={dashboard.counts.activeReservations}
          description="Current and pending berth reservations"
          icon={CalendarCheck}
          href="/portal/my-reservations"
        />
      </div>

      <div className="bg-white rounded-lg border p-6">
        <h2 className="text-sm font-medium text-gray-700 mb-1">Need assistance?</h2>
        <p className="text-sm text-gray-500">
          Contact the {dashboard.port.name} team directly. This portal provides a read-only view of
          your account. All changes must be made through your port contact.
        </p>
      </div>
    </div>
  );
}
