Add settings persistence, task history, and sidebar interface

[asikmydeen]

Features:

• Settings persistence: Model selection now saves to chrome.storage.local
• Task history: Complete logging of all executions with statistics dashboard
• Sidebar interface: Converted from popup to full-height sidebar with sidePanel API
• Tab navigation: New Task and History tabs for better organization
• Analytics: Track success rate, LLM usage, steps, and duration per task
• Export/import: Export task history as JSON for debugging

Implementation:

• Created storage.ts for chrome.storage.local management
• Created task-logger.ts for execution tracking
• Created TaskHistory.tsx component with stats and detailed views
• Integrated logging throughout executor at all key points
• Updated manifest.json with sidePanel permission and configuration
• Added sidebar open handler in background service worker
• Updated UI with tabs, full-height layout, and history styles

Documentation:

• CLAUDE.md: Project guide for AI assistants
• ENHANCEMENT_POINTS.md: 33 identified enhancement opportunities
• ENHANCEMENT_SUMMARY.md: Strategic analysis and roadmap
• IMPLEMENTATION_SUMMARY.md: Complete technical details
• USER_GUIDE.md: User documentation
• QUICK_START.md: 30-second setup guide
• CHANGES.md: Summary of changes

---

Important

Add settings persistence, task history, and sidebar interface to enhance user experience in the Chrome extension.

• Features:
  • Settings persistence: Model selection saved to chrome.storage.local, loaded on startup.
  • Task history: Logs executions with stats, exportable as JSON, last 50 tasks stored.
  • Sidebar interface: Full-height sidebar with tab navigation (New Task/History).
• Implementation:
  • Created storage.ts for settings and history management.
  • Created task-logger.ts for logging task executions.
  • Added TaskHistory.tsx for history UI.
  • Integrated logging in executor.ts, added sidebar handler in index.ts.
  • Updated App.tsx for tab navigation, styles.css for new styles.
  • Updated manifest.json for sidePanel configuration.
• Documentation:
  • Added CLAUDE.md, ENHANCEMENT_POINTS.md, ENHANCEMENT_SUMMARY.md, IMPLEMENTATION_SUMMARY.md, USER_GUIDE.md, QUICK_START.md, CHANGES.md.

^{This description was created by for 3997cbf. You can customize this summary. It will automatically update as commits are pushed.}

[ellipsis-dev]

Important

Looks good to me! 👍

Reviewed everything up to 3997cbf in 1 minute and 40 seconds. Click for details.

• Reviewed 3486 lines of code in 17 files
• Skipped 0 files when reviewing.
• Skipped posting 18 draft comments. View those below.
• Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.

1. CHANGES.md:1

• Draft comment:
  The changes summary is very detailed and comprehensive; consider a slight reduction in verbosity if brevity is desired for quick reference.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

2. CLAUDE.md:1

• Draft comment:
  Excellent documentation for guiding contributors; ensure it stays updated as the code evolves.
• Reason this comment was not posted:
  Confidence changes required: 10% <= threshold 50% None

3. ENHANCEMENT_POINTS.md:1

• Draft comment:
  Enhancement points are well organized; consider adding inline links or references to specific file sections for easier navigation.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

4. ENHANCEMENT_SUMMARY.md:1

• Draft comment:
  The summary provides a clear high-level view; adding version or commit references could further aid traceability.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

5. IMPLEMENTATION_SUMMARY.md:1

• Draft comment:
  Implementation summary is clear and details integration points well; nothing major to change.
• Reason this comment was not posted:
  Confidence changes required: 10% <= threshold 50% None

6. QUICK_ENHANCEMENTS.md:1

• Draft comment:
  The quick enhancements reference is very useful; double-check that code excerpts remain consistent with the current codebase.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

7. QUICK_START.md:1

• Draft comment:
  Quick Start guide is concise and clear – good for user onboarding.
• Reason this comment was not posted:
  Confidence changes required: 10% <= threshold 50% None

8. USER_GUIDE.md:1

• Draft comment:
  User guide is detailed and covers key features; using screenshots or visuals in future updates might further enhance clarity.
• Reason this comment was not posted:
  Confidence changes required: 10% <= threshold 50% None

9. manifest.json:36

