import { PageHeader } from "@/components/layout/PageHeader";
import { Badge } from "@/components/ui/badge";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";

export default function AddinStatusPage() {
  return (
    <>
      <PageHeader
        title="Add-in status"
        description="Monitoring-style overview. Live host verification is not part of this foundation."
        actions={<Badge variant="outline">Not verified</Badge>}
      />
      <div className="grid max-w-3xl gap-4">
        <Card>
          <CardHeader>
            <CardTitle>Deployment</CardTitle>
            <CardDescription>Independent Vite Add-in (`apps/addin`)</CardDescription>
          </CardHeader>
          <CardContent className="space-y-2 text-sm">
            <p>
              <span className="text-muted-foreground">Intended URL:</span>{" "}
              https://app.cleraladdins.com/addin/
            </p>
            <p>
              <span className="text-muted-foreground">Local URL:</span> http://localhost:5173/addin/
            </p>
            <p>
              <span className="text-muted-foreground">Version:</span> Not reported by API yet
            </p>
            <p>
              <span className="text-muted-foreground">Production hosting:</span> Not verified
            </p>
          </CardContent>
        </Card>
        <Alert>
          <AlertTitle>No live monitoring backend</AlertTitle>
          <AlertDescription>
            This page does not invent telemetry. When add-in health endpoints exist, they can be wired here.
          </AlertDescription>
        </Alert>
      </div>
    </>
  );
}
