Part 16: Browser Extension — Popup Companion on Any Tab

1. Dual-Mode Architecture: Web & Extension

Accelerated Logic AI is built with a unified dual-mode codebase. It functions both as a full-screen workstation and as a compact 420x600px Chrome extension popup window.

🌐 Full Web App

Full-screen workstation with expanded multi-pane sidebars, deep multi-agent workflow controls, and full Web Sandbox previews.

🧩 Extension Popup Companion

Compact mobile-responsive popup (?extension=true) for side-by-side documentation lookup and quick API debugging on any browser tab.

2. How Extension Mode Works

When triggered from the browser toolbar, the app receives the ?extension=true URL query parameter:

Auto-Collapsed Sidebar: The navigation sidebar defaults to a collapsed state to maximize message viewport width.
Direct Workspace Entry: Bypasses marketing landing flows and lands directly inside the active chat composer.
Optimized Touch & Density: Buttons and text fields adjust dynamically for high-density 420px popups.

3. Unpacked Extension Installation Guide

Open your browser extensions manager (chrome://extensions or edge://extensions).
Toggle Developer mode ON in the top-right corner.
Click Load unpacked and select your compiled production dist folder containing manifest.json.
Pin Accelerated Logic AI Chat Companion to your browser toolbar for 1-click access.

4. Side-by-Side Developer Workflows

Documentation Lookup Consult API docs on your main window while prompting skills in the companion popup simultaneously.

Localhost Debugging Inspect console stack traces on localhost and request code fixes without losing window focus.

Quick Article Summary Paste active page URLs directly into the popup for rapid web_fetch summaries.

5. Keyboard Shortcuts for Hands-Free Activation

Assign a global hotkey via chrome://extensions/shortcuts (e.g. Ctrl+Shift+K or Cmd+Shift+K) to instantly toggle the companion popup over any active web page.

6. Feature Matrix: Popup vs. Full Web App

Feature	Full Web App	Extension Popup
Layout Width	Full Browser Window	420px Compact Popup
Sidebar Default	Expanded (260px)	Collapsed Rail
Web Sandbox	Full Interactive Pane	Compact / Popout to Tab
Google Drive Sync	Cloud Sync Enabled	Cloud Sync Enabled (Drive Account)

7. Manifest V3 Security & Permissions

activeTab: Grants temporary access to active tab metadata only upon explicit user invocation.

storage: Enables browser local storage sync across sessions without requiring sensitive background network inspection.

8. Extension Troubleshooting

Manifest Missing Error? Verify that you selected the compiled dist folder rather than the repository root.

Chat History Sync: Enable Google Drive Sync in both contexts to seamlessly sync chat sessions across web and extension origins.