feat: add standalone admin video call test

2026-09-16 21:41:43 +02:00
parent 906ea764ac
commit 8f5a074716
4 changed files with 134 additions and 20 deletions
@@ -0,0 +1,74 @@
+"use client";
+
+import { useState } from "react";
+
+export function AdminTestCallButton() {
+  const [loading, setLoading] = useState(false);
+  const [copied, setCopied] = useState(false);
+  const [url, setUrl] = useState<string | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  async function createTestCall() {
+    setLoading(true);
+    setCopied(false);
+    setError(null);
+    try {
+      const response = await fetch("/api/admin/meetings/test", {
+        method: "POST",
+        credentials: "include",
+      });
+      const data = (await response.json().catch(() => ({}))) as { testUrl?: string; error?: string };
+      if (!response.ok || !data.testUrl) {
+        setError(data.error || "Der Test-Call konnte nicht gestartet werden.");
+        return;
+      }
+
+      setUrl(data.testUrl);
+      try {
+        await navigator.clipboard.writeText(data.testUrl);
+        setCopied(true);
+      } catch {
+        setError("Der Link wurde erzeugt. Bitte kopiere ihn aus dem Feld.");
+      }
+    } catch {
+      setError("Verbindung fehlgeschlagen.");
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  return (
+    <div style={{ padding: "0 8px 8px" }}>
+      <button
+        type="button"
+        onClick={() => void createTestCall()}
+        disabled={loading}
+        style={{
+          width: "100%",
+          padding: "8px 12px",
+          borderRadius: 6,
+          fontSize: 13,
+          fontWeight: 600,
+          color: "#fff",
+          background: "#8b616d",
+          border: "1px solid #8b616d",
+          cursor: loading ? "wait" : "pointer",
+          opacity: loading ? 0.7 : 1,
+        }}
+      >
+        {loading ? "Test-Link wird erzeugt …" : copied ? "✓ Test-Link kopiert" : "▶ Test-Videoanruf"}
+      </button>
+      {url && (
+        <input
+          type="text"
+          readOnly
+          value={url}
+          aria-label="Test-Videoanruf-Link"
+          onFocus={(event) => event.currentTarget.select()}
+          style={{ width: "100%", marginTop: 6, padding: "5px 7px", border: "1px solid #e2e2e2", borderRadius: 5, fontSize: 11 }}
+        />
+      )}
+      {error && <p style={{ margin: "6px 0 0", color: "#a33", fontSize: 11 }}>{error}</p>}
+    </div>
+  );
+}
@@ -1,23 +1,27 @@
 import Link from "next/link";
+import { AdminTestCallButton } from "./AdminTestCallButton";

 export function CalendarNavLink() {
  return (
-    <div style={{ padding: "0 8px 8px" }}>
-      <Link
-        href="/admin/kalender"
-        style={{
-          display: "block",
-          padding: "8px 12px",
-          borderRadius: 6,
-          fontSize: 13,
-          fontWeight: 600,
-          color: "#8b616d",
-          textDecoration: "none",
-          border: "1px solid #e2e2e2",
-        }}
-      >
-        📅 Kalender
-      </Link>
-    </div>
+    <>
+      <div style={{ padding: "0 8px 8px" }}>
+        <Link
+          href="/admin/kalender"
+          style={{
+            display: "block",
+            padding: "8px 12px",
+            borderRadius: 6,
+            fontSize: 13,
+            fontWeight: 600,
+            color: "#8b616d",
+            textDecoration: "none",
+            border: "1px solid #e2e2e2",
+          }}
+        >
+          📅 Kalender
+        </Link>
+      </div>
+      <AdminTestCallButton />
+    </>
  );
 }