# BAYAN — Complete Product, Codebase & Extension Deep Audit > **Audit Date:** 2026-06-26 > **Auditor Perspective:** Product Manager + Senior Frontend + Backend Architect + Extension Engineer + SaaS Reviewer --- ## 1. Current System Overview ### Architecture Map ``` ┌──────────────────────────────────────────────────────┐ │ BAYAN ECOSYSTEM │ │ │ │ ┌─────────┐ ┌──────────┐ ┌─────────────────┐ │ │ │ Website │───▶│ Flask API │───▶│ NLP Pipeline │ │ │ │ (SPA) │ │ (app.py) │ │ Spell/Gram/Punct│ │ │ └─────────┘ └──────────┘ └─────────────────┘ │ │ │ │ │ │ │ │ │ ┌─────────────────┐ │ │ │ ├─────────▶│ HF Models │ │ │ │ │ │ Summarization │ │ │ │ │ │ Grammar (Gradio)│ │ │ │ │ └─────────────────┘ │ │ │ │ │ │ ┌─────────┐ ┌──────────┐ ┌─────────────────┐ │ │ │Supabase │◀───│ Auth │───▶│ Documents DB │ │ │ │ (Cloud) │ │ Module │ │ Settings Sync │ │ │ └─────────┘ └──────────┘ └─────────────────┘ │ │ │ │ ┌────────────────────────────────────────────────┐ │ │ │ Chrome Extension (MV3) │ │ │ │ ┌──────────┐ ┌──────────┐ ┌───────────────┐ │ │ │ │ │ Content │ │Background│ │ Side Panel │ │ │ │ │ │ Script │ │ Worker │ │ + Popup │ │ │ │ │ └──────────┘ └──────────┘ └───────────────┘ │ │ │ └────────────────────────────────────────────────┘ │ └──────────────────────────────────────────────────────┘ ``` ### Technology Stack | Layer | Technology | Notes | |-------|-----------|-------| | **Frontend** | Vanilla JS, HTML, CSS (Tailwind CDN) | Custom `contenteditable` editor engine | | **Backend** | Flask (Python) | Single monolith `app.py` — 2,844 lines | | **NLP Pipeline** | Custom Python modules | Spelling, Grammar, Punctuation, Autocomplete, Dialect | | **AI Models** | Transformer-based | Summarization (local), Grammar (Gradio proxy), Spelling (CAMeL + custom) | | **Database** | Supabase (PostgreSQL) | Documents, profiles, user settings | | **Auth** | Supabase Auth | Guest (anonymous), Google OAuth | | **Deployment** | HuggingFace Spaces (Docker) | CPU-only free tier | | **Extension** | Chrome MV3 | Background SW, Content Script, Side Panel, Popup | ### File Structure Summary | Directory | Files | Purpose | |-----------|-------|---------| | `src/` | 6 core files | Backend + HTML + CSS | | `src/js/` | 8 JS files + 7 subdirs | Frontend logic | | `src/js/auth/` | 5 files | Supabase auth (client, session, UI) | | `src/js/documents/` | 4 files | Local doc management + export | | `src/js/documents-cloud/` | 3 files | Supabase CRUD for documents | | `src/js/sync/` | 3 files | Offline queue + conflict resolution | | `src/js/settings-sync/` | 2 files | User settings cloud persistence | | `src/nlp/` | 6 subdirs | All NLP processing modules | | `extension/` | 8 files + 4 subdirs | Chrome Extension | | `extension/shared/` | 9 files | Shared utilities (api, renderer, patches) | | `extension/sidepanel/` | 3 files | Side panel UI | | `tests/` | 16 test files | Backend unit tests | | `extension/tests/` | 8 files | Extension integration tests | --- ## 2. Feature Inventory ### Core AI Features | Feature | Backend API | Website Frontend | Extension | Files | |---------|------------|-----------------|-----------|-------| | **Spelling Correction** | ✅ `/api/spelling` + `/api/analyze` | ✅ Full (highlights, suggestions, apply) | ✅ Inline overlay + Popup + SidePanel | `nlp/spelling/`, `editor.js`, `renderer.js` | | **Grammar Correction** | ✅ `/api/grammar` + `/api/analyze` | ✅ Full (via Gradio proxy to HF model) | ✅ Inline overlay + Popup + SidePanel | `nlp/grammar/`, `hf_inference.py` | | **Punctuation** | ✅ `/api/punctuation` + `/api/analyze` | ✅ Full (PuncAra-v1 model) | ✅ Inline overlay + Popup + SidePanel | `nlp/punctuation/` | | **Summarization** | ✅ `/api/summarize` | ✅ Full (tab in editor, length control) | ✅ Popup tab + SidePanel tab | `model_loader.py`, `summaries-api.js` | | **AutoComplete** | ✅ `/api/autocomplete` | ✅ Ghost text + dropdown in editor | ⚠️ SidePanel text-box only, NO inline ghost text | `autocomplete.js`, sidepanel `btnAutocomplete` | | **Dialect→MSA** | ✅ `/api/dialect` | ✅ Dedicated editor tab | ✅ SidePanel tab (basic text→text) | `nlp/dialect/` | | **Quran Verification** | ✅ `/api/quran` | ✅ Dedicated editor tab | ✅ SidePanel tab (basic text→text) | `quran.py`, `quran_master.db` | ### Platform Features | Feature | Website | Extension (Popup) | Extension (SidePanel) | Extension (Content Script) | |---------|---------|-------------------|----------------------|--------------------------| | **Authentication** | ✅ Guest + Google | ❌ None | ⚠️ Partial (`initExtensionAuth()` exists but requires web page auth sync) | ⚠️ Listens for `BAYAN_AUTH_SYNC` message from web | | **Document Save** | ✅ Supabase CRUD | ❌ None | ⚠️ UI exists (`btnNewDocument`, `btnSaveSelection`) but depends on auth | ❌ None | | **Document Load/History** | ✅ Full panel | ❌ None | ⚠️ UI exists (`documentsList`, `historyList`) but depends on auth | ❌ None | | **Export (PDF/DOCX/TXT)** | ✅ Full (mammoth.js, docx.js) | ❌ None | ❌ None | ❌ None | | **Import (TXT/DOCX)** | ✅ Full | ❌ None | ❌ None | ❌ None | | **Settings Sync** | ✅ Supabase | ❌ None | ⚠️ Placeholder (`syncExtensionSettings()`) | ❌ None | | **Theme Toggle** | ✅ Full dark/light | ❌ Hardcoded dark | ✅ Dark only | N/A | | **Focus Mode** | ✅ Full | N/A | ❌ None | N/A | | **Score Ring** | ✅ Animated SVG | ✅ Simplified | ✅ Simplified | ❌ None | | **Writing Score History** | ✅ Sparkline chart | ❌ None | ❌ None | ❌ None | | **Error Donut Chart** | ✅ SVG donut | ❌ None | ❌ None | ❌ None | | **Offline Mode** | ✅ Graceful degradation | ❌ No offline handling | ❌ No offline handling | ❌ No offline handling | | **Keyboard Shortcuts** | ✅ Extensive (Alt+1-3, Ctrl+S, etc.) | ❌ None | ❌ None | ❌ None | --- ## 3. Website vs Extension Comparison ### Authentication Flow | Aspect | Website | Extension | Gap | |--------|---------|-----------|-----| | Guest login | ✅ `signInAnonymously()` | ❌ | **Critical** — extension users can't persist anything | | Google OAuth | ✅ `signInWithOAuth()` | ❌ | **High** | | Session restore | ✅ `restoreSession()` via Supabase | ❌ | **High** | | Auth state sync | ✅ `onAuthStateChange()` | ⚠️ Listens for `BAYAN_AUTH_SYNC` postMessage but only works when user visits Bayan website with extension installed | **High** — unreliable | | Auth-gated features | ✅ Documents, sync, settings | ⚠️ UI elements exist but non-functional without auth | **High** | ### AI Feature Comparison | Feature | Website UX | Extension UX | Parity? | |---------|-----------|-------------|---------| | Analyze (S+G+P) | Rich editor with inline highlights, suggestion sidebar, popover tooltip, apply/dismiss per-suggestion | **Content Script:** Overlay marks + tooltip. **Popup/SidePanel:** Textarea + suggestion cards | ⚠️ Functional but UX gap | | Summarize | Editor tab with radio buttons (short/medium/long) | Popup/SidePanel textarea with radio buttons | ✅ Near parity | | AutoComplete | **Ghost text** inside editor (Tab to accept) | SidePanel has a text box with "إكمال" button but NO inline ghost text on 3rd party sites | **Medium** — missing the core UX | | Dialect | Dedicated editor tab with "Convert" button | SidePanel tab with text box and "Convert" button | ✅ Near parity | | Quran | Dedicated editor tab with search | SidePanel tab with text box and search | ✅ Near parity | ### Documents | Aspect | Website | Extension | Gap | |--------|---------|-----------|-----| | Create document | ✅ `createDocument()` | ⚠️ Button exists in SidePanel but blocked by no auth | **High** | | List documents | ✅ Desktop sidebar panel | ⚠️ `documentsList` in SidePanel workspace tab, blocked by no auth | **High** | | Save/auto-save | ✅ Debounced sync via `SyncManager` | ❌ | **High** | | Export PDF/DOCX | ✅ `export.js` | ❌ | **Medium** | | Import | ✅ `import.js` (TXT, DOCX) | ❌ | **Low** | --- ## 4. Missing Features ### Critical (Blocks Production) | # | Issue | Impact | Solution | |---|-------|--------|----------| | C1 | **`.env` file committed to Git** | Supabase URL and anon key are in the repo. While anon key is safe for client use, this is a security anti-pattern and may expose the project URL. | Remove `.env` from Git history, use HF Spaces secrets exclusively. `.gitignore` has `.env` but it was committed before the rule was added. | | C2 | **CORS wildcard `origins: "*"`** | Any website can call `/api/analyze`, `/api/summarize`, etc. directly. Abusers can drain compute. | Restrict CORS to `bayan10-bayan-api.hf.space` + extension origin `chrome-extension://`. | | C3 | **No rate limiting on API** | No throttle on any endpoint. A single user can overwhelm the free-tier HF Space. | Add Flask-Limiter or simple in-memory token bucket. | ### High (Important Feature Gap) | # | Issue | Impact | Solution | |---|-------|--------|----------| | H1 | Extension has no auth | Users cannot access cloud docs, settings, or history from extension | Implement Supabase auth in extension via `chrome.identity` or shared session from Bayan website | | H2 | Extension content script lacks AutoComplete ghost text | The flagship "ghost text" feature doesn't work on 3rd-party sites | Port `autocomplete.js` logic into `content-inline.js` with `/api/autocomplete` calls | | H3 | Extension popup/sidepanel have no export | Users cannot export corrected text as PDF/DOCX | Add "Copy as formatted text" or lightweight export | | H4 | No `documents` table migration | `supabase/migrations/001_profiles.sql` exists but no migration creates the `documents` table that `documents-api.js` uses | Create `002_documents.sql` migration | | H5 | Backend monolith: `app.py` is 2,844 lines | Extremely difficult to maintain, test, or extend | Split into `routes/`, `services/`, `middleware/` modules | ### Medium (Improvement Needed) | # | Issue | Impact | Solution | |---|-------|--------|----------| | M1 | `src/js/api.js` uses ES module `export` syntax but is loaded via `