• Draft comment:
  Side panel configuration has been correctly added; ensure that permissions remain as minimal as required for enhanced security.
• Reason this comment was not posted:
  Confidence changes required: 10% <= threshold 50% None

10. src/background/agents/executor.ts:87

• Draft comment:
  TaskLogger integration (startTask call) is well integrated; consider logging additional context for cancellations to assist in debugging.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

11. src/background/agents/executor.ts:580

• Draft comment:
  The regex-based search query extraction handles diverse patterns; ensure thorough unit tests to cover edge cases.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

12. src/background/index.ts:442

• Draft comment:
  Side panel handler via chrome.action.onClicked is correctly implemented; consider wrapping it in error boundary for robustness.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

13. src/background/task-logger.ts:30

• Draft comment:
  TaskLogger implementation is robust; ensure that any storage errors are handled gracefully to avoid silent failures.
• Reason this comment was not posted:
  Confidence changes required: 10% <= threshold 50% None

14. src/popup/App.tsx:54

• Draft comment:
  Popup UI effectively manages background connection; refactoring port connection into a custom hook (e.g., useBackgroundPort) may reduce duplication.
• Reason this comment was not posted:
  Confidence changes required: 30% <= threshold 50% None

15. src/popup/components/TaskHistory.tsx:31

• Draft comment:
  TaskHistory component loads history using useEffect; ensure that any changes to the loadHistory function are reflected in the dependency array if it’s refactored.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

16. src/popup/components/TaskInput.tsx:26

• Draft comment:
  TaskInput component correctly loads saved settings; you might consider showing an error message to the user if loading or saving settings fails.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

17. src/popup/styles.css:1

• Draft comment:
  The CSS is well-organized; consider adopting CSS modules or a CSS-in-JS solution for easier component-scoped styling in future.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

18. src/shared/storage.ts:40

• Draft comment:
  Storage utilities are implemented robustly; consider caching settings in-memory to reduce repeated chrome.storage calls for frequently accessed settings.
• Reason this comment was not posted:
  Confidence changes required: 20% <= threshold 50% None

Workflow ID: wflow_wtc1SM8FasjyO7Or

^{You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.}

[Copilot]

Pull request overview

Adds persistent settings, task-execution history/analytics, and migrates the UI from a popup to a full-height Chrome Side Panel.

Changes:

• Introduces chrome.storage.local utilities for settings + task history (export/clear/stats).
• Adds background task logging and wires it into the executor to track steps/LLM calls/duration/outcome.
• Updates extension UI/layout for side panel usage with Task/History tabs and new history view.

Reviewed changes

Copilot reviewed 18 out of 18 changed files in this pull request and generated 8 comments.

Show a summary per file

File	Description
src/shared/storage.ts	New storage layer for persisted settings + task history + stats/export helpers.
src/popup/styles.css	Layout updates for full-height sidebar and styling for tabs/history UI.
src/popup/components/TaskInput.tsx	Loads/saves model selection to persisted settings.
src/popup/components/TaskHistory.tsx	New History tab UI (stats, list, export/clear).
src/popup/App.tsx	Adds tab navigation and renders Task vs History when idle.
src/background/task-logger.ts	New task logger that writes execution summaries to history storage.
src/background/index.ts	Opens the side panel when the extension action icon is clicked.
src/background/agents/executor.ts	Integrates task logging across task lifecycle, steps, and LLM calls.
manifest.json	Enables Side Panel usage and removes popup configuration.
USER_GUIDE.md	Documentation for the new sidebar, persistence, and history features.
QUICK_START.md	Quick-start guide updated for sidebar + history/persistence.
QUICK_ENHANCEMENTS.md	Adds/updates enhancement reference content.
IMPLEMENTATION_SUMMARY.md	Technical summary of the implementation and integration points.
ENHANCEMENT_SUMMARY.md	Enhancement analysis/roadmap documentation.
ENHANCEMENT_POINTS.md	Detailed enhancement catalog documentation.
CLAUDE.md	Project guide updates (architecture/dev guidelines).
CHANGES.md	High-level changelog for the new features.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

