feat(site-blocklist): add site-specific blocklist with UI and sync storage support

Signed-off-by: samzong <[email protected]>

Author: samzong

docs/website-blocklist.md

@@ -0,0 +1,109 @@
+# Website Blocklist Design (Issue #67)
+
+## Context
+Users need a way to disable TabBoost content-script features on specific sites (e.g., DevTools, browser terminals) where global listeners conflict with critical workflows. Goal: configurable site blocklist without disabling the entire extension.
+
+## Goals
+- **Site-scoped opt-out**: Disable all content-script features (link preview, split-view, save intercept, notifications) on selected domains.
+- **Early evaluation**: Check blocklist before DOM listeners attach.
+- **Management UI**: Advanced Settings tab in options page for add/remove entries.
+- **Quick disable**: Popup button to add current site to blocklist.
+- **Sync storage**: Persist via `chrome.storage.sync` with quota limits and deduplication.
+
+## Non-goals
+- Per-feature toggles (MVP: all-or-nothing per site).
+- `chrome.commands` shortcuts remain global (not affected).
+- Dynamic permission or `declarativeNetRequest` changes.
+
+## UX Summary
+
+### Options Page - Advanced Settings Tab
+- New "Advanced Settings" tab with "Website Blocklist" card.
+- Empty list by default.
+- Add input accepts:
+  - Domain names: `example.com`, `www.example.com`, `sub.example.com`
+  - Wildcard patterns: `*.example.com` (matches `a.example.com`, `b.example.com`, etc.)
+  - Full URLs: protocol stripped during normalization
+- Inline delete button per entry.
+- Autosave on add/remove.
+
+### Extension Popup
+- "Disable on this site" button.
+- On click: extracts current tab domain, normalizes, adds to blocklist, shows notification.
+- Button state reflects blocked status.
+- Hidden on `chrome://` and extension pages.
+
+## Data Model
+```ts
+interface SiteBlocklistEntry {
+  id: string;
+  pattern: string;        // normalized lowercase
+  matchType: "domain" | "wildcard" | "prefix" | "regex";
+}
+
+interface SiteBlocklistConfig {
+  version: 1;
+  entries: SiteBlocklistEntry[];
+}
+```
+
+Storage:
+- `siteBlocklistConfig` (sync): main config
+- `siteBlocklistCompiled` (local): compiled matcher cache
+
+Default: `{ version: 1, entries: [] }`
+
+## Architecture
+
+### Site Matching (`src/utils/siteBlocklist.js`)
+New module:
+- **Normalize**: strip protocol, lowercase, hostname-only.
+- **Match types**:
+  - `*.example.com` → wildcard (matches `a.example.com`, `b.example.com`)
+  - `example.com` → domain (matches `example.com` and subdomains)
+  - Full URL with `/` → prefix
+  - `/regex/` → regex (with safety limits)
+- **Compile**: build matcher objects, expose `shouldBypass(url)`.
+- **Cache**: store compiled regexes in local storage.
+
+### Content Script (`src/js/contentScript.js`)
+1. Fetch blocklist config before attaching listeners.
+2. If `shouldBypass(window.location.href)`:
+   - Set `window.__tabboostDisabled = true`
+   - Abort initialization (minimal message handler only)
+3. Listen to `chrome.storage.onChanged` for updates; teardown if newly blocked.
+
+### Background (`src/js/background.js`)
+Message handlers:
+- `getSiteBlocklistConfig`: return current config
+- `setSiteBlocklistConfig`: validate, write to sync storage
+- `addSiteToBlocklist`: extract domain from tab, normalize, add entry
+- `isTabBlocked(tabUrl)`: check if URL matches blocklist
+
+### Options UI (`src/options/options.html/js`)
+- HTML: Advanced Settings tab with blocklist card (list, add input, delete buttons).
+- JS: Load config, validate/normalize patterns, autosave on changes, show errors.
+
+### Popup UI (`src/popup/popup.html/js`)
+- Check blocked status on open.
+- "Disable on this site" button: extract domain, send `addSiteToBlocklist` message.
+- Update button state after changes.
+
+### Localization
+New keys: `blocklistSectionTitle`, `blocklistAddPlaceholder`, `blocklistHelper`, `blocklistDuplicateError`, `blocklistInvalidPattern`, `popupDisableOnSite`, `popupEnableOnSite`, `popupSiteAddedToBlocklist`.
+
+## Edge Cases
+- Protocol-restricted pages (`chrome://`): short-circuit gracefully, hide popup button.
+- Quota limits: max 200 entries, deduplicate before save.
+- Regex safety: max 256 chars, wrap in try/catch.
+- Race conditions: use `await fetchSharedSyncValues` before listeners (top-level await or async IIFE).
+
+## Testing
+- Unit tests: pattern normalization, matching logic, wildcard/domain behavior.
+- Integration tests: content script initialization gating, popup flow.
+- Manual QA: add/remove entries, sync across profiles, teardown on mid-session changes.
+
+## Rollout
+1. Default empty list (no behavior change).
+2. Migration: backfill `{ version: 1, entries: [] }` for existing users.
+3. Update docs after verification.

