Settings overhaul + UI polish pass

Two months of iteration on the Settings panel, integration forms, and
small visual nudges across the app. Highlights:

Settings restructure
- Add Models: split into separate Local + API cards (no more in-card
  tabs); each fuses Type/Provider with the URL input.
- Added Models: new dedicated sidebar tab, with Probe + Clear-offline
  pulled into its header; Local/API sub-section icons accent-tinted.
- Search: Web Search and a new Deep Research card (Model + tuning),
  with a cross-link to AI Defaults. Provider hints use real clickable
  anchors; Web Search Test button shows a whirlpool spinner.
- AI Defaults: Image Generation card returns; Research Model card
  carries only Endpoint+Model with a cross-link to Search; Vision /
  Default / Utility fallbacks unified under one numbered-row design
  matching Search's chain.
- API Permissions (was 'API Tokens'): per-row rename, inline
  Permissions toggle that expands the scope-edit panel, in-field
  copy icons (icon→check on success). Empty state accent-tinted.
- Integrations: + Add Integration drops a type-picker menu directly
  under the button (drop-up on tight viewports); each integration
  form (API, CalDAV, CardDAV, Email, Codex/Claude, Vault, MCP) uses
  the same accent-outlined Save/Test/Cancel buttons right-aligned.
- Danger Zone: Wipe→Delete with trash icons; new 'Delete everything'
  row at the bottom that loops every category.

AI Synthesis (Reminders)
- Persona dropdown sourced from PROMPT_TEMPLATES + custom preset.
- src/reminder_personas.py mirrors the five built-ins for the
  server-side synthesis path.
- dispatch_reminder() reads reminder_llm_persona and uses the
  persona's system prompt; empty/unknown falls back to warm-neutral.

Esc handling
- Kebab menus and the provider picker intercept Esc in capture phase
  so dismissing a popup no longer closes the whole Settings modal.

Accent tinting
- Scoped CSS rule across data-settings-panel=ai/services/added-models/
  search/integrations/reminders for card h2 icons + the Added Models
  sub-section icons.

Codex/Claude integration form
- No more auto-creation on form open — explicit Create token button.
- New tokens start with every scope granted; existing tokens move out
  of the integration form into the API Permissions card.
- Setup reveal: copy buttons inline inside the token + setup code
  blocks; shorter subtitle wording.

Misc visual polish
- Save/Test/Cancel uniformly accent-outlined and right-aligned on
  every integration form.
- Provider logos render inline next to the search fallback selects
  and the Deep Research Search dropdown.
- Trash icons in fallback rows bumped to 20x20 so they fill the 32px
  button.
- Image generation default flipped to off.
This commit is contained in:
pewdiepie-archdaemon
2026-06-10 15:15:13 +09:00
parent 7690860ab1
commit 4f7061fd61
18 changed files with 1512 additions and 552 deletions
+3 -14
View File
@@ -1221,7 +1221,7 @@ function initializeEventListeners() {
sortDropdown.querySelectorAll('.sort-option').forEach(o => {
const check = o.querySelector('.sort-check') || document.createElement('span');
check.className = 'sort-check';
check.style.cssText = 'float:right;font-size:20px;line-height:1;position:relative;top:3px;color:var(--accent, var(--red));opacity:' + (o.dataset.sort === current ? '1' : '0');
check.style.cssText = 'float:right;font-size:20px;line-height:1;position:relative;top:1px;color:var(--accent, var(--red));opacity:' + (o.dataset.sort === current ? '1' : '0');
check.textContent = '\u2022';
if (!o.querySelector('.sort-check')) o.appendChild(check);
});
@@ -1265,9 +1265,9 @@ function initializeEventListeners() {
let msg;
if (data.updated > 0) {
msg = `Sorted ${data.updated} into ${data.folders.length} folder${data.folders.length === 1 ? '' : 's'}`;
if (remaining > 0) msg += `${remaining} unfiled left, hit Tidy again`;
if (remaining > 0) msg += `${remaining} unfiled left, hit Group again`;
} else if (remaining > 0) {
msg = `${remaining} unfiled chats — hit Tidy again`;
msg = `${remaining} unfiled chats — hit Group again`;
} else {
msg = 'All sorted';
}
@@ -1288,17 +1288,6 @@ function initializeEventListeners() {
const autoSortBtn = el('auto-sort-sessions-btn');
if (autoSortBtn) autoSortBtn.addEventListener('click', () => _runTidy(false));
// Chevron next to the Tidy row toggles the no-AI sub-item.
const autoSortMoreBtn = el('auto-sort-sessions-more');
const autoSortNoaiBtn = el('auto-sort-sessions-noai-btn');
if (autoSortMoreBtn && autoSortNoaiBtn) {
autoSortMoreBtn.addEventListener('click', (e) => {
e.stopPropagation();
autoSortNoaiBtn.style.display = autoSortNoaiBtn.style.display === 'none' ? 'block' : 'none';
});
autoSortNoaiBtn.addEventListener('click', () => _runTidy(true));
}
}
// Model sort dropdown