Support Gitea configuration and safe Catalog Studio furniture completion

src/app/admin/studio/sync/catalog-export-client.tsx

@@ -3,7 +3,11 @@
 import { useCallback, useEffect, useState } from "react";
 import { adminFetch } from "@/lib/admin-fetch";
 
+import { CatalogGitConfiguration } from "./catalog-git-configuration";
+
 type ExportStatus = {
+	remote?: string;
+	branch?: string;
 	enabled: boolean;
 	pending: number;
 	active: number;
@@ -13,7 +17,11 @@ type ExportStatus = {
 	error?: string;
 };
 
-export function CatalogExportClient() {
+export function CatalogExportClient({
+	canConfigure = false,
+}: {
+	canConfigure?: boolean;
+}) {
 	const [status, setStatus] = useState<ExportStatus | null>(null);
 	const [error, setError] = useState("");
 	const [busy, setBusy] = useState(false);
@@ -55,26 +63,34 @@ export function CatalogExportClient() {
 			<h2 className="text-lg font-semibold">Catalog repository export</h2>
 			<p className="text-sm text-muted-foreground">
 				Automatically publishes bundles, icons, gamedata, translations and
-				catalog SQL to Epicnabbo-Catalogus-Updated-Daily (Beta-3).
+				catalog SQL to your configured Gitea repository.
 			</p>
+			{canConfigure && (
+				<CatalogGitConfiguration onSaved={() => void refresh()} />
+			)}
+			{status?.remote && (
+				<p className="text-xs break-all">
+					{status.remote} · {status.branch}
+				</p>
+			)}
 			<div role="status" className="text-sm" aria-live="polite">
 				{!status
 					? "Loading…"
 					: !status.enabled
-						? "Not configured on this server."
+						? "Export disabled. Configure the Gitea connection below."
 						: status.active
 							? `Waiting for ${status.active} operation(s) to finish.`
 							: status.running
 								? "Export in progress…"
 								: status.pending
-									? `${status.pending} update(s) queued for the worker.`
+									? `${status.pending} update(s) queued for export.`
 									: "No pending updates."}
 				{status?.commit && (
 					<p>
 						Last published commit:{" "}
 						<a
 							className="underline"
-							href={`https://gitlab.epicnabbo.nl/remco/Epicnabbo-Catalogus-Updated-Daily/commit/${status.commit}`}
+							href={`${status.remote?.replace(/\.git$/, "")}/commit/${status.commit}`}
 							target="_blank"
 							rel="noreferrer"
 						>

src/app/admin/studio/sync/catalog-git-configuration.tsx

@@ -0,0 +1,169 @@
+"use client";
+import { useEffect, useState } from "react";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { adminFetch } from "@/lib/admin-fetch";
+
+interface Configuration {
+	provider: string;
+	enabled: boolean;
+	remote: string;
+	branch: string;
+	username: string;
+	hasToken: boolean;
+}
+export function CatalogGitConfiguration({ onSaved }: { onSaved: () => void }) {
+	const [config, setConfig] = useState<Configuration | null>(null),
+		[token, setToken] = useState(""),
+		[busy, setBusy] = useState(false),
+		[error, setError] = useState(""),
+		[message, setMessage] = useState("");
+	useEffect(() => {
+		const abort = new AbortController();
+		void (async () => {
+			try {
+				const res = await adminFetch("/api/admin/catalog-export/config", {
+					signal: abort.signal,
+					cache: "no-store",
+				});
+				if (!res.ok)
+					throw new Error(
+						"Unable to read Git settings. Settings edit permission is required.",
+					);
+				const data = await res.json();
+				if (!abort.signal.aborted) setConfig(data);
+			} catch (error) {
+				if (!abort.signal.aborted) setError((error as Error).message);
+			}
+		})();
+		return () => abort.abort();
+	}, []);
+	async function submit(action: "save" | "test") {
+		if (!config || busy) return;
+		setBusy(true);
+		setError("");
+		setMessage("");
+		try {
+			const res = await adminFetch("/api/admin/catalog-export/config", {
+				method: "POST",
+				headers: { "Content-Type": "application/json" },
+				body: JSON.stringify({ ...config, token, action }),
+			});
+			const data = await res.json();
+			if (!res.ok)
+				throw new Error(data.error || "Git configuration request failed");
+			if (action === "save") {
+				setConfig(data);
+				setToken("");
+				setMessage("Gitea configuration saved.");
+				onSaved();
+			} else setMessage(data.message);
+		} catch (error) {
+			setError((error as Error).message);
+		} finally {
+			setBusy(false);
+		}
+	}
+	return (
+		<details
+			className="rounded-lg border border-[var(--admin-border)] p-3"
+			open
+		>
+			<summary className="cursor-pointer font-semibold">
+				Gitea connection settings
+			</summary>
+			<p className="my-3 text-sm text-[var(--admin-text-muted)]">
+				Connect your self-hosted Gitea repository over HTTPS. The CMS manages
+				its own checkout; no Git-specific .env settings are needed.
+			</p>
+			{config && (
+				<fieldset disabled={busy} className="space-y-3">
+					<p className="text-sm">
+						Provider: <strong>Gitea self-hosted</strong>
+					</p>
+					<label htmlFor="catalog-git-1" className="block text-sm">
+						Repository URL
+						<Input
+							id="catalog-git-1"
+							type="url"
+							value={config.remote}
+							onChange={(event) =>
+								setConfig({ ...config, remote: event.target.value })
+							}
+						/>
+					</label>
+					<div className="grid gap-3 sm:grid-cols-2">
+						<label htmlFor="catalog-git-2" className="block text-sm">
+							Branch
+							<Input
+								id="catalog-git-2"
+								value={config.branch}
+								onChange={(event) =>
+									setConfig({ ...config, branch: event.target.value })
+								}
+							/>
+						</label>
+						<label htmlFor="catalog-git-3" className="block text-sm">
+							Gitea username
+							<Input
+								id="catalog-git-3"
+								autoComplete="off"
+								value={config.username}
+								onChange={(event) =>
+									setConfig({ ...config, username: event.target.value })
+								}
+							/>
+						</label>
+					</div>
+					<label htmlFor="catalog-git-4" className="block text-sm">
+						Gitea access token
+						<Input
+							id="catalog-git-4"
+							type="password"
+							autoComplete="new-password"
+							value={token}
+							placeholder={
+								config.hasToken
+									? "Token saved — leave blank to keep it"
+									: "Enter a token with repository write access"
+							}
+							onChange={(event) => setToken(event.target.value)}
+						/>
+					</label>
+					<p className="text-xs text-[var(--admin-text-muted)]">
+						The token is stored encrypted and is never returned to the browser.
+						Changing repository or username requires entering the token again.
+					</p>
+					<label className="flex items-center gap-2 text-sm">
+						<input
+							type="checkbox"
+							checked={config.enabled}
+							onChange={(event) =>
+								setConfig({ ...config, enabled: event.target.checked })
+							}
+						/>
+						Automatically export catalog changes
+					</label>
+					<div className="flex flex-wrap gap-2">
+						<Button variant="outline" onClick={() => void submit("test")}>
+							Test connection
+						</Button>
+						<Button onClick={() => void submit("save")}>
+							{busy ? "Working…" : "Save Gitea settings"}
+						</Button>
+					</div>
+				</fieldset>
+			)}
+			{error && (
+				<p role="alert" className="mt-3 text-sm text-[var(--admin-warning)]">
+					{error}
+				</p>
+			)}
+			{message && (
+				<p role="status" className="mt-3 text-sm">
+					{message}
+				</p>
+			)}
+		</details>
+	);
+}

src/app/admin/studio/sync/page.tsx

@@ -14,7 +14,13 @@ export default async function StudioSyncPage(_props: {
 	}
 	return (
 		<div className="space-y-8">
-			<CatalogExportClient />
+			<CatalogExportClient
+				canConfigure={canAccess(
+					permissions,
+					PERMS.SETTINGS_EDIT,
+					session.user.rank,
+				)}
+			/>
 			<h1 className="text-2xl font-bold tracking-tight">Sync All Sources</h1>
 			<p className="text-muted-foreground mt-2">
 				Scan configured sources and automatically import any furniture that is