src/_locales/de/messages.json

@@ -478,5 +478,65 @@
   "retryLoading": {
     "message": "Erneut laden",
     "description": "Button text to retry iframe loading."
+  },
+  "advancedSettings": {
+    "message": "Erweiterte Einstellungen",
+    "description": "Advanced settings tab title"
+  },
+  "blocklistSectionTitle": {
+    "message": "Website-Blockierungsliste",
+    "description": "Title for website blocklist section"
+  },
+  "blocklistSectionDescription": {
+    "message": "TabBoost-Funktionen auf bestimmten Websites deaktivieren",
+    "description": "Description for website blocklist section"
+  },
+  "blocklistAddPlaceholder": {
+    "message": "Domain eingeben (z.B. example.com, *.example.com)",
+    "description": "Placeholder for blocklist add input"
+  },
+  "blocklistAddButton": {
+    "message": "Hinzufügen",
+    "description": "Button to add domain to blocklist"
+  },
+  "blocklistDeleteButton": {
+    "message": "Löschen",
+    "description": "Button to delete domain from blocklist"
+  },
+  "blocklistHelper": {
+    "message": "Unterstützt exakte Domains, Platzhalter (*.example.com) und Unterdomains",
+    "description": "Helper text for blocklist input"
+  },
+  "blocklistDuplicateError": {
+    "message": "Diese Domain ist bereits in der Blockierungsliste",
+    "description": "Error message when domain already exists in blocklist"
+  },
+  "blocklistInvalidPattern": {
+    "message": "Ungültiges Domain-Muster",
+    "description": "Error message for invalid domain pattern"
+  },
+  "blocklistSaved": {
+    "message": "Blockierungsliste aktualisiert",
+    "description": "Success message when blocklist is saved"
+  },
+  "blocklistEmpty": {
+    "message": "Keine blockierten Websites. Fügen Sie oben Domains hinzu, um TabBoost auf bestimmten Websites zu deaktivieren.",
+    "description": "Message shown when blocklist is empty"
+  },
+  "popupDisableOnSite": {
+    "message": "Auf dieser Website deaktivieren",
+    "description": "Button to disable TabBoost on current site"
+  },
+  "popupEnableOnSite": {
+    "message": "Auf dieser Website aktivieren",
+    "description": "Button to enable TabBoost on current site"
+  },
+  "popupSiteAddedToBlocklist": {
+    "message": "Website zur Blockierungsliste hinzugefügt. Seite neu laden, um anzuwenden.",
+    "description": "Notification when site is added to blocklist from popup"
+  },
+  "popupSiteRemovedFromBlocklist": {
+    "message": "Website aus Blockierungsliste entfernt. Seite neu laden, um anzuwenden.",
+    "description": "Notification when site is removed from blocklist from popup"
   }
 }

src/_locales/en/messages.json

