🏗️ Architecture: How to implement cross-platform auth sharing between Chrome ...

Date: 2026-02-26
Time: 23:19:42 UTC
Session: gspace1-149.3
Agent: angular
Confidence: 88%
Status: ✅ Documented

📋 Decision Context

Question:

How to implement cross-platform auth sharing between Chrome extension, web app, VSCode, desktop, and mobile?

Task: Session 149: Vitto AI ecosystem supercharge - Phase 3

🎯 Decision Made

Chosen:

Created VittoAuthSyncService in @auth-ui with 3 transport layers: BroadcastChannel (same-origin), CustomEvent (cross-origin via content script), and WebSocket (backend push). Added AUTH_PUSH handler to Chrome extension content script and pushAuthToAllTabs() in service worker. Added auth event broadcasting to command-center.gateway.ts. App component listens via VittoAuthSyncService.authReceived$.

Options Considered:

• No alternatives documented

💭 Reasoning

The auth gap (extension logged in but web app shows login form) is the most visible UX problem. Three transport layers provide redundancy: BroadcastChannel is instant for same-origin tabs, CustomEvent via content script bridges cross-origin, and WebSocket provides server-push for connected clients. The service-worker's processAuthSync() already runs on every auth change — adding pushAuthToAllTabs() there ensures reverse sync happens automatically without additional triggers.

📁 Files Involved

• libs/libs-ui/auth-ui/src/lib/services/auth-sync.service.ts
• APIs/backend-ai-api/src/app/command-center/command-center.gateway.ts
• apps/vitto-chrome-extension/content/inject.js
• apps/vitto-chrome-extension/background/service-worker.js
• apps/gograb-ai/src/app/app.component.ts

🔗 Related

• Decision ID: dev_1772147982349_360uspd
• Session: 149
• Workspace: gspace1

Auto-generated by MCP Smart Consolidation