feat: Add theme normalization and API integration for theme settings

static/js/theme.js

@@ -41,6 +41,30 @@ document.addEventListener('DOMContentLoaded', () => {
     });
   });
 
+  const THEME_API_URL = '/api/settings/theme';
+
+  const normalizeTheme = (theme) => {
+    if (!theme || typeof theme !== 'object') {
+      return {};
+    }
+    const {
+      theme_name,
+      primary_color,
+      secondary_color,
+      accent_color,
+      background_color,
+      text_color,
+    } = theme;
+    return {
+      theme_name,
+      primary_color,
+      secondary_color,
+      accent_color,
+      background_color,
+      text_color,
+    };
+  };
+
   if (themeSettingsForm) {
     themeSettingsForm.addEventListener('submit', async (event) => {
       event.preventDefault();
@@ -49,7 +73,7 @@ document.addEventListener('DOMContentLoaded', () => {
       const themeData = Object.fromEntries(formData.entries());
 
       try {
-        const response = await fetch('/api/theme-settings', {
+        const response = await fetch(THEME_API_URL, {
           method: 'POST',
           headers: {
             'Content-Type': 'application/json',
@@ -58,9 +82,11 @@ document.addEventListener('DOMContentLoaded', () => {
         });
 
         if (response.ok) {
+          const payload = await response.json();
+          const savedTheme = normalizeTheme(payload?.theme ?? themeData);
           alert('Theme settings saved successfully!');
-          applyTheme(themeData);
-          saveTheme(themeData);
+          applyTheme(savedTheme);
+          saveTheme(savedTheme);
         } else {
           const errorData = await response.json();
           alert(`Error saving theme settings: ${errorData.detail}`);
@@ -91,9 +117,9 @@ document.addEventListener('DOMContentLoaded', () => {
     // If no saved theme, load from backend (if available)
     async function loadAndApplyThemeFromServer() {
       try {
-        const response = await fetch('/api/theme-settings'); // Assuming a GET endpoint for theme settings
+        const response = await fetch(THEME_API_URL);
         if (response.ok) {
-          const theme = await response.json();
+          const theme = normalizeTheme(await response.json());
           applyTheme(theme);
           saveTheme(theme); // Save to local storage for future use
         } else {