@@ -136,7 +136,7 @@
     "description": "Preview description"
   },
   "iframeCompatibility": {
-    "message": "Iframe Compatibility Settings",
+    "message": "Iframe Compatibility",
     "description": "Title for iframe compatibility settings tab"
   },
   "closeSplitView": {
@@ -164,7 +164,7 @@
     "description": "Notification when split view fails to load"
   },
   "generalSettings": {
-    "message": "General Settings",
+    "message": "General",
     "description": "General settings section title"
   },
   "browsingMode": {
@@ -196,7 +196,7 @@
     "description": "Description for the general settings section"
   },
   "viewModeSettings": {
-    "message": "View Mode Settings",
+    "message": "View Mode",
     "description": "Title for view mode settings tab"
   },
   "splitViewDescription": {
@@ -580,5 +580,65 @@
   "retryLoading": {
     "message": "Retry loading",
     "description": "Button text to retry iframe loading."
+  },
+  "advancedSettings": {
+    "message": "Advanced",
+    "description": "Advanced settings tab title"
+  },
+  "blocklistSectionTitle": {
+    "message": "Website Blocklist",
+    "description": "Title for website blocklist section"
+  },
+  "blocklistSectionDescription": {
+    "message": "Disable TabBoost features on specific websites",
+    "description": "Description for website blocklist section"
+  },
+  "blocklistAddPlaceholder": {
+    "message": "Enter domain (e.g., example.com, *.example.com)",
+    "description": "Placeholder for blocklist add input"
+  },
+  "blocklistAddButton": {
+    "message": "Add",
+    "description": "Button to add domain to blocklist"
+  },
+  "blocklistDeleteButton": {
+    "message": "Delete",
+    "description": "Button to delete domain from blocklist"
+  },
+  "blocklistHelper": {
+    "message": "Supports exact domains, wildcards (*.example.com), and subdomains",
+    "description": "Helper text for blocklist input"
+  },
+  "blocklistDuplicateError": {
+    "message": "This domain is already in the blocklist",
+    "description": "Error message when domain already exists in blocklist"
+  },
+  "blocklistInvalidPattern": {
+    "message": "Invalid domain pattern",
+    "description": "Error message for invalid domain pattern"
+  },
+  "blocklistSaved": {
+    "message": "Blocklist updated",
+    "description": "Success message when blocklist is saved"
+  },
+  "blocklistEmpty": {
+    "message": "No blocked sites. Add domains above to disable TabBoost on specific websites.",
+    "description": "Message shown when blocklist is empty"
+  },
+  "popupDisableOnSite": {
+    "message": "Disable on this site",
+    "description": "Button to disable TabBoost on current site"
+  },
+  "popupEnableOnSite": {
+    "message": "Enable on this site",
+    "description": "Button to enable TabBoost on current site"
+  },
+  "popupSiteAddedToBlocklist": {
+    "message": "Site added to blocklist. Reload page to apply.",
+    "description": "Notification when site is added to blocklist from popup"
+  },
+  "popupSiteRemovedFromBlocklist": {
+    "message": "Site removed from blocklist. Reload page to apply.",
+    "description": "Notification when site is removed from blocklist from popup"
   }
 }

src/_locales/es/messages.json

@@ -478,5 +478,65 @@
   "retryLoading": {
     "message": "Reintentar carga",
     "description": "Button text to retry iframe loading."
+  },
+  "advancedSettings": {
+    "message": "Avanzado Configuración",
+    "description": "Advanced settings tab title"
+  },
+  "blocklistSectionTitle": {
+    "message": "Lista de bloqueo de sitios web",
+    "description": "Title for website blocklist section"
+  },
+  "blocklistSectionDescription": {
+    "message": "Desactivar funciones de TabBoost en sitios web específicos",
+    "description": "Description for website blocklist section"
+  },
+  "blocklistAddPlaceholder": {
+    "message": "Ingresar dominio (ej: example.com, *.example.com)",
+    "description": "Placeholder for blocklist add input"
+  },
+  "blocklistAddButton": {
+    "message": "Agregar",
+    "description": "Button to add domain to blocklist"
+  },
+  "blocklistDeleteButton": {
+    "message": "Eliminar",
+    "description": "Button to delete domain from blocklist"
+  },
+  "blocklistHelper": {
+    "message": "Admite dominios exactos, comodines (*.example.com) y subdominios",
+    "description": "Helper text for blocklist input"
+  },
+  "blocklistDuplicateError": {
+    "message": "Este dominio ya está en la lista de bloqueo",
+    "description": "Error message when domain already exists in blocklist"
+  },
+  "blocklistInvalidPattern": {
+    "message": "Patrón de dominio inválido",
+    "description": "Error message for invalid domain pattern"
+  },
+  "blocklistSaved": {
+    "message": "Lista de bloqueo actualizada",
+    "description": "Success message when blocklist is saved"
+  },
+  "blocklistEmpty": {
+    "message": "No hay sitios bloqueados. Agregue dominios arriba para desactivar TabBoost en sitios web específicos.",
+    "description": "Message shown when blocklist is empty"
+  },
+  "popupDisableOnSite": {
+    "message": "Desactivar en este sitio",
+    "description": "Button to disable TabBoost on current site"
+  },
+  "popupEnableOnSite": {
+    "message": "Activar en este sitio",
+    "description": "Button to enable TabBoost on current site"
+  },
+  "popupSiteAddedToBlocklist": {
+    "message": "Sitio agregado a la lista de bloqueo. Recargue la página para aplicar.",
+    "description": "Notification when site is added to blocklist from popup"
+  },
+  "popupSiteRemovedFromBlocklist": {
+    "message": "Sitio eliminado de la lista de bloqueo. Recargue la página para aplicar.",
+    "description": "Notification when site is removed from blocklist from popup"
   }
 }