chat worked

frontend/src/routes/settings/+page.svelte

@@ -20,6 +20,15 @@
   import { addToast } from "$lib/toasts";
   import ProviderConfig from "../../components/llm/ProviderConfig.svelte";
 
+  const DEFAULT_LLM_PROMPTS = {
+    dashboard_validation_prompt:
+      "Analyze the attached dashboard screenshot and the following execution logs for health and visual issues.\\n\\nLogs:\\n{logs}\\n\\nProvide the analysis in JSON format with the following structure:\\n{\\n    \\\"status\\\": \\\"PASS\\\" | \\\"WARN\\\" | \\\"FAIL\\\",\\n    \\\"summary\\\": \\\"Short summary of findings\\\",\\n    \\\"issues\\\": [\\n        {\\n            \\\"severity\\\": \\\"WARN\\\" | \\\"FAIL\\\",\\n            \\\"message\\\": \\\"Description of the issue\\\",\\n            \\\"location\\\": \\\"Optional location info (e.g. chart name)\\\"\\n        }\\n    ]\\n}",
+    documentation_prompt:
+      "Generate professional documentation for the following dataset and its columns.\\nDataset: {dataset_name}\\nColumns: {columns_json}\\n\\nProvide the documentation in JSON format:\\n{\\n    \\\"dataset_description\\\": \\\"General description of the dataset\\\",\\n    \\\"column_descriptions\\\": [\\n        {\\n            \\\"name\\\": \\\"column_name\\\",\\n            \\\"description\\\": \\\"Generated description\\\"\\n        }\\n    ]\\n}",
+    git_commit_prompt:
+      "Generate a concise and professional git commit message based on the following diff and recent history.\\nUse Conventional Commits format (e.g., feat: ..., fix: ..., docs: ...).\\n\\nRecent History:\\n{history}\\n\\nDiff:\\n{diff}\\n\\nCommit Message:",
+  };
+
   // State
   let activeTab = "environments";
   let settings = null;
@@ -53,6 +62,7 @@
     error = null;
     try {
       const response = await api.getConsolidatedSettings();
+      response.llm = normalizeLlmSettings(response.llm);
       settings = response;
     } catch (err) {
       error = err.message || "Failed to load settings";
@@ -62,6 +72,20 @@
     }
   }
 
+  function normalizeLlmSettings(llm) {
+    const normalized = {
+      providers: [],
+      default_provider: "",
+      prompts: { ...DEFAULT_LLM_PROMPTS },
+      ...(llm || {}),
+    };
+    normalized.prompts = {
+      ...DEFAULT_LLM_PROMPTS,
+      ...(llm?.prompts || {}),
+    };
+    return normalized;
+  }
+
   // Handle tab change
   function handleTabChange(tab) {
     activeTab = tab;
@@ -78,6 +102,7 @@
   async function handleSave() {
     console.log("[SettingsPage][Action] Saving settings");
     try {
+      settings.llm = normalizeLlmSettings(settings.llm);
       // In a real app we might want to only send the changed section,
       // but updateConsolidatedSettings expects full object or we can use specific endpoints.
       // For now we use the consolidated update.
@@ -644,6 +669,73 @@
             providers={settings.llm_providers || []}
             onSave={loadSettings}
           />
+
+          <div class="mt-6 rounded-lg border border-gray-200 bg-gray-50 p-4">
+            <h3 class="text-base font-semibold text-gray-900">
+              {$t.settings?.llm_prompts_title || "LLM Prompt Templates"}
+            </h3>
+            <p class="mt-1 text-sm text-gray-600">
+              {$t.settings?.llm_prompts_description ||
+                "Edit reusable prompts used for documentation, dashboard validation, and git commit generation."}
+            </p>
+
+            <div class="mt-4 space-y-4">
+              <div>
+                <label
+                  for="documentation-prompt"
+                  class="block text-sm font-medium text-gray-700"
+                >
+                  {$t.settings?.llm_prompt_documentation || "Documentation Prompt"}
+                </label>
+                <textarea
+                  id="documentation-prompt"
+                  bind:value={settings.llm.prompts.documentation_prompt}
+                  rows="8"
+                  class="mt-1 block w-full rounded-md border border-gray-300 p-2 font-mono text-xs"
+                ></textarea>
+              </div>
+
+              <div>
+                <label
+                  for="dashboard-validation-prompt"
+                  class="block text-sm font-medium text-gray-700"
+                >
+                  {$t.settings?.llm_prompt_dashboard_validation ||
+                    "Dashboard Validation Prompt"}
+                </label>
+                <textarea
+                  id="dashboard-validation-prompt"
+                  bind:value={settings.llm.prompts.dashboard_validation_prompt}
+                  rows="10"
+                  class="mt-1 block w-full rounded-md border border-gray-300 p-2 font-mono text-xs"
+                ></textarea>
+              </div>
+
+              <div>
+                <label
+                  for="git-commit-prompt"
+                  class="block text-sm font-medium text-gray-700"
+                >
+                  {$t.settings?.llm_prompt_git_commit || "Git Commit Prompt"}
+                </label>
+                <textarea
+                  id="git-commit-prompt"
+                  bind:value={settings.llm.prompts.git_commit_prompt}
+                  rows="8"
+                  class="mt-1 block w-full rounded-md border border-gray-300 p-2 font-mono text-xs"
+                ></textarea>
+              </div>
+            </div>
+
+            <div class="mt-4 flex justify-end">
+              <button
+                class="rounded bg-blue-600 px-4 py-2 text-white hover:bg-blue-700"
+                on:click={handleSave}
+              >
+                {$t.settings?.save_llm_prompts || "Save LLM Prompts"}
+              </button>
+            </div>
+          </div>
         </div>
       {:else if activeTab === "storage"}
         <!-- Storage Tab -->