nca-ai-cms-astro-plugin 1.0.5 → 1.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nca-ai-cms-astro-plugin",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "type": "module",
   "exports": {
     ".": "./src/index.ts",

package/src/api/prompts.ts

@@ -22,24 +22,50 @@ export const GET: APIRoute = async () => {
   }
 };
 
-// POST /api/prompts - Update a prompt or setting
+// POST /api/prompts - Create or update a prompt or setting
 export const POST: APIRoute = async ({ request }) => {
   try {
     const data = await request.json();
 
+    // Create a new prompt
+    if (data.action === 'create' && data.name && data.category && data.promptText) {
+      const id = `${data.category}_${Date.now()}`;
+      await service.createPrompt(id, data.name, data.category, data.promptText);
+      return jsonResponse({ success: true, type: 'prompt', id });
+    }
+
+    // Update an existing prompt
     if (data.type === 'prompt' && data.id && data.promptText !== undefined) {
       await service.updatePrompt(data.id, data.promptText);
       return jsonResponse({ success: true, type: 'prompt', id: data.id });
     }
 
+    // Update a setting
     if (data.type === 'setting' && data.key && data.value !== undefined) {
       await service.updateSetting(data.key, data.value);
       return jsonResponse({ success: true, type: 'setting', key: data.key });
     }
 
-    return jsonError('Invalid request: missing type, id/key, or value', 400);
+    return jsonError('Invalid request: missing required fields', 400);
   } catch (error) {
     console.error('Update prompt error:', error);
     return jsonError(error);
   }
 };
+
+// DELETE /api/prompts - Delete a prompt
+export const DELETE: APIRoute = async ({ request }) => {
+  try {
+    const data = await request.json();
+
+    if (!data.id) {
+      return jsonError('Missing prompt id', 400);
+    }
+
+    await service.deletePrompt(data.id);
+    return jsonResponse({ success: true, id: data.id });
+  } catch (error) {
+    console.error('Delete prompt error:', error);
+    return jsonError(error);
+  }
+};

