"use client";

import { useCommunicationHealth, useCommunicationHealthReady } from "@/modules/communication/hooks/useCommunicationCapabilities";
import { CommunicationPageLoader, CommunicationPageError } from "@/modules/communication/pages/shared";
import { PageHeader, Card, CardContent, Badge } from "@/components/ds";
import { CommunicationBreadcrumbs } from "@/modules/communication/components/CommunicationBreadcrumbs";

export function HealthPage() {
  const health = useCommunicationHealth();
  const ready = useCommunicationHealthReady();
  if (health.isLoading) return <CommunicationPageLoader />;
  if (health.error) return <CommunicationPageError error={health.error} onRetry={() => health.refetch()} />;

  return (
    <div className="space-y-6">
      <CommunicationBreadcrumbs current="سلامت سرویس" />
      <PageHeader title="سلامت سرویس" description="communication-service :8005" />
      <Card>
        <CardContent className="space-y-3 p-4">
          <Badge tone={health.data?.status === "ok" ? "success" : "danger"}>{health.data?.status}</Badge>
          <p className="text-sm">{health.data?.service} — v{health.data?.version}</p>
          {ready.data ? (
            <p className="text-xs text-[var(--muted)]">DB: {ready.data.database} — {ready.data.status}</p>
          ) : null}
        </CardContent>
      </Card>
    </div>
  );
}

export default HealthPage;
