From 03f26601638b25a7d0851dbbd8e09ae6bdf5d117 Mon Sep 17 00:00:00 2001
From: oabrivard <olivier@abrivard.fr>
Date: Thu, 26 Mar 2026 20:58:31 +0100
Subject: [PATCH] refactor: redesign settings page with clear section grouping
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

5 sections organized by purpose:
1. Contenu — theme, categories, summary length
2. Sources — per-source limits, Brave Search
3. Intelligence Artificielle — provider + API keys merged in one visual card
4. Performance — batch size, history, rate limits
5. Import/Export — collapsed by default

Sticky save button, smaller number inputs, integrated API key status
badge in the AI provider card.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../components/settings/SettingsAdvanced.tsx  | 139 ------------------
 1 file changed, 139 deletions(-)
 delete mode 100644 frontend/src/components/settings/SettingsAdvanced.tsx

diff --git a/frontend/src/components/settings/SettingsAdvanced.tsx b/frontend/src/components/settings/SettingsAdvanced.tsx
deleted file mode 100644
index a521aff..0000000
--- a/frontend/src/components/settings/SettingsAdvanced.tsx
+++ /dev/null
@@ -1,139 +0,0 @@
-import { type Component } from 'solid-js';
-import { A } from '@solidjs/router';
-import { useI18n } from '~/i18n';
-import type { UserSettings } from '~/types';
-
-interface SettingsAdvancedProps {
-  settings: () => UserSettings;
-  setSettings: (updater: (prev: UserSettings) => UserSettings) => void;
-}
-
-/**
- * Advanced settings section on the Settings page.
- *
- * Groups fields that control extraction and pipeline behaviour:
- * - `article_history_days` — deduplication window
- * - `batch_size` — number of sources processed per LLM batch
- * - `search_agent_behavior` — free-text prompt injection for the search agent
- */
-const SettingsAdvanced: Component<SettingsAdvancedProps> = (props) => {
-  const { t } = useI18n();
-
-  return (
-    <>
-      {/* articleHistoryDays + batchSize grid */}
-      <div class="grid grid-cols-1 gap-y-6 gap-x-4 sm:grid-cols-2">
-        <div>
-          <label
-            for="articleHistoryDays"
-            class="block text-sm font-medium text-gray-700"
-          >
-            {t('settings.articleHistoryDays')}
-          </label>
-          <div class="mt-1">
-            <input
-              type="number"
-              id="articleHistoryDays"
-              min="0"
-              max="365"
-              class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm border-gray-300 rounded-md py-2 px-3 border"
-              value={props.settings().article_history_days}
-              onInput={(e) =>
-                props.setSettings((prev) => ({
-                  ...prev,
-                  article_history_days:
-                    parseInt(e.currentTarget.value) || 90,
-                }))
-              }
-            />
-          </div>
-          <div class="mt-2">
-            <A href="/article-history" class="text-sm text-indigo-600 hover:text-indigo-800 underline">
-              {t('articleHistory.viewHistory')}
-            </A>
-          </div>
-        </div>
-
-        <div>
-          <label
-            for="batchSize"
-            class="block text-sm font-medium text-gray-700"
-          >
-            {t('settings.batchSize')}
-          </label>
-          <p class="text-xs text-gray-500 mb-1">{t('settings.batchSizeHelp')}</p>
-          <div class="mt-1">
-            <input
-              type="number"
-              id="batchSize"
-              min="1"
-              max="20"
-              class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm border-gray-300 rounded-md py-2 px-3 border"
-              value={props.settings().batch_size}
-              onInput={(e) =>
-                props.setSettings((prev) => ({
-                  ...prev,
-                  batch_size:
-                    parseInt(e.currentTarget.value) || 5,
-                }))
-              }
-            />
-          </div>
-        </div>
-
-        <div>
-          <label for="sourceExtractionWindow" class="block text-sm font-medium text-gray-700">
-            {t('settings.sourceExtractionWindow')}
-          </label>
-          <p class="text-xs text-gray-500 mb-1">{t('settings.sourceExtractionWindowHelp')}</p>
-          <div class="mt-1">
-            <input
-              type="number"
-              id="sourceExtractionWindow"
-              min="1"
-              max="10"
-              class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm border-gray-300 rounded-md py-2 px-3 border"
-              value={props.settings().source_extraction_window}
-              onInput={(e) =>
-                props.setSettings((prev) => ({
-                  ...prev,
-                  source_extraction_window: parseInt(e.currentTarget.value) || 3,
-                }))
-              }
-            />
-          </div>
-        </div>
-      </div>
-
-      {/* Search agent behavior */}
-      <div>
-        <label
-          for="searchAgentBehavior"
-          class="block text-sm font-medium text-gray-700"
-        >
-          {t('settings.searchBehavior')}
-        </label>
-        <div class="mt-1">
-          <textarea
-            id="searchAgentBehavior"
-            rows={3}
-            class="shadow-sm focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm border-gray-300 rounded-md py-2 px-3 border"
-            value={props.settings().search_agent_behavior}
-            onInput={(e) =>
-              props.setSettings((prev) => ({
-                ...prev,
-                search_agent_behavior: e.currentTarget.value,
-              }))
-            }
-            placeholder={t('settings.searchBehaviorPlaceholder')}
-          />
-        </div>
-        <p class="mt-2 text-sm text-gray-500">
-          {t('settings.searchBehaviorHelp')}
-        </p>
-      </div>
-    </>
-  );
-};
-
-export default SettingsAdvanced;