package/src/components/editor/SettingsTab.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect, useCallback } from 'react';
-import type { Prompt, SettingsSubTab } from './types';
+import type { Prompt, Setting, SettingsSubTab } from './types';
 import { styles } from './styles';
 
 const SUB_TABS: { key: SettingsSubTab; label: string }[] = [
@@ -10,21 +10,83 @@ const SUB_TABS: { key: SettingsSubTab; label: string }[] = [
   { key: 'website', label: 'Website' },
 ];
 
+const SETTINGS_TABS: SettingsSubTab[] = ['homepage', 'website'];
+
+const SETTINGS_FIELDS: Record<string, { key: string; label: string; type: 'input' | 'textarea' }[]> = {
+  homepage: [
+    { key: 'hero_headline', label: 'Hero Ueberschrift', type: 'input' },
+    { key: 'hero_text', label: 'Hero Text', type: 'textarea' },
+    { key: 'target_audience', label: 'Zielgruppe', type: 'input' },
+    { key: 'tone', label: 'Tonalitaet', type: 'input' },
+    { key: 'core_message', label: 'Kernbotschaft', type: 'textarea' },
+  ],
+  website: [
+    { key: 'cta_url', label: 'CTA Link', type: 'input' },
+    { key: 'cta_style', label: 'CTA Stil', type: 'input' },
+    { key: 'cta_prompt', label: 'CTA Prompt', type: 'textarea' },
+    { key: 'core_tags', label: 'Core Tags (kommagetrennt)', type: 'input' },
+    { key: 'brand_guidelines', label: 'Markenrichtlinien', type: 'textarea' },
+  ],
+};
+
+const CATEGORY_GUIDES: Record<SettingsSubTab, { title: string; description: string; example: string }> = {
+  'homepage': {
+    title: 'Homepage-Einstellungen',
+    description: 'Konfiguriere hier die zentralen Inhalte deiner Startseite: Hero-Text, Zielgruppe, Tonalitaet und Kernbotschaft.',
+    example: '',
+  },
+  'content-ai': {
+    title: 'Content-KI Prompts',
+    description: 'Steuere hier, wie die KI Blogartikel und Texte generiert. Je praeziser der Prompt, desto besser das Ergebnis. Definiere Schreibstil, SEO-Keywords und inhaltliche Schwerpunkte.',
+    example: 'Beispiel: "Schreibe einen Fachartikel mit 800-1200 Woertern. Verwende die Keywords [KEYWORD] natuerlich im Text. Struktur: Einleitung mit Hook, 3-4 Abschnitte mit H2, Fazit mit CTA. Ton: fachlich aber verstaendlich."',
+  },
+  'analysis-ai': {
+    title: 'Analyse-KI Prompts',
+    description: 'Konfiguriere Prompts fuer die inhaltliche Analyse bestehender Texte. Die KI kann Texte auf SEO, Lesbarkeit, Barrierefreiheit und Content-Qualitaet pruefen.',
+    example: 'Beispiel: "Analysiere den Text auf SEO-Optimierung. Pruefe: Keyword-Dichte, Meta-Beschreibung, Ueberschriften-Hierarchie, interne Verlinkung. Gib konkrete Verbesserungsvorschlaege."',
+  },
+  'image-ai': {
+    title: 'Bild-KI Prompts',
+    description: 'Definiere Prompts fuer die KI-Bildgenerierung. Beschreibe Stil, Farbpalette und Bildkomposition fuer konsistente visuelle Inhalte.',
+    example: 'Beispiel: "Erstelle ein Blog-Header-Bild im minimalistischen Flat-Design. Farbpalette: Dunkelblau (#1a365d), Weiss, Akzent-Rot (#e63946). Kein Text im Bild. Seitenverhaeltnis 16:9."',
+  },
+  'website': {
+    title: 'Website-Einstellungen',
+    description: 'Allgemeine Einstellungen fuer deine Website: CTA-Texte, Standard-Tags und Markenrichtlinien.',
+    example: '',
+  },
+};
+
+function isSettingsTab(tab: SettingsSubTab): boolean {
+  return SETTINGS_TABS.includes(tab);
+}
+
 interface EditState {
   id: string;
   value: string;
 }
 
+interface AddFormState {
+  name: string;
+  promptText: string;
+}
+
 export function SettingsTab() {
   const [activeSubTab, setActiveSubTab] =
     useState<SettingsSubTab>('homepage');
   const [prompts, setPrompts] = useState<Prompt[]>([]);
+  const [_settings, setSettings] = useState<Setting[]>([]);
+  const [settingsForm, setSettingsForm] = useState<Record<string, string>>({});
+  const [settingsSaved, setSettingsSaved] = useState(false);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [editing, setEditing] = useState<EditState | null>(null);
   const [saving, setSaving] = useState(false);
+  const [showAddForm, setShowAddForm] = useState(false);
+  const [addForm, setAddForm] = useState<AddFormState>({ name: '', promptText: '' });
+  const [deleting, setDeleting] = useState<string | null>(null);
 
-  const loadPrompts = useCallback(async () => {
+  const loadData = useCallback(async () => {
     setLoading(true);
     setError(null);
     try {
@@ -32,6 +94,13 @@ export function SettingsTab() {
       if (!res.ok) throw new Error('Fehler beim Laden der Einstellungen');
       const data = await res.json();
       setPrompts(Array.isArray(data.prompts) ? data.prompts : []);
+      const loadedSettings: Setting[] = Array.isArray(data.settings) ? data.settings : [];
+      setSettings(loadedSettings);
+      const formValues: Record<string, string> = {};
+      for (const s of loadedSettings) {
+        formValues[s.key] = s.value;
+      }
+      setSettingsForm(formValues);
     } catch (err) {
       setError(
         err instanceof Error ? err.message : 'Ein Fehler ist aufgetreten',
@@ -42,8 +111,8 @@ export function SettingsTab() {
   }, []);
 
   useEffect(() => {
-    loadPrompts();
-  }, [loadPrompts]);
+    loadData();
+  }, [loadData]);
 
   const filteredPrompts = prompts.filter(
     (p) => p.category === activeSubTab,
@@ -86,6 +155,83 @@ export function SettingsTab() {
     }
   };
 
+  const handleSettingsSave = async () => {
+    setSaving(true);
+    setError(null);
+    setSettingsSaved(false);
+    try {
+      const fields = SETTINGS_FIELDS[activeSubTab] ?? [];
+      for (const field of fields) {
+        const value = settingsForm[field.key] ?? '';
+        const res = await fetch('/api/prompts', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ type: 'setting', key: field.key, value }),
+        });
+        if (!res.ok) throw new Error(`Fehler beim Speichern von "${field.label}"`);
+      }
+      setSettingsSaved(true);
+      setTimeout(() => setSettingsSaved(false), 3000);
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : 'Fehler beim Speichern',
+      );
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  const handleAdd = async () => {
+    if (!addForm.name.trim() || !addForm.promptText.trim()) return;
+    setSaving(true);
+    setError(null);
+    try {
+      const res = await fetch('/api/prompts', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          action: 'create',
+          name: addForm.name,
+          category: activeSubTab,
+          promptText: addForm.promptText,
+        }),
+      });
+      if (!res.ok) throw new Error('Fehler beim Erstellen');
+      setAddForm({ name: '', promptText: '' });
+      setShowAddForm(false);
+      await loadData();
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : 'Fehler beim Erstellen',
+      );
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  const handleDelete = async (id: string) => {
+    setDeleting(id);
+    setError(null);
+    try {
+      const res = await fetch('/api/prompts', {
+        method: 'DELETE',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ id }),
+      });
+      if (!res.ok) throw new Error('Fehler beim Loeschen');
+      setPrompts((prev) => prev.filter((p) => p.id !== id));
+      if (editing?.id === id) setEditing(null);
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : 'Fehler beim Loeschen',
+      );
+    } finally {
+      setDeleting(null);
+    }
+  };
+
+  const guide = CATEGORY_GUIDES[activeSubTab];
+
   return (
     <div style={styles.settingsContent}>
       <div style={styles.subTabNav} role="tablist">
@@ -103,6 +249,8 @@ export function SettingsTab() {
             onClick={() => {
               setActiveSubTab(tab.key);
               setEditing(null);
+              setShowAddForm(false);
+              setSettingsSaved(false);
             }}
           >
             {tab.label}
@@ -116,69 +264,189 @@ export function SettingsTab() {
 
       {error && <div style={styles.error}>{error}</div>}
 
-      {!loading && filteredPrompts.length === 0 && (
-        <div style={styles.emptyState}>
-          Keine Einstellungen in dieser Kategorie.
+      {/* Settings tabs: Homepage, Website — key-value form */}
+      {!loading && isSettingsTab(activeSubTab) && (
+        <div style={styles.addForm}>
+          <div style={styles.addFormTitle}>{guide.title}</div>
+          <div style={{ ...styles.emptyGuideText, marginBottom: '1rem' }}>{guide.description}</div>
+          {(SETTINGS_FIELDS[activeSubTab] ?? []).map((field) => (
+            <div key={field.key} style={styles.addFormField}>
+              <label style={styles.addFormLabel}>{field.label}</label>
+              {field.type === 'textarea' ? (
+                <textarea
+                  style={styles.textarea}
+                  value={settingsForm[field.key] ?? ''}
+                  onChange={(e) =>
+                    setSettingsForm({ ...settingsForm, [field.key]: e.target.value })
+                  }
+                />
+              ) : (
+                <input
+                  style={styles.addFormInput}
+                  type="text"
+                  value={settingsForm[field.key] ?? ''}
+                  onChange={(e) =>
+                    setSettingsForm({ ...settingsForm, [field.key]: e.target.value })
+                  }
+                />
+              )}
+            </div>
+          ))}
+          <div style={styles.editButtons}>
+            <button
+              type="button"
+              style={styles.addButton}
+              onClick={handleSettingsSave}
+              disabled={saving}
+            >
+              {saving ? 'Speichere...' : 'Einstellungen speichern'}
+            </button>
+            {settingsSaved && (
+              <span style={{ color: '#4ade80', fontSize: '0.85rem', alignSelf: 'center' }}>
+                Gespeichert
+              </span>
+            )}
+          </div>
         </div>
       )}
 
-      {!loading && filteredPrompts.length > 0 && (
-        <div style={styles.cardGrid}>
-          {filteredPrompts.map((prompt) => (
-            <div key={prompt.id} style={styles.settingsCard}>
-              <div style={styles.settingsCardHeader}>
-                <div style={styles.settingsItemLabel}>{prompt.name}</div>
-                <div style={styles.settingsItemCategory}>
-                  {prompt.category}
-                </div>
-              </div>
+      {/* Prompt tabs: Content-KI, Analyse-KI, Bild-KI — prompt cards */}
+      {!loading && !isSettingsTab(activeSubTab) && (
+        <>
+          {filteredPrompts.length === 0 && !showAddForm && (
+            <div style={styles.emptyGuide}>
+              <div style={styles.emptyGuideTitle}>{guide.title}</div>
+              <div style={styles.emptyGuideText}>{guide.description}</div>
+              {guide.example && (
+                <div style={styles.emptyGuideExample}>{guide.example}</div>
+              )}
+            </div>
+          )}
 
-              {editing?.id === prompt.id ? (
-                <div style={styles.editArea}>
-                  <textarea
-                    style={styles.textarea}
-                    value={editing.value}
-                    onChange={(e) =>
-                      setEditing({ ...editing, value: e.target.value })
-                    }
-                  />
-                  <div style={styles.editButtons}>
-                    <button
-                      type="button"
-                      style={styles.saveButton}
-                      onClick={handleSave}
-                      disabled={saving}
-                    >
-                      {saving ? 'Speichere...' : 'Speichern'}
-                    </button>
-                    <button
-                      type="button"
-                      style={styles.cancelButton}
-                      onClick={handleCancel}
-                    >
-                      Abbrechen
-                    </button>
+          {filteredPrompts.length > 0 && (
+            <div style={styles.cardGrid}>
+              {filteredPrompts.map((prompt) => (
+                <div key={prompt.id} style={styles.settingsCard}>
+                  <div style={styles.settingsCardHeader}>
+                    <div style={styles.settingsItemLabel}>{prompt.name}</div>
+                    <div style={styles.settingsItemCategory}>
+                      {prompt.category}
+                    </div>
                   </div>
+
+                  {editing?.id === prompt.id ? (
+                    <div style={styles.editArea}>
+                      <textarea
+                        style={styles.textarea}
+                        value={editing.value}
+                        onChange={(e) =>
+                          setEditing({ ...editing, value: e.target.value })
+                        }
+                      />
+                      <div style={styles.editButtons}>
+                        <button
+                          type="button"
+                          style={styles.saveButton}
+                          onClick={handleSave}
+                          disabled={saving}
+                        >
+                          {saving ? 'Speichere...' : 'Speichern'}
+                        </button>
+                        <button
+                          type="button"
+                          style={styles.cancelButton}
+                          onClick={handleCancel}
+                        >
+                          Abbrechen
+                        </button>
+                      </div>
+                    </div>
+                  ) : (
+                    <>
+                      <div style={styles.settingsItemValue}>
+                        {prompt.promptText}
+                      </div>
+                      <div style={{ padding: '0 1rem 1rem', display: 'flex', gap: '0.5rem' }}>
+                        <button
+                          type="button"
+                          style={styles.editButton}
+                          onClick={() => handleEdit(prompt)}
+                        >
+                          Bearbeiten
+                        </button>
+                        <button
+                          type="button"
+                          style={styles.deleteButton}
+                          onClick={() => handleDelete(prompt.id)}
+                          disabled={deleting === prompt.id}
+                        >
+                          {deleting === prompt.id ? 'Loesche...' : 'Loeschen'}
+                        </button>
+                      </div>
+                    </>
+                  )}
                 </div>
-              ) : (
-                <>
-                  <div style={styles.settingsItemValue}>
-                    {prompt.promptText}
-                  </div>
-                  <div style={{ padding: '0 1rem 1rem' }}>
-                    <button
-                      type="button"
-                      style={styles.editButton}
-                      onClick={() => handleEdit(prompt)}
-                    >
-                      Bearbeiten
-                    </button>
-                  </div>
-                </>
-              )}
+              ))}
             </div>
-          ))}
-        </div>
+          )}
+
+          {showAddForm && (
+            <div style={styles.addForm}>
+              <div style={styles.addFormTitle}>Neuen Prompt hinzufuegen ({guide.title})</div>
+              <div style={styles.addFormField}>
+                <label style={styles.addFormLabel}>Name</label>
+                <input
+                  style={styles.addFormInput}
+                  type="text"
+                  placeholder="z.B. Blog-Artikel Prompt, SEO-Analyse, Hero-Text"
+                  value={addForm.name}
+                  onChange={(e) => setAddForm({ ...addForm, name: e.target.value })}
+                />
+              </div>
+              <div style={styles.addFormField}>
+                <label style={styles.addFormLabel}>Prompt-Text</label>
+                <textarea
+                  style={styles.textarea}
+                  placeholder={guide.example}
+                  value={addForm.promptText}
+                  onChange={(e) => setAddForm({ ...addForm, promptText: e.target.value })}
+                />
+              </div>
+              <div style={styles.editButtons}>
+                <button
+                  type="button"
+                  style={styles.addButton}
+                  onClick={handleAdd}
+                  disabled={saving || !addForm.name.trim() || !addForm.promptText.trim()}
+                >
+                  {saving ? 'Erstelle...' : 'Erstellen'}
+                </button>
+                <button
+                  type="button"
+                  style={styles.cancelButton}
+                  onClick={() => {
+                    setShowAddForm(false);
+                    setAddForm({ name: '', promptText: '' });
+                  }}
+                >
+                  Abbrechen
+                </button>
+              </div>
+            </div>
+          )}
+
+          {!showAddForm && (
+            <div style={{ textAlign: 'center' as const, padding: '1rem 0' }}>
+              <button
+                type="button"
+                style={styles.addButton}
+                onClick={() => setShowAddForm(true)}
+              >
+                + Neuen Prompt hinzufuegen
+              </button>
+            </div>
+          )}
+        </>
       )}
     </div>
   );

package/src/components/editor/styles.ts

@@ -594,4 +594,88 @@ export const styles: Record<string, React.CSSProperties> = {
     color: textMuted,
     fontSize: '0.95rem',
   },
+  emptyGuide: {
+    padding: '2rem',
+    background: surfaceElevated,
+    border: `1px solid ${border}`,
+    borderRadius: '12px',
+    marginBottom: '1.5rem',
+  },
+  emptyGuideTitle: {
+    fontSize: '1.1rem',
+    fontWeight: 600,
+    color: text,
+    marginBottom: '0.75rem',
+    fontFamily: fontDisplay,
+  },
+  emptyGuideText: {
+    fontSize: '0.9rem',
+    color: textMuted,
+    lineHeight: 1.6,
+    marginBottom: '0.5rem',
+  },
+  emptyGuideExample: {
+    background: bg,
+    border: `1px solid ${border}`,
+    borderRadius: '8px',
+    padding: '0.75rem 1rem',
+    marginTop: '0.75rem',
+    fontSize: '0.85rem',
+    fontFamily: fontMono,
+    color: textAccent,
+    lineHeight: 1.5,
+  },
+  addForm: {
+    padding: '1.5rem',
+    background: surface,
+    border: `1px solid ${border}`,
+    borderRadius: '12px',
+  },
+  addFormTitle: {
+    fontSize: '1rem',
+    fontWeight: 600,
+    color: text,
+    marginBottom: '1rem',
+  },
+  addFormField: {
+    marginBottom: '0.75rem',
+  },
+  addFormLabel: {
+    display: 'block',
+    fontSize: '0.8rem',
+    color: textMuted,
+    marginBottom: '0.25rem',
+    fontWeight: 500,
+  },
+  addFormInput: {
+    width: '100%',
+    background: bg,
+    border: `1px solid ${border}`,
+    borderRadius: '8px',
+    padding: '0.5rem 0.75rem',
+    color: text,
+    fontSize: '0.85rem',
+    outline: 'none',
+    boxSizing: 'border-box' as const,
+  },
+  deleteButton: {
+    background: 'transparent',
+    border: `1px solid ${error}`,
+    color: error,
+    padding: '0.4rem 0.8rem',
+    borderRadius: '6px',
+    fontSize: '0.8rem',
+    fontWeight: 500,
+    cursor: 'pointer',
+  },
+  addButton: {
+    background: primary,
+    border: 'none',
+    color: '#fff',
+    padding: '0.5rem 1rem',
+    borderRadius: '8px',
+    fontSize: '0.85rem',
+    fontWeight: 600,
+    cursor: 'pointer',
+  },
 };

package/src/services/PromptService.ts

@@ -16,6 +16,20 @@ export class PromptService {
     return result?.promptText ?? null;
   }
 
+  async createPrompt(id: string, name: string, category: string, promptText: string): Promise<void> {
+    await db.insert(Prompts).values({
+      id,
+      name,
+      category,
+      promptText,
+      updatedAt: new Date(),
+    });
+  }
+
+  async deletePrompt(id: string): Promise<void> {
+    await db.delete(Prompts).where(eq(Prompts.id, id));
+  }
+
   async updatePrompt(id: string, text: string): Promise<void> {
     await db
       .update(Prompts)

package/task.md

@@ -13,7 +13,80 @@ Line 33-34: API `/api/prompts` returns `{ prompts, settings }` but the component
 + setPrompts(Array.isArray(data.prompts) ? data.prompts : []);
 ```
 
-## 2. Auto-register dependencies in index.ts
+## 2. Separate Settings from Prompts in SettingsTab
+
+**File:** `src/components/editor/SettingsTab.tsx`
+
+The SettingsTab currently treats all 5 sub-tabs identically, showing the "Neuen Prompt hinzufuegen" (prompt CRUD) UI for every tab. But **Homepage** and **Website** are **site settings** (key-value pairs in `SiteSettings` table), not AI prompts. Only **Content-KI**, **Analyse-KI**, and **Bild-KI** should show the prompt CRUD interface.
+
+### Changes required:
+
+1. **Import `Setting` type** from `./types` (already defined there)
+
+2. **Add constants** at the top of the file:
+
+```ts
+const SETTINGS_TABS: SettingsSubTab[] = ['homepage', 'website'];
+
+const SETTINGS_FIELDS: Record<string, { key: string; label: string; type: 'input' | 'textarea' }[]> = {
+  homepage: [
+    { key: 'hero_headline', label: 'Hero Ueberschrift', type: 'input' },
+    { key: 'hero_text', label: 'Hero Text', type: 'textarea' },
+    { key: 'target_audience', label: 'Zielgruppe', type: 'input' },
+    { key: 'tone', label: 'Tonalitaet', type: 'input' },
+    { key: 'core_message', label: 'Kernbotschaft', type: 'textarea' },
+  ],
+  website: [
+    { key: 'cta_url', label: 'CTA Link', type: 'input' },
+    { key: 'cta_style', label: 'CTA Stil', type: 'input' },
+    { key: 'cta_prompt', label: 'CTA Prompt', type: 'textarea' },
+    { key: 'core_tags', label: 'Core Tags (kommagetrennt)', type: 'input' },
+    { key: 'brand_guidelines', label: 'Markenrichtlinien', type: 'textarea' },
+  ],
+};
+```
+
+3. **Add helper function:**
+
+```ts
+function isSettingsTab(tab: SettingsSubTab): boolean {
+  return SETTINGS_TABS.includes(tab);
+}
+```
+
+4. **Add new state** in the component:
+
+```ts
+const [settings, setSettings] = useState<Setting[]>([]);
+const [settingsForm, setSettingsForm] = useState<Record<string, string>>({});
+const [settingsSaved, setSettingsSaved] = useState(false);
+```
+
+5. **Update `loadPrompts`** to also load settings:
+
+```ts
+const loadedSettings: Setting[] = Array.isArray(data.settings) ? data.settings : [];
+setSettings(loadedSettings);
+const formValues: Record<string, string> = {};
+for (const s of loadedSettings) {
+  formValues[s.key] = s.value;
+}
+setSettingsForm(formValues);
+```
+
+6. **Add `handleSettingsSave`** function that POSTs each field with `{ type: 'setting', key, value }` to `/api/prompts`
+
+7. **Update the render/return** to branch on `isSettingsTab(activeSubTab)`:
+   - **Settings tabs** (homepage, website): render a key-value form with text inputs/textareas for each field defined in `SETTINGS_FIELDS`, plus a "Einstellungen speichern" button
+   - **Prompt tabs** (content-ai, analysis-ai, image-ai): keep existing prompt card grid + "Neuen Prompt hinzufuegen" button (unchanged)
+
+8. **Update `CATEGORY_GUIDES`** for homepage and website — change descriptions to reflect settings (not prompts), remove example text
+
+### API usage for settings
+- Read: from `data.settings` array returned by `GET /api/prompts`, find by `key`
+- Write: `POST /api/prompts` with `{ type: 'setting', key, value }`
+
+## 3. Auto-register dependencies in index.ts
 
 **File:** `src/index.ts`
 
@@ -45,13 +118,13 @@ The consumer currently must manually add `react()`, `db()`, `output: 'server'`,
 }
 ```
 
-## 3. Bump version to 1.0.5
+## 4. Bump version to 1.0.5
 
 **File:** `package.json`
 
 Change `"version": "1.0.4"` to `"version": "1.0.5"`.
 
-## 4. Update README with simplified setup
+## 5. Update README with simplified setup
 
 **File:** `README.md`
 
@@ -74,4 +147,8 @@ Note that `prerender: false` is already present on all 18 `injectRoute()` calls
 1. In a test project, use only `integrations: [ncaAiCms()]` in astro config
 2. Run `npx astro dev`
 3. Open `/login` — should render without errors
-4. Log in, open `/editor` — settings tab should load without crash
+4. Log in, open `/editor` → Settings tab → Homepage: should show key-value form fields, no "Neuen Prompt hinzufuegen"
+5. Homepage tab → edit hero text → save → reload → value persists
+6. Website tab → edit CTA URL, core tags → save → reload → values persist
+7. Content-KI tab → still shows prompt cards with create/edit/delete
+8. Analyse-KI and Bild-KI → same prompt UI as before

package/update.md

@@ -1,3 +1,20 @@
+# v1.0.6
+
+## Separate settings from prompts in SettingsTab
+- Homepage and Website tabs now show key-value settings forms (hero text, zielgruppe, CTA, core tags, etc.)
+- Content-KI, Analyse-KI, and Bild-KI tabs show prompt card UI with create/edit/delete
+- Settings are saved via `POST /api/prompts` with `type: setting`
+- Each settings tab has defined fields: homepage (hero, zielgruppe, ton, kernbotschaft), website (CTA, tags, markenrichtlinien)
+
+## Category guides and custom prompts
+- Empty prompt categories show content marketing guidance with concrete examples
+- New "+ Neuen Prompt hinzufuegen" button to create custom prompts
+- Each prompt card now has a delete button
+- API: added POST with `action: create` and DELETE endpoint for prompts
+- PromptService: added `createPrompt()` and `deletePrompt()` methods
+
+---
+
 # v1.0.5
 
 ## Fix: SettingsTab crash on prompts response