"use client";

import { useExperienceHealth } from "@/modules/experience/hooks/useExperienceCapabilities";
import { ExperiencePageLoader, ExperiencePageError } from "@/modules/experience/pages/shared";
import { PageHeader, Card, CardContent, Badge } from "@/components/ds";
import { ExperienceBreadcrumbs } from "@/modules/experience/components/ExperienceBreadcrumbs";

export const HealthPage = function ExperienceHealthPage() {
  const q = useExperienceHealth();
  if (q.isLoading) return <ExperiencePageLoader />;
  if (q.error) return <ExperiencePageError error={q.error} onRetry={() => q.refetch()} />;
  return (
    <div>
      <ExperienceBreadcrumbs current="سلامت سرویس" />
      <PageHeader title="سلامت سرویس" description="وضعیت experience-service." />
      <Card><CardContent className="space-y-2 p-4">
        <Badge tone={q.data?.status === "ok" ? "success" : "danger"}>{q.data?.status}</Badge>
        <p className="text-sm">{q.data?.service} — v{q.data?.version}</p>
      </CardContent></Card>
    </div>
  );
};
export default HealthPage;
