cms: headless CMS vor Hugo (Supabase + Node-API + React-Admin)

All-in-One docker-compose-Stack (Muster von RAPPORT-SERVER gespiegelt):
db/auth/rest/kong + cms-Service (Node-API + Hugo-Binary 0.161.1 + Admin-SPA).

- DB-backed: posts-Tabelle kanonisch, MD ist generiertes Artefakt
- echte Hugo-Vorschau via draft:true + --buildDrafts → /_preview
- Publish: DB → content/library/<section>/<slug>.md → hugo build → live
- Bild-Upload nach static/images/, Supabase-Auth schützt /api/*
- Proxmox-LXC-Script: legt Container an, generiert Secrets, startet Stack

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

cms/api/src/auth.js

@@ -0,0 +1,15 @@
+import { supabase } from './supabase.js';
+
+// Verifiziert den Supabase-Access-Token aus dem Authorization-Header gegen den
+// Supabase-Auth-Server. Schützt alle /api/* ausser /api/health.
+export async function requireAuth(c, next) {
+  const header = c.req.header('Authorization') || '';
+  const token = header.startsWith('Bearer ') ? header.slice(7) : null;
+  if (!token) return c.json({ error: 'Nicht eingeloggt' }, 401);
+
+  const { data, error } = await supabase.auth.getUser(token);
+  if (error || !data?.user) return c.json({ error: 'Ungültiges Token' }, 401);
+
+  c.set('user', data.user);
+  await next();
+}

cms/api/src/content.js

@@ -0,0 +1,37 @@
+import { mkdir, writeFile, rm } from 'node:fs/promises';
+import path from 'node:path';
+import { rowToMarkdown } from './render.js';
+
+const SITE_DIR = process.env.SITE_DIR || '/site';
+
+// Erlaubt nur sichere, einfache Segmente — verhindert Path-Traversal über
+// section/slug aus der DB.
+function safeSegment(value, label) {
+  if (!value || !/^[a-z0-9](?:[a-z0-9-]*[a-z0-9])?$/.test(String(value))) {
+    throw new Error(`Ungültiger ${label}: ${JSON.stringify(value)}`);
+  }
+  return value;
+}
+
+// Posts leben unter content/library/<section>/<slug>.md → URL /library/<section>/<slug>/.
+const CONTENT_BASE = 'library';
+
+export function postPath(post) {
+  const section = safeSegment(post.section, 'section');
+  const slug = safeSegment(post.slug, 'slug');
+  return path.join(SITE_DIR, 'content', CONTENT_BASE, section, `${slug}.md`);
+}
+
+// Schreibt die generierte MD nach content/<section>/<slug>.md.
+// draft:true  -> Live-Build (ohne --buildDrafts) lässt den Post aus.
+// draft:false -> Post ist live.
+export async function writePostFile(post, { draft = false } = {}) {
+  const file = postPath(post);
+  await mkdir(path.dirname(file), { recursive: true });
+  await writeFile(file, rowToMarkdown(post, { draft }), 'utf8');
+  return file;
+}
+
+export async function removePostFile(post) {
+  await rm(postPath(post), { force: true });
+}

cms/api/src/hugo.js

@@ -0,0 +1,41 @@
+import { execFile } from 'node:child_process';
+import { promisify } from 'node:util';
+
+const execFileP = promisify(execFile);
+const SITE_DIR = process.env.SITE_DIR || '/site';
+
+// Baut die Site. dest ist relativ zum Repo-Root (z.B. "public" oder "preview").
+// drafts:true => --buildDrafts (für die Vorschau).
+export async function hugoBuild({ dest, drafts = false } = {}) {
+  const args = ['--source', SITE_DIR, '--destination', dest, '--cleanDestinationDir'];
+  if (drafts) args.push('--buildDrafts');
+  const { stdout, stderr } = await execFileP('hugo', args, {
+    cwd: SITE_DIR,
+    maxBuffer: 10 * 1024 * 1024,
+  });
+  return { stdout, stderr };
+}
+
+// Optionaler Git-Backup beim Publish (GIT_PUBLISH=true). Schlägt nie hart fehl —
+// das Publish soll an einem Git-Problem nicht scheitern.
+export async function gitCommit(message) {
+  if (process.env.GIT_PUBLISH !== 'true') return { skipped: true };
+
+  const env = {
+    ...process.env,
+    GIT_AUTHOR_NAME: process.env.GIT_AUTHOR_NAME || 'OPENBUREAU CMS',
+    GIT_AUTHOR_EMAIL: process.env.GIT_AUTHOR_EMAIL || 'cms@openbureau.ch',
+    GIT_COMMITTER_NAME: process.env.GIT_AUTHOR_NAME || 'OPENBUREAU CMS',
+    GIT_COMMITTER_EMAIL: process.env.GIT_AUTHOR_EMAIL || 'cms@openbureau.ch',
+  };
+  const git = (...args) => execFileP('git', ['-C', SITE_DIR, ...args], { env });
+
+  await git('add', 'content');
+  // Nichts zu committen? Dann ruhig raus.
+  const status = await git('status', '--porcelain', 'content');
+  if (!status.stdout.trim()) return { nothing: true };
+
+  await git('commit', '-m', message);
+  await git('push', process.env.GIT_REMOTE || 'origin', process.env.GIT_BRANCH || 'main');
+  return { committed: true };
+}

cms/api/src/index.js

@@ -0,0 +1,50 @@
+import { serve } from '@hono/node-server';
+import { serveStatic } from '@hono/node-server/serve-static';
+import { Hono } from 'hono';
+
+import posts from './routes/posts.js';
+import preview from './routes/preview.js';
+import publish from './routes/publish.js';
+import upload from './routes/upload.js';
+import { requireAuth } from './auth.js';
+
+const SITE_DIR = process.env.SITE_DIR || '/site';
+const ADMIN_DIR = process.env.ADMIN_DIR || '/app/admin-dist';
+const PORT = Number(process.env.PORT || 3000);
+
+const app = new Hono();
+
+// --- API ---
+app.get('/api/health', (c) => c.json({ ok: true, hugo: '0.161.1+extended' }));
+// Alles unter /api/* (ausser /health oben) braucht ein gültiges Supabase-Token.
+app.use('/api/*', requireAuth);
+app.route('/api/posts', posts);
+app.route('/api/preview', preview);
+app.route('/api/publish', publish);
+app.route('/api/upload', upload);
+
+// --- Admin-SPA (im Container mitgebaut, unter /admin serviert) ---
+app.get('/admin', (c) => c.redirect('/admin/'));
+app.use(
+  '/admin/*',
+  serveStatic({
+    root: ADMIN_DIR,
+    rewriteRequestPath: (p) => p.replace(/^\/admin/, '') || '/',
+  }),
+);
+
+// --- Vorschau (gebaut nach preview/ mit --buildDrafts) ---
+app.use(
+  '/_preview/*',
+  serveStatic({
+    root: `${SITE_DIR}/preview`,
+    rewriteRequestPath: (p) => p.replace(/^\/_preview/, ''),
+  }),
+);
+
+// --- Live-Site (gebaut nach public/) ---
+app.use('/*', serveStatic({ root: `${SITE_DIR}/public` }));
+
+serve({ fetch: app.fetch, port: PORT }, (info) => {
+  console.log(`OPENBUREAU CMS läuft auf :${info.port} — Site + API + /_preview`);
+});

cms/api/src/render.js

@@ -0,0 +1,30 @@
+import matter from 'gray-matter';
+
+// Eine posts-Zeile aus Supabase -> Hugo-Markdown (Frontmatter + Body).
+// Mappt exakt die Felder, die OPENBUREAU im content/ nutzt. Nur gesetzte
+// Felder landen im Frontmatter, damit die MD sauber bleibt.
+export function rowToMarkdown(post, { draft = false } = {}) {
+  const fm = {
+    title: post.title,
+    // date als reines YYYY-MM-DD ausgeben (wie in den bestehenden Posts).
+    date: toDateOnly(post.date),
+  };
+
+  if (post.weight != null) fm.weight = post.weight;
+  if (Array.isArray(post.tags) && post.tags.length) fm.tags = post.tags;
+  if (post.summary) fm.summary = post.summary;
+  if (post.cover_image) fm.cover_image = post.cover_image;
+  if (post.layout) fm.layout = post.layout;
+  if (post.external) fm.external = post.external;
+  if (post.color) fm.color = post.color;
+  if (draft) fm.draft = true;
+
+  return matter.stringify(post.body || '', fm);
+}
+
+function toDateOnly(d) {
+  if (!d) return undefined;
+  // Akzeptiert Date, ISO-String oder "YYYY-MM-DD".
+  const s = typeof d === 'string' ? d : new Date(d).toISOString();
+  return s.slice(0, 10);
+}

cms/api/src/routes/posts.js

@@ -0,0 +1,50 @@
+import { Hono } from 'hono';
+import { supabase } from '../supabase.js';
+
+// Minimales CRUD, damit der Publish/Preview-Flow ohne UI testbar ist.
+// (Auth-Middleware kommt im nächsten Meilenstein.)
+const posts = new Hono();
+
+posts.get('/', async (c) => {
+  const { data, error } = await supabase
+    .from('posts')
+    .select('*')
+    .order('date', { ascending: false });
+  if (error) return c.json({ error: error.message }, 500);
+  return c.json(data);
+});
+
+posts.get('/:id', async (c) => {
+  const { data, error } = await supabase
+    .from('posts')
+    .select('*')
+    .eq('id', c.req.param('id'))
+    .single();
+  if (error) return c.json({ error: error.message }, 404);
+  return c.json(data);
+});
+
+posts.post('/', async (c) => {
+  const body = await c.req.json();
+  const { data, error } = await supabase
+    .from('posts')
+    .insert({ ...body, status: 'draft' })
+    .select()
+    .single();
+  if (error) return c.json({ error: error.message }, 400);
+  return c.json(data, 201);
+});
+
+posts.put('/:id', async (c) => {
+  const body = await c.req.json();
+  const { data, error } = await supabase
+    .from('posts')
+    .update({ ...body, updated_at: new Date().toISOString() })
+    .eq('id', c.req.param('id'))
+    .select()
+    .single();
+  if (error) return c.json({ error: error.message }, 400);
+  return c.json(data);
+});
+
+export default posts;

cms/api/src/routes/preview.js

@@ -0,0 +1,27 @@
+import { Hono } from 'hono';
+import { supabase } from '../supabase.js';
+import { writePostFile } from '../content.js';
+import { hugoBuild } from '../hugo.js';
+
+// Echte Hugo-Vorschau: Post als draft:true in content/ schreiben und mit
+// --buildDrafts nach preview/ bauen. Der Live-Build (public/) lässt den
+// Draft weiterhin aus.
+const preview = new Hono();
+
+preview.post('/:id', async (c) => {
+  const id = c.req.param('id');
+  const { data: post, error } = await supabase
+    .from('posts').select('*').eq('id', id).single();
+  if (error || !post) return c.json({ error: 'Post nicht gefunden' }, 404);
+
+  try {
+    await writePostFile(post, { draft: true });
+    const build = await hugoBuild({ dest: 'preview', drafts: true });
+    const url = `/_preview/library/${post.section}/${post.slug}/`;
+    return c.json({ ok: true, url, hugo: build.stdout });
+  } catch (e) {
+    return c.json({ error: String(e.message || e) }, 500);
+  }
+});
+
+export default preview;

cms/api/src/routes/publish.js

@@ -0,0 +1,41 @@
+import { Hono } from 'hono';
+import { supabase } from '../supabase.js';
+import { writePostFile } from '../content.js';
+import { hugoBuild, gitCommit } from '../hugo.js';
+
+// Publizieren: Post als live (draft:false) nach content/ schreiben, public/
+// neu bauen, Status setzen und optional nach Gitea committen.
+const publish = new Hono();
+
+publish.post('/:id', async (c) => {
+  const id = c.req.param('id');
+  const { data: post, error } = await supabase
+    .from('posts').select('*').eq('id', id).single();
+  if (error || !post) return c.json({ error: 'Post nicht gefunden' }, 404);
+
+  try {
+    const file = await writePostFile(post, { draft: false });
+    const build = await hugoBuild({ dest: 'public', drafts: false });
+
+    const { error: upErr } = await supabase
+      .from('posts')
+      .update({ status: 'published', published_at: new Date().toISOString() })
+      .eq('id', id);
+    if (upErr) return c.json({ error: upErr.message }, 500);
+
+    const git = await gitCommit(`cms: publish ${post.section}/${post.slug}`)
+      .catch((e) => ({ error: String(e.message || e) }));
+
+    return c.json({
+      ok: true,
+      path: file.replace(process.env.SITE_DIR || '/site', '').replace(/^\//, ''),
+      url: `/library/${post.section}/${post.slug}/`,
+      git,
+      hugo: build.stdout,
+    });
+  } catch (e) {
+    return c.json({ error: String(e.message || e) }, 500);
+  }
+});
+
+export default publish;

cms/api/src/routes/upload.js

@@ -0,0 +1,34 @@
+import { Hono } from 'hono';
+import { mkdir, writeFile } from 'node:fs/promises';
+import path from 'node:path';
+
+const SITE_DIR = process.env.SITE_DIR || '/site';
+
+// Bild-Upload → static/images/<name>. Hugo kopiert das beim Build nach
+// public/images/, cover_image referenziert es als /images/<name>.
+const upload = new Hono();
+
+upload.post('/', async (c) => {
+  const body = await c.req.parseBody();
+  const file = body['file'];
+  if (!file || typeof file === 'string') return c.json({ error: 'Keine Datei' }, 400);
+
+  const name = safeName(file.name);
+  const dir = path.join(SITE_DIR, 'static', 'images');
+  await mkdir(dir, { recursive: true });
+  await writeFile(path.join(dir, name), Buffer.from(await file.arrayBuffer()));
+
+  return c.json({ url: `/images/${name}` });
+});
+
+// Sicherer Dateiname: nur basename, kleingeschrieben, ohne Pfad/Sonderzeichen.
+function safeName(raw) {
+  const base = path.basename(String(raw || 'bild'));
+  const cleaned = base
+    .toLowerCase()
+    .replace(/[^a-z0-9._-]+/g, '-')
+    .replace(/^-+|-+$/g, '');
+  return cleaned || 'bild';
+}
+
+export default upload;

cms/api/src/supabase.js

@@ -0,0 +1,14 @@
+import { createClient } from '@supabase/supabase-js';
+
+const url = process.env.SUPABASE_URL;
+const key = process.env.SUPABASE_SERVICE_KEY;
+
+if (!url || !key) {
+  console.error('FEHLT: SUPABASE_URL und/oder SUPABASE_SERVICE_KEY in .env');
+  process.exit(1);
+}
+
+// Service-Role-Key: server-seitig, umgeht RLS. Niemals ins Frontend geben.
+export const supabase = createClient(url, key, {
+  auth: { persistSession: false, autoRefreshToken: false },
+});