refactor: options-page: Refactor options UI/UX, add new configurable modules, added app settings object for using configurables variables#34
Merged
jvillegasd merged 21 commits intomainfrom Mar 4, 2026
Conversation
…nfig - Replace flat options layout with a sidebar + multi-view layout (Download Settings, Cloud Providers, History) - Add History view with search/format/status/date filters, bulk delete, per-item actions (re-download, copy URL, manifest health check, delete) - Add S3/compatible cloud provider form alongside existing Google Drive panel - Add history button (clock icon) in popup top bar that opens options directly to History view - Add CHECK_URL message type so options page can probe manifest URLs via service worker (bypasses CORS) - Add bulkDeleteDownloads() IDB utility for efficient multi-item deletion - Extend StorageConfig with historyEnabled and s3 fields - Auto-delete terminal downloads from IDB when historyEnabled is false - All views centered; CSS tooltips on history action icon buttons Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Completed/failed/cancelled downloads now appear exclusively in the History view on the options page, not in the popup Downloads tab. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Completed downloads no longer appear in the popup Downloads tab, so the Open File button is now in the History view (options page). Only shown for COMPLETED items with a known localPath. Removes dead completed/failed action button code from render-downloads. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
… settings icon Replaces SVG placeholder logo with the actual extension icon (icon-32.png). Swaps the messy gear/path icon on Download Settings for a clean sliders icon. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Collapses Open file / Re-download / Copy URL / Check manifest / Delete into a single ··· button per row. Menu closes on outside click or action selection. Check manifest state feedback is shown inline on the menu item. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replaces the inline button state feedback with a bottom-center toast. "Checking…" appears immediately, then resolves to success/warning/error with the HTTP status or a CORS note. Toast auto-dismisses after 3 seconds. Removes now-unused check-btn CSS from the menu item. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Shows "Download queued" toast on success or an error toast if the service worker rejects. Refreshes the history list in place so the user stays on the history view without a full page reload. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
switchView() now calls history.replaceState to keep the URL hash in sync with the active section. On refresh, init() reads the hash and opens the correct view instead of always falling back to download-settings. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Render first 50 items on load; append subsequent batches as the user scrolls near the bottom via a sentinel div watched by IntersectionObserver. Filters and search reset to the first page on every change. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…tory updates
- Rename TERMINAL_STAGES → FINISHED_STAGES and handleTerminalDownload →
handleFinishedDownload to align with DownloadStage terminology used
elsewhere in the codebase
- Update service-worker.ts JSDoc comment to match ("terminal" → "finished")
- Add real-time history updates via DOWNLOAD_PROGRESS message listener —
newly finished downloads appear/update without requiring a page reload
- Flash animation (history-item--new) highlights items as they arrive
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Add three new options sections: Recording (poll intervals), Notifications (OS notify + auto-open), and Advanced (retries, backoff, caches, IDB sync) - Wire all new settings through DownloadManager → BasePlaylistHandler → fetch-utils so retryDelayMs and retryBackoffFactor now take effect at runtime - Read detectionCacheSize/masterPlaylistCacheSize from chrome.storage in content script init so detection cache limits are configurable - Add cross-field validation: min poll interval must be < max poll interval - Add notifications permission to manifest for OS completion alerts - Add post-download actions handler (notify on completion, reveal in Finder) - Fix re-recording: clean up finished IDB entry before starting fresh - Fix CHECK_URL: use GET for HLS/DASH manifests to avoid CDN 403s on HEAD - Fix history re-download: send START_RECORDING for live stream entries - Add live badge to history items for recordings from live streams - Add history-item flash animation on completion while history tab is open Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Add src/core/storage/settings.ts with AppSettings interface and loadSettings() — single function that reads StorageConfig and applies all defaults, eliminating scattered ?? DEFAULT_X fallbacks - Migrate all read-only config calls in service-worker.ts and options.ts load functions to use loadSettings(); save functions keep raw ChromeStorage reads to preserve merge-and-write-back pattern - Consolidate maxConcurrent into StorageConfig (was stored under a separate "max_concurrent" key); remove MAX_CONCURRENT_KEY constant - loadSettings() now does a single storage read instead of Promise.all with two keys Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…toast - Add src/options/constants.ts for options-page-only validation bounds and UI timing constants (TOAST_DURATION_MS, MS_PER_DAY, MIN/MAX clamps) - Add DEFAULT_GOOGLE_DRIVE_FOLDER_NAME to shared/constants (used by both options.ts and settings.ts) - Replace showStatus(elementId, msg, type) with showStatus(msg, type) that delegates to showToast — all save confirmations now use the same bottom toast as history actions - Remove all status-msg div elements and their CSS from options.html - Replace every hardcoded clamp literal in saveRecordingSettings and saveAdvancedSettings with named constants Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
All time inputs now display in seconds; internal storage remains ms throughout. Conversion happens only at the options page boundary (divide on load, multiply on save). - ffmpeg-timeout: minutes → seconds (15 min = 900 s, range 300–3 600) - poll-min/max: ms → seconds (1 000 ms = 1 s, 10 000 ms = 10 s) - retry-delay: ms → seconds (100 ms = 0.1 s) - db-sync-interval: ms → seconds (500 ms = 0.5 s) Remove DEFAULT_FFMPEG_TIMEOUT_MINUTES, MIN/MAX_FFMPEG_TIMEOUT_MINUTES, and MS_PER_MINUTE from shared/constants (options-only). Replace with _S equivalents in options/constants.ts alongside updated _S clamp bounds. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Remove makeIconBtn and iconSpinner — defined but never called. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…anges Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…shared.css Move duplicated @font-face declarations, CSS custom properties, reset, scrollbar, and badge styles out of popup.html and options.html into a new public/shared.css. Both pages now reference it via /shared.css. Also unifies token drift between the two files: options gains --recording, --space-*, and --radius-lg; badge colors are harmonised; options gets light-mode badge overrides it was missing. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replace silent Math.max/Math.min clamping in all save handlers with explicit validation. Invalid fields get a red border and an inline error message; the button stays enabled and no write is attempted until all fields pass. Helpers: validateField(), markInvalid(), clearInvalid() in options.ts. The recording cross-field check (min < max) now marks the specific field invalid instead of falling back to the toast. Toast is reserved for storage/network errors. Documents the pattern in CLAUDE.md. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This pull request delivers a major upgrade to the extension's configuration, history, and UI systems, along with foundational improvements for code maintainability and user experience. The most significant changes include a comprehensive redesign of the options page (now a full-featured settings UI with history and advanced controls), persistent download history with infinite scroll and batch actions, new notification features, and a refactor of configuration management for type safety and scalability. Additionally, design tokens and badge styles are introduced for a consistent UI, and relevant code is updated to support these new features.
Options Page and Configuration Overhaul
AppSettingsobject, always accessed throughloadSettings()incore/storage/settings.ts, ensuring all defaults are applied and type safety is enforced. The config includes advanced settings like detection cache sizes and sync intervals. [1] [2] [3] [4]src/shared/constants.ts(cross-module) andsrc/options/constants.ts(options UI only), with clear documentation on time unit conversions and usage. [1] [2]Download History and Batch Actions
historyEnabledis true (default). The options page History section supports infinite scroll, re-download, copy URL, and bulk delete via the newbulkDeleteDownloads()function. [1] [2]Notification and Post-Download Features
AppSettings.notifications. [1] [2]notificationspermission.Detection and Performance Improvements
UI/UX Enhancements
public/shared.css) with design tokens, dark/light mode support, and consistent badge styles for download status and metadata.These changes collectively modernize the extension's configuration, history, and UI, laying the groundwork for future features and improved user experience.