import { createClient } from "@/lib/supabase/server";
import { canDo } from "@/lib/auth/permissions";
import { PageHeader } from "@/components/layout/page-header";
import { Card } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table";
import { AddBranchDialog } from "./add-branch-dialog";
import type { Branch } from "@/lib/types";

export default async function BranchesPage() {
  const supabase = await createClient();
  const { data } = await supabase
    .from("branches")
    .select("*")
    .order("is_head_office", { ascending: false })
    .order("name");
  const branches = (data as Branch[]) ?? [];
  const canManage = await canDo("branches", "update");

  return (
    <div>
      <PageHeader
        title="Branches"
        breadcrumb="Master / Branches"
        action={canManage ? <AddBranchDialog /> : undefined}
      />
      <Card className="p-0">
        <Table>
          <TableHeader>
            <TableRow>
              <TableHead>Name</TableHead>
              <TableHead>Code</TableHead>
              <TableHead>City</TableHead>
              <TableHead>State</TableHead>
              <TableHead>Phone</TableHead>
              <TableHead>Status</TableHead>
            </TableRow>
          </TableHeader>
          <TableBody>
            {branches.length === 0 ? (
              <TableRow>
                <TableCell colSpan={6} className="py-10 text-center text-muted-foreground">
                  No branches yet. Add your Head Office to get started.
                </TableCell>
              </TableRow>
            ) : (
              branches.map((b) => (
                <TableRow key={b.id}>
                  <TableCell className="font-medium">
                    {b.name}
                    {b.is_head_office && (
                      <Badge variant="secondary" className="ml-2">HO</Badge>
                    )}
                  </TableCell>
                  <TableCell>{b.code ?? "—"}</TableCell>
                  <TableCell>{b.city ?? "—"}</TableCell>
                  <TableCell>{b.state ?? "—"}</TableCell>
                  <TableCell>{b.phone ?? "—"}</TableCell>
                  <TableCell>
                    <Badge variant={b.is_active ? "default" : "secondary"}>
                      {b.is_active ? "Active" : "Inactive"}
                    </Badge>
                  </TableCell>
                </TableRow>
              ))
            )}
          </TableBody>
        </Table>
      </Card>
    </div>
  );
}