feat(settings): per-integration Test button with live API checks

Each integration card now has a Test button that re-runs its
connectivity check on demand and updates the badge in place.

- Refactors checkIntegrationStatus into checkIntegration(name) so a
  single integration can be tested without firing the others.
- Adds POST /api/settings/test for the on-demand check.
- Replaces the "key exists ⇒ connected" placeholder for Tavily,
  Gemini, and Nextdoor with real API calls (Tavily search, Gemini
  models list, Nextdoor advertiser fetch). 401/403 surface as
  "Invalid API key" / "Token expired or invalid" so a stale
  credential is obvious instead of pretending to be healthy.
- Fixes Postiz auth header (was Bearer, the rest of the codebase
  passes the API key bare — matches lib/postiz.ts now).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

app/(dashboard)/settings/page.tsx

@@ -12,7 +12,7 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card";
-import { CheckCircle2, XCircle, Loader2, ExternalLink } from "lucide-react";
+import { CheckCircle2, XCircle, Loader2, ExternalLink, FlaskConical } from "lucide-react";
 
 interface SettingsGroup {
   name: string;
@@ -110,6 +110,7 @@ export default function SettingsPage() {
   const [saving, setSaving] = useState<string | null>(null);
   const [saved, setSaved] = useState<string | null>(null);
   const [loading, setLoading] = useState(true);
+  const [testing, setTesting] = useState<string | null>(null);
 
   useEffect(() => {
     fetch("/api/settings?status=true")
@@ -159,6 +160,27 @@ export default function SettingsPage() {
     return status[key] || { connected: false, error: "Unknown" };
   }
 
+  async function handleTest(group: SettingsGroup) {
+    const integration = group.name.toLowerCase();
+    setTesting(integration);
+    try {
+      const res = await fetch("/api/settings/test", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ integration }),
+      });
+      const result = await res.json();
+      setStatus((prev) => ({ ...prev, [integration]: result }));
+    } catch {
+      setStatus((prev) => ({
+        ...prev,
+        [integration]: { connected: false, error: "Test request failed" },
+      }));
+    } finally {
+      setTesting(null);
+    }
+  }
+
   if (loading) {
     return (
       <div className="flex items-center justify-center py-20">
@@ -179,6 +201,8 @@ export default function SettingsPage() {
 
       {SETTINGS_GROUPS.map((group) => {
         const groupStatus = getGroupStatus(group);
+        const integrationKey = group.name.toLowerCase();
+        const isTesting = testing === integrationKey;
 
         return (
           <Card key={group.name}>
@@ -186,7 +210,15 @@ export default function SettingsPage() {
               <div className="flex items-center justify-between">
                 <div className="flex items-center gap-3">
                   <CardTitle>{group.name}</CardTitle>
-                  {groupStatus.connected ? (
+                  {isTesting ? (
+                    <Badge
+                      variant="outline"
+                      className="text-blue-600 border-blue-200 bg-blue-50"
+                    >
+                      <Loader2 className="h-3 w-3 mr-1 animate-spin" />
+                      Testing…
+                    </Badge>
+                  ) : groupStatus.connected ? (
                     <Badge
                       variant="outline"
                       className="text-green-600 border-green-200 bg-green-50"
@@ -204,15 +236,30 @@ export default function SettingsPage() {
                     </Badge>
                   )}
                 </div>
-                <a
-                  href={group.docsUrl}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="text-sm text-muted-foreground hover:text-foreground flex items-center gap-1"
-                >
-                  Docs
-                  <ExternalLink className="h-3 w-3" />
-                </a>
+                <div className="flex items-center gap-3">
+                  <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={() => handleTest(group)}
+                    disabled={isTesting}
+                  >
+                    {isTesting ? (
+                      <Loader2 className="h-3.5 w-3.5 animate-spin" />
+                    ) : (
+                      <FlaskConical className="h-3.5 w-3.5 mr-1" />
+                    )}
+                    {isTesting ? "" : "Test"}
+                  </Button>
+                  <a
+                    href={group.docsUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="text-sm text-muted-foreground hover:text-foreground flex items-center gap-1"
+                  >
+                    Docs
+                    <ExternalLink className="h-3 w-3" />
+                  </a>
+                </div>
               </div>
               <CardDescription>{group.description}</CardDescription>
             </CardHeader>

app/api/settings/test/route.ts

@@ -0,0 +1,19 @@
+import { auth } from "@/lib/auth";
+import { checkIntegration, type IntegrationName } from "@/lib/settings";
+
+const VALID: IntegrationName[] = ["claude", "postiz", "tavily", "gemini", "nextdoor"];
+
+export async function POST(request: Request) {
+  const session = await auth();
+  if (!session) return new Response("Unauthorized", { status: 401 });
+
+  const body = await request.json().catch(() => ({}));
+  const name = body?.integration as IntegrationName | undefined;
+
+  if (!name || !VALID.includes(name)) {
+    return Response.json({ error: "integration must be one of: " + VALID.join(", ") }, { status: 400 });
+  }
+
+  const status = await checkIntegration(name);
+  return Response.json(status);
+}