"use client";

import { useHospitalityCapabilities } from "@/modules/hospitality/hooks/useHospitalityCapabilities";
import { HospitalityPageLoader, HospitalityPageError } from "@/modules/hospitality/pages/shared";
import { PageHeader, Card, CardContent, Badge } from "@/components/ds";

export const CapabilitiesPage = function HospitalityCapabilitiesPage() {
  const q = useHospitalityCapabilities();
  if (q.isLoading) return <HospitalityPageLoader />;
  if (q.error) return <HospitalityPageError error={q.error} onRetry={() => q.refetch()} />;
  const features = q.data?.features ?? {};
  return (
    <div>
      <PageHeader title="قابلیت‌ها" description="Feature flags و bundles." />
      <div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
        {Object.entries(features).map(([k, v]) => (
          <Card key={k}><CardContent className="flex items-center justify-between p-3">
            <span className="text-sm font-mono">{k}</span>
            <Badge tone={v ? "success" : "default"}>{v ? "فعال" : "غیرفعال"}</Badge>
          </CardContent></Card>
        ))}
      </div>
    </div>
  );
};
export default CapabilitiesPage;