import Link from 'next/link';
import { Activity } from 'lucide-react';

import { RegistryDrivenForm } from '@/components/admin/shared/registry-driven-form';
import { PageHeader } from '@/components/shared/page-header';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';

export default function PulseAdminPage() {
  return (
    <div className="space-y-6">
      <PageHeader
        title="Deal Pulse"
        description="Tune the chip that scores every interest's health. Toggle the chip off entirely, disable individual signals you don't want surfaced, or rename the tier labels per your sales vocabulary."
      />

      <Card>
        <CardHeader>
          <CardTitle className="flex items-center gap-2 text-base">
            <Activity className="h-4 w-4" aria-hidden="true" />
            How the pulse chip works
          </CardTitle>
        </CardHeader>
        <CardContent className="space-y-3 text-sm">
          <p className="text-muted-foreground">
            Every interest row carries a small coloured chip in the detail header. It scores the
            deal from 0–100 using rule-based signals (no AI). Click the chip on any interest to see
            the per-signal breakdown - every +N or -N traces back to a dated event on the deal.
          </p>
          <p className="text-muted-foreground">
            Positive signals (recent EOI sent, deposit received, contract signed) push the score up.
            Risk signals (declined documents, cancelled reservations, berth resold elsewhere) push
            it down. Stale-contact and stage-stuck signals weigh both directions automatically.
          </p>
          <p className="text-muted-foreground">
            See the full guide at{' '}
            <Link href="/docs/deal-pulse" className="underline">
              /docs/deal-pulse
            </Link>
            .
          </p>
        </CardContent>
      </Card>

      <RegistryDrivenForm
        title="Pulse chip behaviour"
        description="Master toggle, per-signal toggles, and per-port label overrides. Defaults: chip visible, all signals on, built-in tier names ('Hot' / 'Warm' / 'Cold')."
        sections={['pulse']}
      />
    </div>
  );
}