import { listTenants } from "@/lib/db/queries/tenants";
import { topTenantsByInterventions } from "@/lib/db/queries/charts";
import { logActivity } from "@/lib/db/audit";
import { getSession } from "@/lib/auth/session";
import { TenantsTable } from "./_components/tenants-table";
import { Card, CardBody, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
import { BarChart } from "@/components/ui/charts/bar-chart";

const numFmt = new Intl.NumberFormat("fr-FR");

export const dynamic = "force-dynamic";

export default async function TenantsPage() {
  const session = await getSession();
  let rows: Awaited<ReturnType<typeof listTenants>> = [];
  let topByInterv: Awaited<ReturnType<typeof topTenantsByInterventions>> = [];
  let loadError: string | null = null;

  try {
    [rows, topByInterv] = await Promise.all([
      listTenants(),
      topTenantsByInterventions(10),
    ]);
    void logActivity({
      type: "superadmin.tenants_list",
      title: "Lecture du listing tenants",
      description: `${rows.length} tenants lus`,
      user_id: session?.user.id,
    });
  } catch (err) {
    loadError = err instanceof Error ? err.message : "Erreur inconnue";
  }

  return (
    <div className="px-6 py-6 lg:px-10">
      <header className="mb-6 flex flex-wrap items-baseline justify-between gap-3">
        <div>
          <h1 className="text-2xl font-semibold">Tenants</h1>
          <p className="text-sm text-muted-foreground">
            Cliquez sur une ligne pour ouvrir le détail abonnement et paiement.
          </p>
        </div>
        {!loadError && (
          <span className="text-xs text-muted-foreground tabular-nums">
            {rows.length} tenant{rows.length > 1 ? "s" : ""}
          </span>
        )}
      </header>

      {loadError && (
        <div className="rounded-md border border-red-200 bg-danger-subtle px-4 py-3 text-sm text-danger">
          Impossible de charger les tenants : {loadError}
        </div>
      )}

      {!loadError && rows.length === 0 && (
        <div className="rounded-md border border-border bg-surface px-4 py-8 text-center text-sm text-muted-foreground">
          Aucun tenant en base. C&apos;est très calme.
        </div>
      )}

      {!loadError && rows.length > 0 && (
        <>
          {topByInterv.length > 0 && (
            <Card className="mb-6">
              <CardHeader>
                <CardTitle>Top 10 tenants — interventions 30 j</CardTitle>
                <CardDescription>
                  Volume métier sur le dernier mois. Tenants inactifs masqués.
                </CardDescription>
              </CardHeader>
              <CardBody>
                <BarChart
                  orientation="horizontal"
                  data={topByInterv.map((t) => ({
                    label: t.tenant_name,
                    values: [t.intervention_count],
                  }))}
                  series={[{ name: "Interventions", color: "var(--accent)" }]}
                  showValues
                  legend={false}
                  formatValue={(v) => numFmt.format(v)}
                />
              </CardBody>
            </Card>
          )}
          <TenantsTable rows={rows} />
        </>
      )}
    </div>
  );
}