DEFAULT_SETTINGS.lastUpdated is set via Date.now() at module load time, so loadSettings() fallbacks (and resetSettings() if it writes this constant) can store/return a stale timestamp. Consider generating defaults with a function or cloning DEFAULT_SETTINGS and setting lastUpdated: Date.now() at the time you return/write defaults.

[Copilot]

resetSettings() writes DEFAULT_SETTINGS directly, which includes a lastUpdated timestamp captured at module initialization. Suggest spreading defaults and updating lastUpdated: Date.now() when resetting so the stored value reflects the actual reset time.

Suggested change

	await chrome.storage.local.set({ settings: DEFAULT_SETTINGS });
	const resetSettingsValue: UserSettings = {
	...DEFAULT_SETTINGS,
	lastUpdated: Date.now(),
	};
	await chrome.storage.local.set({ settings: resetSettingsValue });

[Copilot]

saveSettings({ modelId, visionMode: false, vlmModelId: 'small' }) will overwrite any existing persisted vision/VLM preferences on every submit. If only the LLM choice is user-configurable right now, consider saving just { modelId } (or merging with loaded settings) to avoid clobbering future/other settings.

Suggested change

	await saveSettings({ modelId, visionMode: false, vlmModelId: 'small' });
	let existingSettings: any = {};
	try {
	existingSettings = await loadSettings();
	} catch (loadError) {
	console.error('[TaskInput] Failed to load settings before save:', loadError);
	}
	await saveSettings({ ...existingSettings, modelId });

[Copilot]

When applying settings.modelId to the <select> value, consider validating it exists in AVAILABLE_LLM_MODELS. If a user upgrades from an older build (or a model ID is removed/renamed), an unknown value can leave the select in an invalid/blank state; falling back to DEFAULT_MODEL would avoid that.

Suggested change

	setModelId(settings.modelId);
	console.log('[TaskInput] Loaded saved model:', settings.modelId);
	const storedModelId = settings.modelId;
	const isValidModel = AVAILABLE_LLM_MODELS.some((model) => model.id === storedModelId);
	const effectiveModelId = isValidModel ? storedModelId : DEFAULT_MODEL;
	if (!isValidModel && storedModelId) {
	console.warn(
	'[TaskInput] Stored model ID not found in AVAILABLE_LLM_MODELS, falling back to DEFAULT_MODEL:',
	storedModelId
	);
	}
	setModelId(effectiveModelId);
	console.log('[TaskInput] Loaded saved model:', effectiveModelId);

[Copilot]

In the fail terminal-action replan path, taskLogger.recordLLMCall() is added but llmCallsRemaining isn't decremented (and there's no llmCallsRemaining > 0 guard). This makes LLM usage tracking inconsistent with other call sites and can let replans happen even when the per-task LLM budget is exhausted. Consider decrementing/guarding in the same way as the other replanning branches.

Suggested change

	if (replans < MAX_REPLANS) {
	replans++;
	if (replans < MAX_REPLANS && llmCallsRemaining > 0) {
	replans++;
	llmCallsRemaining--;

[Copilot]

endTaskFailure(error) is called here and then an error is thrown; the outer catch also calls endTaskFailure(...). Because TaskLogger.endTaskFailure() resets currentTask, this can produce noisy "No active task to end" warnings (and risks double-logging if TaskLogger behavior changes). Consider logging failure in only one place (e.g., centralize in catch, or track a flag to avoid duplicate calls).

Suggested change

await taskLogger.endTaskFailure(error);

[Copilot]

This catch unconditionally calls taskLogger.endTaskFailure(...). If the task was already finalized (e.g., failure handled earlier) or explicitly cancelled via taskLogger.cancelTask(), this results in extra warnings and makes it harder to reason about exactly-once history writes. Consider skipping when the task was already ended/cancelled (e.g., track completion state in Executor/TaskLogger).

[Copilot]

The history rows are clickable <div>s with onClick, but they aren't keyboard-accessible (no tabIndex, role, or Enter/Space handling). Consider rendering each row as a <button> (styled to match) or adding the appropriate ARIA role + keyboard handlers so users can navigate/expand items without a mouse.

[vedantagarwal-web]

Hi,
Thanks for your contribution! Kindly add a video in the pr description and also address all the code review bot suggestions if you haven't already.