# LeadPilot — Navigation Architecture & Global Chrome

**Document Version:** 1.0.0 (Phase 3 UX Architecture Lock)  
**Status:** Approved & Formally Recorded  

---

## 1. Global Navigation Layout (Desktop)

The application chrome consists of a persistent left-hand **Sidebar** (240px width, collapsible to 64px icon-rail on tablet), a thin **Top Header Bar** (56px height) containing Workspace Switcher, Global Quick Search, and User Menu, and a fluid main content area.

```
+---------------------------------------------------------------------------------------------------+
| [Workspace Switcher: Apex Studio v] |  [Quick Search: Cmd+K]  |  [+ New Lead]  | [Alerts] [User v]|
+-------------------+-------------------------------------------------------------------------------+
| LEADPILOT         |                                                                               |
|                   |                                                                               |
|  * Dashboard      |                                                                               |
|                   |                                                                               |
|  ! Needs Attn (7) |                                                                               |
|                   |                                                                               |
|  # Lead Inbox     |                                                                               |
|                   |                                                                               |
|  || Pipeline      |                         MAIN WORKSPACE VIEWPORT                               |
|                   |                                                                               |
|  @ Follow-ups (3) |                                                                               |
|                   |                                                                               |
|  = Sequences      |                                                                               |
|                   |                                                                               |
|  + Sources        |                                                                               |
|                   |                                                                               |
|  % Analytics      |                                                                               |
|                   |                                                                               |
|  ---------------- |                                                                               |
|  * Settings       |                                                                               |
+-------------------+-------------------------------------------------------------------------------+
```

---

## 2. Navigation Item Hierarchy & Dynamic Badges

```
+---------------------------------------------------------------------------------------------------------------+
| NAV ITEM            | ROUTE                  | ICON CLASS   | DYNAMIC BADGE LOGIC        | ROLE VISIBILITY    |
+---------------------+------------------------+--------------+----------------------------+--------------------+
| **Dashboard**       | `/dashboard`           | `layout-grid`| (None)                     | All Roles          |
| **Needs Attention** | `/leads/needs-attention`| `alert-circle`| Count of unaddressed items | All Roles          |
|                     |                        |              | (Amber if >0, Red if >5)   |                    |
| **Lead Inbox**      | `/leads`               | `inbox`      | New leads count today (P0) | All Roles          |
| **Pipeline**        | `/pipeline`            | `kanban`     | (None)                     | All Roles          |
| **Follow-ups**      | `/follow-ups`          | `clock`      | Count of overdue tasks     | All Roles          |
| **Sequences**       | `/automation/sequences`| `git-branch` | (None)                     | Admin, Owner       |
| **Templates**       | `/automation/templates`| `file-text`  | (None)                     | All Roles          |
| **Sources**         | `/sources`             | `download`   | (None)                     | Admin, Owner       |
| **Analytics**       | `/analytics`           | `bar-chart`  | (None)                     | Admin, Owner       |
| **Settings**        | `/settings`            | `settings`   | Cron/License alert (Amber) | Admin, Owner       |
| **System Admin**    | `/admin`               | `shield`     | System health status       | Super Admin Only   |
+---------------------------------------------------------------------------------------------------------------+
```

---

## 3. Global Quick Search (`Cmd + K` / `Ctrl + K`)

Pressing `Cmd + K` opens an instant Alpine.js modal overlay searching across workspace entities with $< 50\text{ms}$ latency:

```
+-----------------------------------------------------------------------------------+
|  [ Search leads by name, email, phone, company...             ] [Esc to close]    |
+-----------------------------------------------------------------------------------+
|  LEADS & CONTACTS                                                                 |
|  * Priya Sharma  - Website Package ($12k) • [HOT 92] • Stage: Proposal            |
|  * Rajesh Patel  - Mobile App Discovery • [WARM 65] • Stage: Contacted            |
|  * Acme Corp     - Custom ERP Consultation • [COLD 40] • Stage: New               |
|                                                                                   |
|  QUICK ACTIONS                                                                    |
|  + Create New Lead (Press 'N')                                                    |
|  > View Follow-ups Due Today (3)                                                  |
|  > Open Attention Hub (7 items)                                                   |
+-----------------------------------------------------------------------------------+
```

---

## 4. Top Header & Action Controls

1. **Workspace Switcher (Top-Left):** Dropdown allowing users with access to multiple client workspaces (e.g. Agency Operators) to toggle context with a single click.
2. **Primary Quick Action (`+ New Lead`):** High-contrast button in top-right opening the fast 6-field Lead Creation modal from anywhere in the application. Keyboard shortcut: `N`.
3. **User Profile Dropdown (Top-Right):** Direct links to `My Profile`, `Notification Preferences`, `Switch Workspace`, and `Logout`.

---

## 5. Mobile & Small Screen Navigation (`< 768px`)

* **Bottom Navigation Bar (Mobile):** Replaces the desktop sidebar with a fixed 4-tab bottom touch bar:
  1. `Attention Hub` (with badge)
  2. `Lead Inbox`
  3. `Pipeline`
  4. `More...` (opens slide-up drawer for Follow-ups, Sources, Settings)
* **Floating Action Button (FAB):** Bottom-right floating `+` button for instant manual lead creation.