ui/ disable buttons if health checks not working

src/hooks/use-diagnostics.ts

@@ -0,0 +1,65 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+type DiagnosticsResponse = {
+  timestamp: string;
+  env: {
+    DATABASE_URL: boolean;
+    BETTER_AUTH_SECRET: boolean;
+    GOOGLE_CLIENT_ID: boolean;
+    GOOGLE_CLIENT_SECRET: boolean;
+    OPENAI_API_KEY: boolean;
+    NEXT_PUBLIC_APP_URL: boolean;
+  };
+  database: {
+    connected: boolean;
+    schemaApplied: boolean;
+    error?: string;
+  };
+  auth: {
+    configured: boolean;
+    routeResponding: boolean | null;
+  };
+  ai: {
+    configured: boolean;
+  };
+  overallStatus: "ok" | "warn" | "error";
+};
+
+export function useDiagnostics() {
+  const [data, setData] = useState<DiagnosticsResponse | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  async function fetchDiagnostics() {
+    setLoading(true);
+    setError(null);
+    try {
+      const res = await fetch("/api/diagnostics", { cache: "no-store" });
+      if (!res.ok) throw new Error(`HTTP ${res.status}`);
+      const json = (await res.json()) as DiagnosticsResponse;
+      setData(json);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to load diagnostics");
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  useEffect(() => {
+    fetchDiagnostics();
+  }, []);
+
+  const isAuthReady = data?.auth.configured && data?.database.connected && data?.database.schemaApplied;
+  const isAiReady = data?.ai.configured;
+
+  return {
+    data,
+    loading,
+    error,
+    refetch: fetchDiagnostics,
+    isAuthReady: Boolean(isAuthReady),
+    isAiReady: Boolean(isAiReady),
+  };
+}