feat(launcher): implement auto-collapse coordinator and overhauled configuration UI

- Introduced 'Launcher_Cfg_Section' with 3-way state support (collapsed, auto, pinned).
- Implemented 'handle_section_expand' coordinator in 'launcher_cfg.svelte' for single-active-section behavior.
- Overhauled all configuration sub-components to participate in the auto-collapse logic.
- Updated 'ae_events_stores.ts' with new persistent section states.
- Synchronized 'launcher_cfg_template.svelte' with the new pattern for future extensions.
This commit is contained in:
Scott Idem
2026-01-30 14:11:52 -05:00
parent 1d5401bbe5
commit 3148375eb3
14 changed files with 1058 additions and 859 deletions

View File

@@ -0,0 +1,37 @@
# Project: Launcher Configuration UI/UX Overhaul
**Status:** IN-PROGRESS
**Goal:** Create a standardized, responsive, and categorized configuration interface for the AE Events Launcher.
## 1. Objectives
- **Standardization**: Use consistent naming (`snake_case`), styling, and layout across all config pieces.
- **Flexibility**: Support mobile, tablet, and high-res Macbook displays using responsive widths.
- **Intelligent Collapsing**: Implement a 3-way state logic: `collapsed`, `auto_collapse`, `pinned`.
- **Contextual Fields**: Hide technical/editable fields unless `$ae_loc.edit_mode` is enabled.
## 2. 3-Way State Logic
- **`collapsed`**: Section content is hidden.
- **`auto`**: Section is expanded by default, but closes if another "auto" section is opened.
- **`pinned`**: Section is expanded and *ignores* the auto-collapse signals from other sections.
## 3. Component Architecture
- **`Launcher_Cfg`**: The main container with Tabbed Navigation (System, Sync, General).
- **`Launcher_Cfg_Section`**: Shared wrapper component providing the header, 3-way toggle, and responsive container.
- **Sub-components**: Individual sections (Health, Native OS, Timers, etc.) refactored to use the shared wrapper.
## 4. Feature Matrix & `edit_mode`
| Component | Always Visible (Read-Only) | Edit Mode Only (Write/Technical) |
| :--- | :--- | :--- |
| **Health** | Heartbeat Status, RAM/CPU Gauges | Raw Metadata JSON, Hostname, IPs |
| **Native OS** | Folder Open Buttons, Recording Toggle | Manual Terminal CMD, Reset Wallpaper |
| **Sync** | Sync Stats (Total/Cached) | Millisecond Timers, Hash Prefix Length |
| **Updates** | Current Version, Check Button | Update Path/URL inputs |
## 5. Progress Tracker
- [ ] Migrate `events_loc.launcher` visibility flags to 3-way states.
- [ ] Implement `Launcher_Cfg_Section` wrapper component.
- [ ] Refactor `Launcher_Cfg_Health`.
- [ ] Refactor `Launcher_Cfg_Native_OS`.
- [ ] Refactor `Launcher_Cfg_Sync_Timers`.
- [ ] Refactor `Launcher_Cfg_Updates`.
- [ ] Final UI/UX Polish.