no-mistakes(document): Docs synced for Cancelled status; lint cleaned

- Add Cancelled as terminal status reachable from all active states; exclude
  from SLA breach reporting and dashboard active counts; add to status pickers
- Persist customer phone on ticket create/update (was silently dropped);
  add tickets.phone migration + legacy self-heal guard
- Add admin-only DELETE /api/tickets/{id} (removes timeline/photos/escalations)
- Add GET /api/auth/users for the assign-technician dropdown (was hardcoded)
- TicketOut now returns nested unit/category so the detail page stops showing
  '—' for Unit/Property/Category
- Ticket numbering uses max+1 so deletions never re-issue a number
- New-issue form: require Category and (standard mode) Priority client-side
- Tests: 11 new cases covering cancellation, SLA exemption, phone, delete,
  users endpoint, numbering

.gitignore

@@ -6,6 +6,7 @@ __pycache__/
 .venv/
 uploads/
 test_*.py
+!tests/test_*.py
 venv/
 *.egg-info/
 dist/

AGENTS.md

@@ -22,6 +22,7 @@ app/
 ├── services/      # Business logic (auth, seed, ticket, sla)
 └── routers/       # FastAPI route handlers
 alembic/           # Database migrations
+tests/             # pytest suite; conftest.py swaps DATABASE_URL to a temp SQLite
 uploads/           # Photo uploads (created at runtime)
 ```
 
@@ -29,6 +30,7 @@ uploads/           # Photo uploads (created at runtime)
 
 - `alembic upgrade head` — apply migrations
 - `alembic revision --autogenerate -m "msg"` — new migration
+- `pytest` — run the API test suite (tests/; pagination contract anchored in tests/test_tickets_pagination.py)
 
 ## Seed data
 
@@ -37,7 +39,7 @@ Users, units, and categories are auto-seeded on first startup via lifespan hook:
 - 120 apartment units (East/West, 10 floors × 6 apts per wing)
 - Default password for all seed users: `denya123`
 - Units load from `apartment_mapping.json` if present, else built-in fallback
-- Categories: 20 top-level (10 Maintenance, 6 CS, 4 Emergency) with sub-categories, seeded from `app/services/seed.py::SEED_CATEGORIES_DATA`
+- Categories: 23 top-level (13 Maintenance, 6 CS, 4 Emergency) with sub-categories, seeded from `app/services/seed.py::SEED_CATEGORIES_DATA`
 
 ## Key API endpoints
 
@@ -50,6 +52,7 @@ Users, units, and categories are auto-seeded on first startup via lifespan hook:
 | POST | `/api/auth/refresh` | Token | Refresh tokens |
 | GET | `/api/auth/me` | Bearer | Current user |
 | GET | `/api/auth/admin-only` | Admin/Jerome, Admin/Wahab | RBAC demo endpoint |
+| GET | `/api/auth/users` | Bearer | List users (id, name, role) for the assign-technician picker |
 | POST | `/api/whatsapp/mock` | No | Mock WhatsApp |
 | GET | `/api/whatsapp/mock-log` | No | Recent mock submissions |
 
@@ -70,15 +73,17 @@ Frontend: Alpine.js (CDN) + Tailwind CSS (CDN). Auth state in localStorage. Role
 | Method | Path | Auth | Description |
 |--------|------|------|-------------|
 | POST | `/api/tickets` | Bearer | Create ticket (auto-number PAV-YYYY-NNNNN) |
-| GET | `/api/tickets` | No | List tickets (filter: status, priority, property, category_id, assigned_to, date_from, date_to) |
-| GET | `/api/tickets/{id}` | No | Get ticket detail with timeline, photos, SLA status |
-| PATCH | `/api/tickets/{id}` | Bearer | Update ticket (validates status transitions) |
+| GET | `/api/tickets` | No | List tickets (filter: status, priority, property, building, unit_id, category_id, assigned_to, date_from, date_to) |
+| GET | `/api/tickets/{id}` | No | Get ticket detail with timeline, photos, SLA status, nested unit/category, phone |
+| GET | `/api/tickets/{id}/transitions` | No | Valid next statuses for the ticket's current status (drives the detail-page status picker) |
+| PATCH | `/api/tickets/{id}` | Bearer | Update ticket (validates status transitions; assigning a technician auto-advances New/Logged/Triage to Assigned) |
+| DELETE | `/api/tickets/{id}` | Admin/Jerome, Admin/Wahab | Delete ticket + children (timeline/photos/escalations); test/scratch cleanup only |
 | POST | `/api/tickets/{id}/status` | Bearer | Change status with note |
 | GET | `/api/tickets/{id}/sla` | No | Check SLA breach status |
 | POST | `/api/tickets/{id}/photos` | Bearer | Upload photos (multipart, is_before param) |
 | GET | `/api/tickets/{id}/photos` | No | List photos |
-| GET | `/api/tickets/categories` | No | Category tree (optional `?type=` filter) |
-| GET | `/api/tickets/categories/flat` | No | Flat category list |
+| GET | `/api/tickets/categories` | No | Category tree (filters: `type`; alert-only hidden unless `include_hidden=true`) |
+| GET | `/api/tickets/categories/flat` | No | Flat category list (same `type`/`include_hidden` filters) |
 
 ## Auth
 
@@ -89,8 +94,11 @@ Frontend: Alpine.js (CDN) + Tailwind CSS (CDN). Auth state in localStorage. Role
 
 ## Ticket System (Sprint 2)
 
-### Status Lifecycle (15 statuses)
-New → Logged → Triage → Assigned → Accepted → Travelling → On Site → In Progress → Waiting Parts → Escalated → Completed → On-Field Verification → Wahab Review → Closed → Reopened
+### Status Lifecycle (16 statuses)
+New → Logged → Triage → Assigned → Accepted → Travelling → On Site → In Progress → Waiting Parts → Escalated → Completed → On-Field Verification → Wahab Review → Closed → Reopened → Cancelled
+
+Cancelled is terminal (no outgoing transitions) and reachable from any active
+state; it is excluded from SLA breach reporting and dashboard "active" counts.
 
 Valid transitions defined in `app/services/ticket.py::VALID_TRANSITIONS`. Invalid transitions return 400.
 
@@ -114,6 +122,23 @@ Stored under `uploads/` with UUID filenames. Static-files mounted at `/uploads/`
 SQLite via aiosqlite with async SQLAlchemy 2.0. Alembic for migrations.
 Tables: users, units, categories, tickets, ticket_timeline, ticket_photos, escalations, whatsapp_log
 
+## Categories & location (Sprint A)
+
+- `Category.show_in_form` (default True) marks alert-only categories: `Gas Leak` is hidden
+  from the issue picker but keeps `sla_urgency="urgent"` for SLA/alert/reporting. Pickers
+  (`/api/tickets/categories[/flat]`) exclude them unless `include_hidden=true` (used by the
+  emergency quick path on `tickets/new.html`). Seed taxonomy lives in `app/services/seed.py`
+  (`SEED_CATEGORIES_DATA`); the Lost Property → Missing Item rename is a data migration
+  (alembic `b2f4a6c8e0d2`), with a startup self-heal (`app/main.py::ensure_legacy_schema`)
+  applying the same column/rename fix to legacy create_all databases. Seeds are idempotent
+  and sync `show_in_form` on existing rows.
+- Location hierarchy is Property → Building → Apartment (uses `Unit.building`).
+  `GET /api/tickets/units/grouped` returns `{property: {building: [units]}}`;
+  `/api/tickets` accepts additive `building`/`unit_id` filters. Unit data is deterministic
+  from the committed `apartment_mapping.json` (built-in fallback in `seed.py`).
+- Priority grouping ("Group by priority") is client-side via `app().groupByPriority()` in
+  `app/templates/base.html`; used by `tickets/list.html` and `dashboard/fm.html`.
+
 ## Maintaining this file
 
 Keep this file for knowledge useful to almost every future agent session in this project.

PRD.md

@@ -120,7 +120,7 @@ Close Ticket
 Archive → Executive Reporting
 ```
 
-### Detailed Ticket Lifecycle (15 Statuses)
+### Detailed Ticket Lifecycle (16 Statuses)
 
 | # | Status | Description | Who Sets |
 |---|--------|-------------|----------|
@@ -139,6 +139,7 @@ Archive → Executive Reporting
 | 13 | **Wahab Review** | Final QA oversight and closure approval | Wahab |
 | 14 | **Closed** | Ticket officially closed | Wahab / Nicholas |
 | 15 | **Reopened** | Issue resurfaces within 7 days | Agent / System |
+| 16 | **Cancelled** | Ticket withdrawn (test/scratch cleanup, guest no-show); terminal — reachable from any active state, excluded from SLA breach reporting and dashboard active counts | Any staff (via dashboard) |
 
 
 ### Step-by-Step Detail
@@ -154,9 +155,10 @@ Archive → Executive Reporting
 9. **Wahab Review** — Wahab does final QA oversight in dashboard → status → Wahab Review → approves or sends back
 10. **Auto Follow-up** (48 hours later — internal only) — System flags ticket for Wahab/Nicholas: `Issue PAV-001 (505E WC) — resolved 48h ago. Any follow-up needed?` → If issue resurfaces → auto-reopens, escalates to Ama
 
-### Reopening & Reassignment
+### Reopening, Reassignment & Cancellation
 
 - **Reopening:** If a verified-closed issue resurfaces within 7 days, the gatekeeper can Reopen it. A reopened issue auto-escalates to Ama.
+- **Cancellation:** Any ticket can be cancelled from an active state (terminal; cannot resume work). Cancelled tickets are excluded from SLA breach reporting and dashboard active counts.
 - **Reassignment:** A technician who cannot complete a job can request: `#reassign PAV-001 [technician name]` → Nicholas receives notification and approves/reassigns in dashboard.
 
 ---

alembic/versions/b2f4a6c8e0d2_category_show_in_form_and_missing_item_rename.py

@@ -0,0 +1,60 @@
+"""category show_in_form column + Lost Property → Missing Item rename
+
+Revision ID: b2f4a6c8e0d2
+Revises: 795c6b95f637
+Create Date: 2026-08-02 00:00:00.000000
+
+Sprint A (Wahab feedback batch): one schema change + one data rename.
+
+* Add ``categories.show_in_form`` (bool, default True) and backfill existing
+  rows to True; flip Gas Leak to False (alert-only: still urgent for SLA/alert
+  and reporting, but hidden from the new-issue category picker).
+* Rename the Customer Service category ``Lost Property`` → ``Missing Item``.
+  The seed is insert-if-missing, so without this data migration an existing
+  database would keep the old row and the seed would create a duplicate.
+"""
+from typing import Sequence, Union
+
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision: str = 'b2f4a6c8e0d2'
+down_revision: Union[str, Sequence[str], None] = '795c6b95f637'
+branch_labels: Union[str, Sequence[str], None] = None
+depends_on: Union[str, Sequence[str], None] = None
+
+
+def upgrade() -> None:
+    """Add show_in_form, backfill True, hide Gas Leak, rename Lost Property."""
+    op.add_column(
+        'categories',
+        sa.Column(
+            'show_in_form',
+            sa.Boolean(),
+            nullable=False,
+            server_default=sa.true(),
+            comment='Visible in the new-issue category picker (False = alert-only, e.g. Gas Leak)',
+        ),
+    )
+    # Backfill: Gas Leak stays in the SLA/alert table (urgent) but is hidden
+    # from the new-issue picker.
+    op.execute(
+        "UPDATE categories SET show_in_form = 0 "
+        "WHERE type = 'emergency' AND name = 'Gas Leak' AND parent_id IS NULL"
+    )
+    # Rename Lost Property → Missing Item (data migration; seed is insert-if-missing).
+    op.execute(
+        "UPDATE categories SET name = 'Missing Item' "
+        "WHERE type = 'cs' AND name = 'Lost Property'"
+    )
+
+
+def downgrade() -> None:
+    """Reverse the rename and drop the column."""
+    op.execute(
+        "UPDATE categories SET name = 'Lost Property' "
+        "WHERE type = 'cs' AND name = 'Missing Item'"
+    )
+    op.drop_column('categories', 'show_in_form')

alembic/versions/c4e8f1a2d3b4_tickets_phone_and_cancelled_status.py

@@ -0,0 +1,40 @@
+"""tickets.phone column + Cancelled status support
+
+Revision ID: c4e8f1a2d3b4
+Revises: b2f4a6c8e0d2
+Create Date: 2026-08-02 00:00:00.000000
+
+Demo-prep batch (Wahab review): one schema change.
+
+* Add ``tickets.phone`` (nullable) so the customer phone collected on the
+  new-issue form is actually persisted instead of silently dropped.
+"""
+from typing import Sequence, Union
+
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision: str = 'c4e8f1a2d3b4'
+down_revision: Union[str, Sequence[str], None] = 'b2f4a6c8e0d2'
+branch_labels: Union[str, Sequence[str], None] = None
+depends_on: Union[str, Sequence[str], None] = None
+
+
+def upgrade() -> None:
+    """Add tickets.phone (nullable)."""
+    op.add_column(
+        'tickets',
+        sa.Column(
+            'phone',
+            sa.String(length=50),
+            nullable=True,
+            comment='Customer contact phone (captured on the new-issue form)',
+        ),
+    )
+
+
+def downgrade() -> None:
+    """Drop tickets.phone."""
+    op.drop_column('tickets', 'phone')

apartment_mapping.json

@@ -0,0 +1,726 @@
+{
+  "version": 1,
+  "property": "Pavilion Accra",
+  "units": [
+    {
+      "apartment_code": "011E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 1
+    },
+    {
+      "apartment_code": "012E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 1
+    },
+    {
+      "apartment_code": "013E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 1
+    },
+    {
+      "apartment_code": "014E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 1
+    },
+    {
+      "apartment_code": "015E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 1
+    },
+    {
+      "apartment_code": "016E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 1
+    },
+    {
+      "apartment_code": "021E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 2
+    },
+    {
+      "apartment_code": "022E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 2
+    },
+    {
+      "apartment_code": "023E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 2
+    },
+    {
+      "apartment_code": "024E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 2
+    },
+    {
+      "apartment_code": "025E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 2
+    },
+    {
+      "apartment_code": "026E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 2
+    },
+    {
+      "apartment_code": "031E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 3
+    },
+    {
+      "apartment_code": "032E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 3
+    },
+    {
+      "apartment_code": "033E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 3
+    },
+    {
+      "apartment_code": "034E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 3
+    },
+    {
+      "apartment_code": "035E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 3
+    },
+    {
+      "apartment_code": "036E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 3
+    },
+    {
+      "apartment_code": "041E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 4
+    },
+    {
+      "apartment_code": "042E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 4
+    },
+    {
+      "apartment_code": "043E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 4
+    },
+    {
+      "apartment_code": "044E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 4
+    },
+    {
+      "apartment_code": "045E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 4
+    },
+    {
+      "apartment_code": "046E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 4
+    },
+    {
+      "apartment_code": "051E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 5
+    },
+    {
+      "apartment_code": "052E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 5
+    },
+    {
+      "apartment_code": "053E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 5
+    },
+    {
+      "apartment_code": "054E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 5
+    },
+    {
+      "apartment_code": "055E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 5
+    },
+    {
+      "apartment_code": "056E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 5
+    },
+    {
+      "apartment_code": "061E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 6
+    },
+    {
+      "apartment_code": "062E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 6
+    },
+    {
+      "apartment_code": "063E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 6
+    },
+    {
+      "apartment_code": "064E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 6
+    },
+    {
+      "apartment_code": "065E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 6
+    },
+    {
+      "apartment_code": "066E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 6
+    },
+    {
+      "apartment_code": "071E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 7
+    },
+    {
+      "apartment_code": "072E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 7
+    },
+    {
+      "apartment_code": "073E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 7
+    },
+    {
+      "apartment_code": "074E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 7
+    },
+    {
+      "apartment_code": "075E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 7
+    },
+    {
+      "apartment_code": "076E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 7
+    },
+    {
+      "apartment_code": "081E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 8
+    },
+    {
+      "apartment_code": "082E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 8
+    },
+    {
+      "apartment_code": "083E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 8
+    },
+    {
+      "apartment_code": "084E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 8
+    },
+    {
+      "apartment_code": "085E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 8
+    },
+    {
+      "apartment_code": "086E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 8
+    },
+    {
+      "apartment_code": "091E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 9
+    },
+    {
+      "apartment_code": "092E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 9
+    },
+    {
+      "apartment_code": "093E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 9
+    },
+    {
+      "apartment_code": "094E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 9
+    },
+    {
+      "apartment_code": "095E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 9
+    },
+    {
+      "apartment_code": "096E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 9
+    },
+    {
+      "apartment_code": "101E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 10
+    },
+    {
+      "apartment_code": "102E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 10
+    },
+    {
+      "apartment_code": "103E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 10
+    },
+    {
+      "apartment_code": "104E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 10
+    },
+    {
+      "apartment_code": "105E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 10
+    },
+    {
+      "apartment_code": "106E",
+      "property": "East",
+      "building": "Pavilion East",
+      "floor": 10
+    },
+    {
+      "apartment_code": "011W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 1
+    },
+    {
+      "apartment_code": "012W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 1
+    },
+    {
+      "apartment_code": "013W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 1
+    },
+    {
+      "apartment_code": "014W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 1
+    },
+    {
+      "apartment_code": "015W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 1
+    },
+    {
+      "apartment_code": "016W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 1
+    },
+    {
+      "apartment_code": "021W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 2
+    },
+    {
+      "apartment_code": "022W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 2
+    },
+    {
+      "apartment_code": "023W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 2
+    },
+    {
+      "apartment_code": "024W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 2
+    },
+    {
+      "apartment_code": "025W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 2
+    },
+    {
+      "apartment_code": "026W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 2
+    },
+    {
+      "apartment_code": "031W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 3
+    },
+    {
+      "apartment_code": "032W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 3
+    },
+    {
+      "apartment_code": "033W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 3
+    },
+    {
+      "apartment_code": "034W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 3
+    },
+    {
+      "apartment_code": "035W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 3
+    },
+    {
+      "apartment_code": "036W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 3
+    },
+    {
+      "apartment_code": "041W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 4
+    },
+    {
+      "apartment_code": "042W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 4
+    },
+    {
+      "apartment_code": "043W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 4
+    },
+    {
+      "apartment_code": "044W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 4
+    },
+    {
+      "apartment_code": "045W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 4
+    },
+    {
+      "apartment_code": "046W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 4
+    },
+    {
+      "apartment_code": "051W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 5
+    },
+    {
+      "apartment_code": "052W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 5
+    },
+    {
+      "apartment_code": "053W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 5
+    },
+    {
+      "apartment_code": "054W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 5
+    },
+    {
+      "apartment_code": "055W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 5
+    },
+    {
+      "apartment_code": "056W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 5
+    },
+    {
+      "apartment_code": "061W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 6
+    },
+    {
+      "apartment_code": "062W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 6
+    },
+    {
+      "apartment_code": "063W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 6
+    },
+    {
+      "apartment_code": "064W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 6
+    },
+    {
+      "apartment_code": "065W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 6
+    },
+    {
+      "apartment_code": "066W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 6
+    },
+    {
+      "apartment_code": "071W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 7
+    },
+    {
+      "apartment_code": "072W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 7
+    },
+    {
+      "apartment_code": "073W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 7
+    },
+    {
+      "apartment_code": "074W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 7
+    },
+    {
+      "apartment_code": "075W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 7
+    },
+    {
+      "apartment_code": "076W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 7
+    },
+    {
+      "apartment_code": "081W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 8
+    },
+    {
+      "apartment_code": "082W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 8
+    },
+    {
+      "apartment_code": "083W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 8
+    },
+    {
+      "apartment_code": "084W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 8
+    },
+    {
+      "apartment_code": "085W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 8
+    },
+    {
+      "apartment_code": "086W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 8
+    },
+    {
+      "apartment_code": "091W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 9
+    },
+    {
+      "apartment_code": "092W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 9
+    },
+    {
+      "apartment_code": "093W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 9
+    },
+    {
+      "apartment_code": "094W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 9
+    },
+    {
+      "apartment_code": "095W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 9
+    },
+    {
+      "apartment_code": "096W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 9
+    },
+    {
+      "apartment_code": "101W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 10
+    },
+    {
+      "apartment_code": "102W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 10
+    },
+    {
+      "apartment_code": "103W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 10
+    },
+    {
+      "apartment_code": "104W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 10
+    },
+    {
+      "apartment_code": "105W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 10
+    },
+    {
+      "apartment_code": "106W",
+      "property": "West",
+      "building": "Pavilion West",
+      "floor": 10
+    }
+  ]
+}

app/core/config.py

@@ -31,6 +31,12 @@ class Settings(BaseSettings):
     # ── CORS ─────────────────────────────────────────────────────────
     CORS_ORIGINS: str = "*"
 
+    # ── WhatsApp ─────────────────────────────────────────────────────
+    WHATSAPP_PHONE_NUMBER_ID: str = ""
+    WHATSAPP_ACCESS_TOKEN: str = ""
+    WHATSAPP_VERIFY_TOKEN: str = ""
+    META_GRAPH_BASE: str = "https://graph.facebook.com/v18.0"
+
     # ── Paths ────────────────────────────────────────────────────────
     BASE_DIR: Path = Path(__file__).resolve().parent.parent.parent
 

app/core/security.py

@@ -3,7 +3,6 @@
 from __future__ import annotations
 
 from datetime import datetime, timedelta, timezone
-from functools import wraps
 from typing import Annotated, Any, Callable
 
 import bcrypt

app/main.py

@@ -9,6 +9,7 @@ from pathlib import Path
 from fastapi import FastAPI
 from fastapi.middleware.cors import CORSMiddleware
 from fastapi.staticfiles import StaticFiles
+from sqlalchemy import text
 
 from app.core.config import settings
 from app.core.database import Base, async_session_factory, engine
@@ -18,12 +19,44 @@ from app.services.seed import seed_categories, seed_units, seed_users
 logger = logging.getLogger(__name__)
 
 
+async def ensure_legacy_schema(conn) -> None:
+    """Add columns/data changes from alembic migrations that legacy create_all databases lack."""
+    result = await conn.execute(text("PRAGMA table_info(categories)"))
+    columns = {row[1] for row in result}
+    if "show_in_form" not in columns:
+        await conn.execute(
+            text("ALTER TABLE categories ADD COLUMN show_in_form BOOLEAN NOT NULL DEFAULT 1")
+        )
+        logger.info("Added missing categories.show_in_form column (legacy database)")
+
+    result = await conn.execute(text("SELECT name FROM sqlite_master WHERE type='table' AND name='tickets'"))
+    if result.scalar():
+        result = await conn.execute(text("PRAGMA table_info(tickets)"))
+        ticket_columns = {row[1] for row in result}
+        if "phone" not in ticket_columns:
+            await conn.execute(
+                text("ALTER TABLE tickets ADD COLUMN phone VARCHAR(50)")
+            )
+            logger.info("Added missing tickets.phone column (legacy database)")
+    result = await conn.execute(
+        text(
+            "UPDATE categories SET name = 'Missing Item' "
+            "WHERE type = 'cs' AND name = 'Lost Property' AND parent_id IS NULL "
+            "AND NOT EXISTS (SELECT 1 FROM categories c2 "
+            "WHERE c2.type = 'cs' AND c2.name = 'Missing Item' AND c2.parent_id IS NULL)"
+        )
+    )
+    if result.rowcount:
+        logger.info("Renamed legacy 'Lost Property' category to 'Missing Item'")
+
+
 @asynccontextmanager
 async def lifespan(app: FastAPI):
     """Initialise database and seed data on startup."""
     logger.info("Starting Denya OneCare …")
     async with engine.begin() as conn:
         await conn.run_sync(Base.metadata.create_all)
+        await ensure_legacy_schema(conn)
     async with async_session_factory() as session:
         await seed_users(session)
         await session.commit()

app/models/category.py

@@ -2,7 +2,7 @@
 
 from __future__ import annotations
 
-from sqlalchemy import ForeignKey, Integer, String
+from sqlalchemy import Boolean, ForeignKey, Integer, String, true
 from sqlalchemy.orm import Mapped, mapped_column, relationship
 
 from app.core.database import Base
@@ -28,6 +28,13 @@ class Category(Base):
         nullable=True,
         comment="urgent, high, medium, low",
     )
+    show_in_form: Mapped[bool] = mapped_column(
+        Boolean,
+        nullable=False,
+        default=True,
+        server_default=true(),
+        comment="Visible in the new-issue category picker (False = alert-only, e.g. Gas Leak)",
+    )
 
     # self-referencing relationship
     children: Mapped[list[Category]] = relationship("Category", back_populates="parent", cascade="all, delete-orphan")

app/models/ticket.py

@@ -29,7 +29,7 @@ class Ticket(Base):
         comment=(
             "New, Logged, Triage, Assigned, Accepted, Travelling, On Site, "
             "In Progress, Waiting Parts, Escalated, Completed, "
-            "On-Field Verification, Wahab Review, Closed, Reopened"
+            "On-Field Verification, Wahab Review, Closed, Reopened, Cancelled"
         ),
     )
     unit_id: Mapped[int | None] = mapped_column(Integer, ForeignKey("units.id"), nullable=True)
@@ -40,6 +40,7 @@ class Ticket(Base):
         comment="urgent, high, medium, low",
     )
     reporter: Mapped[str | None] = mapped_column(String(255), nullable=True)
+    phone: Mapped[str | None] = mapped_column(String(50), nullable=True)
     reported_via: Mapped[str | None] = mapped_column(
         String(20),
         nullable=True,
@@ -70,6 +71,10 @@ class Ticket(Base):
     photos = relationship("TicketPhoto", back_populates="ticket")
     escalations = relationship("Escalation", back_populates="ticket")
 
+    @property
+    def assigned_technician_name(self) -> str | None:
+        return self.assigned_technician.full_name if self.assigned_technician else None
+
     def __repr__(self) -> str:
         return f"<Ticket {self.ticket_number} ({self.status})>"
 

app/models/whatsapp_log.py

@@ -1,4 +1,4 @@
-"""WhatsApp log model for mock endpoint."""
+"""WhatsApp log model for inbound webhook messages."""
 
 from __future__ import annotations
 
@@ -14,10 +14,12 @@ class WhatsAppLog(Base):
     __tablename__ = "whatsapp_log"
 
     id: Mapped[int] = mapped_column(primary_key=True, autoincrement=True)
-    command: Mapped[str] = mapped_column(Text, nullable=False)
-    from_number: Mapped[str | None] = mapped_column(String(50), nullable=True)
+    from_number: Mapped[str] = mapped_column(String(50), nullable=False)
+    message_text: Mapped[str] = mapped_column(Text, nullable=False)
+    wa_message_id: Mapped[str | None] = mapped_column(String(100), nullable=True)
     ticket_id: Mapped[int | None] = mapped_column(Integer, nullable=True)
+    ticket_number: Mapped[str | None] = mapped_column(String(30), nullable=True)
     received_at: Mapped[datetime] = mapped_column(DateTime, nullable=False)
 
     def __repr__(self) -> str:
-        return f"<WhatsAppLog {self.id}: {self.command[:50]}>"
+        return f"<WhatsAppLog {self.id}: from={self.from_number} ticket={self.ticket_number}>"

app/routers/auth.py

@@ -5,6 +5,7 @@ from __future__ import annotations
 from typing import Annotated
 
 from fastapi import APIRouter, Depends
+from sqlalchemy import select
 from sqlalchemy.ext.asyncio import AsyncSession
 
 from app.core.database import get_db
@@ -22,6 +23,21 @@ from app.services import auth as auth_service
 router = APIRouter(prefix="/api/auth", tags=["auth"])
 
 
+@router.get("/users", response_model=list[UserOut])
+async def list_users(
+    db: Annotated[AsyncSession, Depends(get_db)],
+    current_user: Annotated[User, Depends(get_current_user)],
+) -> list[User]:
+    """List users (id, name, role) for assignment pickers.
+
+    Previously the frontend hard-coded technician ids/names in detail.html;
+    this endpoint makes the assign dropdown data-driven so a seed change never
+    silently breaks technician assignment.
+    """
+    result = await db.execute(select(User).order_by(User.full_name))
+    return list(result.scalars().all())
+
+
 @router.post("/register", response_model=UserOut, status_code=201)
 async def register(
     body: RegisterRequest,

app/routers/pages.py

@@ -2,8 +2,6 @@
 
 from __future__ import annotations
 
-from __future__ import annotations
-
 from pathlib import Path
 
 from fastapi import APIRouter, Request

app/routers/tickets.py

@@ -2,7 +2,7 @@
 
 from __future__ import annotations
 
-import os
+import logging
 import uuid
 from datetime import datetime
 from pathlib import Path
@@ -13,9 +13,10 @@ from sqlalchemy import select
 from sqlalchemy.ext.asyncio import AsyncSession
 from app.core.config import settings
 from app.core.database import get_db
-from app.core.security import get_current_user
+from app.core.security import get_current_user, require_roles
 from app.models.category import Category
 from app.models.ticket import Ticket, TicketPhoto
+from app.models.unit import Unit
 from app.models.user import User
 from app.schemas.ticket import (
     CategoryOut,
@@ -27,10 +28,13 @@ from app.schemas.ticket import (
     TicketOut,
     TicketPhotoOut,
     TicketUpdate,
+    UnitOut,
 )
 from app.services import ticket as ticket_service
 from app.services.sla import get_sla_status
 
+logger = logging.getLogger(__name__)
+
 router = APIRouter(prefix="/api/tickets", tags=["tickets"])
 
 # Ensure uploads directory exists
@@ -38,24 +42,66 @@ UPLOADS_DIR = settings.BASE_DIR / "uploads"
 UPLOADS_DIR.mkdir(parents=True, exist_ok=True)
 
 
+# ── Units ──────────────────────────────────────────────────────────
+@router.get("/units", response_model=list[UnitOut])
+async def list_units(
+    db: Annotated[AsyncSession, Depends(get_db)],
+    property_filter: str | None = Query(None, alias="property"),
+    building: str | None = Query(None),
+) -> list[Unit]:
+    """List all units, optionally filtered by property (East/West) and building."""
+    query = select(Unit).order_by(Unit.apartment_code)
+    if property_filter:
+        query = query.where(Unit.property == property_filter)
+    if building:
+        query = query.where(Unit.building == building)
+    result = await db.execute(query)
+    return list(result.scalars().all())
+
+
+@router.get("/units/grouped")
+async def list_units_grouped(
+    db: Annotated[AsyncSession, Depends(get_db)],
+    property_filter: str | None = Query(None, alias="property"),
+) -> dict[str, dict[str, list[dict]]]:
+    """Return units grouped as ``{property: {building: [units]}}``.
+
+    Additive convenience variant of ``GET /api/tickets/units`` for the
+    Property → Building → Apartment cascade. Units without a building are
+    grouped under an empty-string key.
+    """
+    query = select(Unit).order_by(Unit.property, Unit.building, Unit.apartment_code)
+    if property_filter:
+        query = query.where(Unit.property == property_filter)
+    result = await db.execute(query)
+    grouped: dict[str, dict[str, list[dict]]] = {}
+    for unit in result.scalars().all():
+        prop = unit.property or ""
+        building = unit.building or ""
+        grouped.setdefault(prop, {}).setdefault(building, []).append(
+            UnitOut.model_validate(unit).model_dump()
+        )
+    return grouped
+
+
 # ── Categories ──────────────────────────────────────────────────────
-async def _build_category_tree(db: AsyncSession, parent_id: int | None = None) -> list[CategoryTreeOut]:
+async def _build_category_tree(db: AsyncSession, parent_id: int | None = None, include_hidden: bool = False) -> list[CategoryTreeOut]:
     """Build a nested category tree."""
-    result = await db.execute(
-        select(Category)
-        .where(Category.parent_id == parent_id)
-        .order_by(Category.name)
-    )
+    query = select(Category).where(Category.parent_id == parent_id).order_by(Category.name)
+    if not include_hidden:
+        query = query.where(Category.show_in_form.is_(True))
+    result = await db.execute(query)
     categories = result.scalars().all()
     tree = []
     for cat in categories:
-        children = await _build_category_tree(db, cat.id)
+        children = await _build_category_tree(db, cat.id, include_hidden=include_hidden)
         tree.append(CategoryTreeOut(
             id=cat.id,
             type=cat.type,
             name=cat.name,
             parent_id=cat.parent_id,
             sla_urgency=cat.sla_urgency,
+            show_in_form=cat.show_in_form,
             children=children,
         ))
     return tree
@@ -65,23 +111,26 @@ async def _build_category_tree(db: AsyncSession, parent_id: int | None = None) -
 async def list_categories(
     db: Annotated[AsyncSession, Depends(get_db)],
     type_filter: str | None = Query(None, alias="type"),
+    include_hidden: bool = Query(False, description="Include alert-only categories (e.g. Gas Leak)"),
 ) -> list[CategoryTreeOut]:
-    """Return the full category tree, optionally filtered by type (maintenance, cs, emergency)."""
+    """Return the full category tree, optionally filtered by type (maintenance, cs, emergency).
+
+    Alert-only categories (``show_in_form=False``, e.g. Gas Leak) are excluded
+    unless ``include_hidden=true`` is passed (used by the emergency quick path).
+    """
     if type_filter:
         # Return flat list of top-level categories of the given type
-        result = await db.execute(
-            select(Category)
-            .where(Category.parent_id.is_(None), Category.type == type_filter)
-            .order_by(Category.name)
-        )
+        query = select(Category).where(Category.parent_id.is_(None), Category.type == type_filter).order_by(Category.name)
+        if not include_hidden:
+            query = query.where(Category.show_in_form.is_(True))
+        result = await db.execute(query)
         parents = result.scalars().all()
         tree = []
         for parent in parents:
-            children_result = await db.execute(
-                select(Category)
-                .where(Category.parent_id == parent.id)
-                .order_by(Category.name)
-            )
+            children_query = select(Category).where(Category.parent_id == parent.id).order_by(Category.name)
+            if not include_hidden:
+                children_query = children_query.where(Category.show_in_form.is_(True))
+            children_result = await db.execute(children_query)
             children = children_result.scalars().all()
             tree.append(CategoryTreeOut(
                 id=parent.id,
@@ -89,24 +138,43 @@ async def list_categories(
                 name=parent.name,
                 parent_id=parent.parent_id,
                 sla_urgency=parent.sla_urgency,
+                show_in_form=parent.show_in_form,
                 children=[CategoryOut.model_validate(c) for c in children],
             ))
         return tree
-    return await _build_category_tree(db)
+    return await _build_category_tree(db, include_hidden=include_hidden)
 
 
 @router.get("/categories/flat", response_model=list[CategoryOut])
 async def list_categories_flat(
     db: Annotated[AsyncSession, Depends(get_db)],
     type_filter: str | None = Query(None, alias="type"),
+    include_hidden: bool = Query(False, description="Include alert-only categories (e.g. Gas Leak)"),
 ) -> list[CategoryOut]:
-    """Return a flat list of all categories (no nesting), optionally filtered by type."""
+    """Return a flat list of all categories (no nesting), optionally filtered by type.
+
+    Alert-only categories are excluded by default; children of alert-only parents
+    are excluded too so no orphaned picker entries leak through.
+    """
     query = select(Category).order_by(Category.type, Category.name)
     if type_filter:
         query = query.where(Category.type == type_filter)
     result = await db.execute(query)
     categories = result.scalars().all()
-    return [CategoryOut.model_validate(c) for c in categories]
+    if include_hidden:
+        return [CategoryOut.model_validate(c) for c in categories]
+    # Exclude alert-only categories and any children whose parent is alert-only.
+    hidden_ids = {
+        c.id
+        for c in categories
+        if not c.show_in_form and c.parent_id is None
+    }
+    visible = [
+        c
+        for c in categories
+        if c.show_in_form and (c.parent_id is None or c.parent_id not in hidden_ids)
+    ]
+    return [CategoryOut.model_validate(c) for c in visible]
 
 
 # ── Ticket CRUD ──────────────────────────────────────────────────────
@@ -133,6 +201,8 @@ async def list_tickets(
     status: str | None = Query(None),
     priority: str | None = Query(None),
     property: str | None = Query(None),
+    building: str | None = Query(None),
+    unit_id: int | None = Query(None),
     category_id: int | None = Query(None),
     assigned_to: int | None = Query(None),
     date_from: datetime | None = Query(None),
@@ -144,6 +214,8 @@ async def list_tickets(
         status_filter=status,
         priority_filter=priority,
         property_filter=property,
+        building_filter=building,
+        unit_id=unit_id,
         category_id=category_id,
         assigned_to=assigned_to,
         date_from=date_from,
@@ -155,6 +227,19 @@ async def list_tickets(
     return TicketListResponse(items=items, total=total, page=page, page_size=page_size)
 
 
+@router.get("/{ticket_id}/transitions")
+async def get_ticket_transitions(
+    ticket_id: int,
+    db: Annotated[AsyncSession, Depends(get_db)],
+) -> dict:
+    """Return the valid next statuses for a ticket's current status."""
+    ticket = await ticket_service.get_ticket(db, ticket_id)
+    return {
+        "current_status": ticket.status,
+        "transitions": ticket_service.VALID_TRANSITIONS.get(ticket.status, []),
+    }
+
+
 @router.get("/{ticket_id}", response_model=TicketOut)
 async def get_ticket(
     ticket_id: int,
@@ -181,6 +266,32 @@ async def update_ticket(
     return ticket
 
 
+@router.delete("/{ticket_id}", status_code=status.HTTP_204_NO_CONTENT)
+async def delete_ticket(
+    ticket_id: int,
+    db: Annotated[AsyncSession, Depends(get_db)],
+    current_user: Annotated[User, Depends(require_roles("Admin/Jerome", "Admin/Wahab"))],
+) -> None:
+    """Delete a ticket and its children (timeline, photos, escalations).
+
+    Admin-only: intended for removing test/scratch tickets from the demo
+    database, never for routine workflow use.
+    """
+    ticket = await ticket_service.delete_ticket(db, ticket_id)
+    # Remove orphaned photo files from disk after the DB rows are gone.
+    for photo in ticket.photos:
+        if photo.photo_url:
+            name = photo.photo_url.rsplit("/", 1)[-1]
+            try:
+                (UPLOADS_DIR / name).unlink(missing_ok=True)
+            except OSError:
+                logger.warning(
+                    "Could not remove orphaned photo file %s for ticket %s",
+                    name,
+                    ticket_id,
+                )
+
+
 # ── Status Transitions (convenience endpoints) ───────────────────────
 @router.post("/{ticket_id}/status", response_model=TicketOut)
 async def change_ticket_status(

app/routers/whatsapp.py

@@ -1,44 +1,165 @@
-"""Mock WhatsApp endpoint for testing command parsing."""
+"""WhatsApp webhook handler — Meta Graph API integration."""
 
 from __future__ import annotations
 
+import logging
 from datetime import datetime, timezone
 from typing import Annotated
 
-from fastapi import APIRouter, Depends
+import httpx
+from fastapi import APIRouter, Depends, Query
 from sqlalchemy import select
 from sqlalchemy.ext.asyncio import AsyncSession
 
+from app.core.config import settings
 from app.core.database import get_db
 from app.models.whatsapp_log import WhatsAppLog
-from app.schemas.whatsapp import MockWhatsAppLogEntry, MockWhatsAppRequest, MockWhatsAppResponse
+from app.schemas.whatsapp import (
+    MetaWebhookRequest,
+    MockWhatsAppLogEntry,
+    WebhookVerificationResponse,
+    WhatsAppReplyResponse,
+)
+from app.services.ticket import create_ticket
+
+logger = logging.getLogger(__name__)
 
 router = APIRouter(prefix="/api/whatsapp", tags=["whatsapp"])
 
+REPLY_TEMPLATE = (
+    "Thank you for contacting Denya OneCare. "
+    "Your ticket number is {ticket_number}. "
+    "We will get back to you soon."
+)
 
-@router.post("/mock", response_model=MockWhatsAppResponse)
-async def mock_whatsapp(
-    body: MockWhatsAppRequest,
+
+# ── Meta Graph API helpers ──────────────────────────────────────────
+async def send_whatsapp_reply(
+    to_phone: str,
+    text: str,
+) -> WhatsAppReplyResponse:
+    """Send a text message via Meta Graph API."""
+    url = f"{settings.META_GRAPH_BASE}/{settings.WHATSAPP_PHONE_NUMBER_ID}/messages"
+    headers = {
+        "Authorization": f"Bearer {settings.WHATSAPP_ACCESS_TOKEN}",
+        "Content-Type": "application/x-www-form-urlencoded",
+    }
+    data = {
+        "messaging_product": "whatsapp",
+        "to": to_phone,
+        "type": "text",
+        "text": {"body": text},
+    }
+    # Encode nested dict as JSON string for form data (Meta requirement)
+    data["text"] = '{"body":' + f'"{text}"' + "}"
+    try:
+        async with httpx.AsyncClient() as client:
+            response = await client.post(url, headers=headers, data=data, timeout=15.0)
+            response.raise_for_status()
+        return WhatsAppReplyResponse(success=True, message="Reply sent")
+    except httpx.HTTPError as exc:
+        logger.error("Failed to send WhatsApp reply: %s", exc)
+        return WhatsAppReplyResponse(success=False, message=str(exc))
+
+
+# ── Webhook endpoint ────────────────────────────────────────────────
+@router.post("/webhook")
+async def whatsapp_webhook(
+    body: MetaWebhookRequest,
     db: Annotated[AsyncSession, Depends(get_db)],
-) -> MockWhatsAppResponse:
-    """Accept a mock WhatsApp command and log it."""
-    log = WhatsAppLog(
-        command=body.command,
-        from_number=body.from_number,
-        ticket_id=body.ticket_id,
-        received_at=datetime.now(timezone.utc),
-    )
-    db.add(log)
-    await db.flush()
-    return MockWhatsAppResponse()
+    hub_verify_token: str | None = Query(None, alias="hub.verify_token"),
+    mode: str | None = Query(None),
+    hub_challenge: str | None = Query(None),
+) -> dict:
+    """Handle incoming WhatsApp webhook from Meta."""
+
+    # ── Verification GET request (Meta sends this on webhook setup) ──
+    if mode and hub_challenge:
+        if hub_verify_token != settings.WHATSAPP_VERIFY_TOKEN:
+            return {"error": "Verify token mismatch"}
+        return WebhookVerificationResponse(challenge=hub_challenge).model_dump()
+
+    # ── Process inbound messages ────────────────────────────────────
+    if not body.entry:
+        return {"status": "no entry"}
+
+    for entry in body.entry:
+        if not entry.changes:
+            continue
+
+        for change in entry.changes:
+            if not change.message or not change.message.text:
+                logger.info("Non-text message received, skipping")
+                continue
+
+            message_text = change.message.text.text
+            sender = change.message.from_field
+            wa_msg_id = change.message.id or change.id
+
+            # ── Create ticket ──────────────────────────────────────
+            try:
+                ticket = await create_ticket(
+                    db,
+                    data={
+                        "description": message_text,
+                        "reporter": sender,
+                        "reported_via": "WhatsApp",
+                    },
+                )
+            except Exception as exc:
+                logger.error("Failed to create ticket: %s", exc)
+                # Still log the message even if ticket creation fails
+                log = WhatsAppLog(
+                    from_number=sender,
+                    message_text=message_text,
+                    wa_message_id=wa_msg_id,
+                    ticket_id=None,
+                    ticket_number=None,
+                    received_at=datetime.now(timezone.utc),
+                )
+                db.add(log)
+                await db.flush()
+                return {"status": "ticket creation failed, message logged"}
+
+            # ── Store WhatsApp log ─────────────────────────────────
+            log = WhatsAppLog(
+                from_number=sender,
+                message_text=message_text,
+                wa_message_id=wa_msg_id,
+                ticket_id=ticket.id,
+                ticket_number=ticket.ticket_number,
+                received_at=datetime.now(timezone.utc),
+            )
+            db.add(log)
+            await db.flush()
+
+            # ── Send auto-reply ────────────────────────────────────
+            reply_text = REPLY_TEMPLATE.format(ticket_number=ticket.ticket_number)
+            reply_result = await send_whatsapp_reply(sender, reply_text)
+            if not reply_result.success:
+                logger.warning(
+                    "Auto-reply failed for ticket %s: %s",
+                    ticket.ticket_number,
+                    reply_result.message,
+                )
+
+            return {
+                "status": "processed",
+                "ticket_id": ticket.id,
+                "ticket_number": ticket.ticket_number,
+                "reply_sent": reply_result.success,
+            }
+
+    return {"status": "no messages"}
 
 
+# ── Legacy debug endpoint ──────────────────────────────────────────
 @router.get("/mock-log", response_model=list[MockWhatsAppLogEntry])
 async def mock_whatsapp_log(
     db: Annotated[AsyncSession, Depends(get_db)],
     limit: int = 50,
 ) -> list[MockWhatsAppLogEntry]:
-    """Return recent mock WhatsApp submissions."""
+    """Return recent WhatsApp webhook submissions for debugging."""
     result = await db.execute(
         select(WhatsAppLog).order_by(WhatsAppLog.received_at.desc()).limit(limit)
     )

app/schemas/auth.py

@@ -2,7 +2,7 @@
 
 from __future__ import annotations
 
-from pydantic import BaseModel, EmailStr
+from pydantic import BaseModel
 
 
 class RegisterRequest(BaseModel):

app/schemas/ticket.py

@@ -5,7 +5,18 @@ from __future__ import annotations
 from datetime import datetime
 from decimal import Decimal
 
-from pydantic import BaseModel, Field
+from pydantic import BaseModel
+
+
+# ── Unit ─────────────────────────────────────────────────────────────
+class UnitOut(BaseModel):
+    id: int
+    property: str
+    apartment_code: str
+    building: str | None = None
+    floor: int | None = None
+
+    model_config = {"from_attributes": True}
 
 
 # ── Category ─────────────────────────────────────────────────────────
@@ -15,6 +26,7 @@ class CategoryOut(BaseModel):
     name: str
     parent_id: int | None = None
     sla_urgency: str | None = None
+    show_in_form: bool = True
 
     model_config = {"from_attributes": True}
 
@@ -32,6 +44,8 @@ class TicketCreate(BaseModel):
     reported_via: str | None = None  # whatsapp, phone, walk-in, qr, agent
     description: str | None = None
     assigned_to: int | None = None
+    customer_name: str | None = None
+    phone: str | None = None
 
 
 class TicketUpdate(BaseModel):
@@ -40,12 +54,14 @@ class TicketUpdate(BaseModel):
     category_id: int | None = None
     priority: str | None = None
     reporter: str | None = None
+    phone: str | None = None
     reported_via: str | None = None
     description: str | None = None
     assigned_to: int | None = None
     eta: datetime | None = None
     cost: Decimal | None = None
     parts_used: str | None = None
+    note: str | None = None
 
 
 class TicketTimelineOut(BaseModel):
@@ -78,7 +94,9 @@ class TicketBrief(BaseModel):
     unit_id: int | None = None
     category_id: int | None = None
     assigned_to: int | None = None
+    assigned_technician_name: str | None = None
     reporter: str | None = None
+    phone: str | None = None
     description: str | None = None
     sla_deadline: datetime | None = None
     reopen_count: int = 0
@@ -97,6 +115,8 @@ class TicketOut(TicketBrief):
     customer_rating: int | None = None
     timeline: list[TicketTimelineOut] = []
     photos: list[TicketPhotoOut] = []
+    unit: UnitOut | None = None
+    category: CategoryOut | None = None
     sla_status: dict | None = None
 
 

app/schemas/whatsapp.py

@@ -1,10 +1,69 @@
-"""Pydantic schemas for mock WhatsApp endpoint."""
+"""Pydantic schemas for Meta WhatsApp webhook."""
 
 from __future__ import annotations
 
 from datetime import datetime
 
-from pydantic import BaseModel
+from pydantic import BaseModel, Field
+
+
+# ── Meta Webhook Verification ────────────────────────────────────────
+class WebhookVerificationResponse(BaseModel):
+    challenge: str
+
+
+# ── Inbound Message Parsing ─────────────────────────────────────────
+class MessageText(BaseModel):
+    text: str
+
+
+class Message(BaseModel):
+    from_field: str = Field(alias="from")
+    id: str | None = None
+    text: MessageText | None = None
+    type: str | None = None
+
+
+class Contact(BaseModel):
+    wa_id: str | None = None
+    profile: dict | None = None
+
+
+class EntryMessagesItem(BaseModel):
+    id: str | None = None
+    message: Message | None = None
+    contacts: list[Contact] | None = None
+    timestamp: str | None = None
+
+
+class Entry(BaseModel):
+    id: str | None = None
+    changes: list[EntryMessagesItem] | None = None
+    metadata: dict | None = None
+
+
+class MetaWebhookRequest(BaseModel):
+    object: str | None = None
+    entry: list[Entry] | None = None
+
+
+# ── Auto-reply ──────────────────────────────────────────────────────
+class WhatsAppReplyResponse(BaseModel):
+    success: bool
+    message: str
+
+
+# ── Legacy mock schemas (kept for /mock-log endpoint) ───────────────
+class MockWhatsAppLogEntry(BaseModel):
+    id: int
+    from_number: str
+    message_text: str
+    wa_message_id: str | None
+    ticket_id: int | None
+    ticket_number: str | None
+    received_at: datetime
+
+    model_config = {"from_attributes": True}
 
 
 class MockWhatsAppRequest(BaseModel):
@@ -16,13 +75,3 @@ class MockWhatsAppRequest(BaseModel):
 class MockWhatsAppResponse(BaseModel):
     status: str = "received"
     message: str = "Command logged successfully"
-
-
-class MockWhatsAppLogEntry(BaseModel):
-    id: int
-    command: str
-    from_number: str | None
-    ticket_id: int | None
-    received_at: datetime
-
-    model_config = {"from_attributes": True}

app/services/auth.py

@@ -3,11 +3,9 @@
 from __future__ import annotations
 
 from fastapi import HTTPException, status
-from jose import JWTError, jwt
 from sqlalchemy import select
 from sqlalchemy.ext.asyncio import AsyncSession
 
-from app.core.config import settings
 from app.core.security import (
     create_access_token,
     create_refresh_token,

app/services/seed.py

@@ -135,23 +135,39 @@ SEED_CATEGORIES_DATA: list[dict] = [
     {"type": "maintenance", "name": "Security", "subs": ["Lock broken", "Door not closing", "Window latch", "CCTV issue"]},
     {"type": "maintenance", "name": "Internet", "subs": ["WiFi down", "Slow speed", "Router reset"]},
     {"type": "maintenance", "name": "Structural", "subs": ["Wall crack", "Ceiling leak", "Floor tile", "Paint touch-up"]},
+    {"type": "maintenance", "name": "Aluminum/Glass",
+     "subs": ["Window repair", "Window replacement", "Door repair (sliding)", "Door repair (fixed)",
+              "Glass replacement", "Aluminum frame repair", "Shower screen", "Mirror replacement"]},
+    {"type": "maintenance", "name": "Carpentry",
+     "subs": ["Door repair", "Door replacement", "Door frame", "Cabinet repair", "Wardrobe repair",
+              "Shelving", "Timber repair", "Loose hinge/lock plate"]},
+    {"type": "maintenance", "name": "Mould & Damp",
+     "subs": ["Wall mould", "Ceiling damp patch", "Bathroom mould", "Mould after leak",
+              "Damp proofing / remediation"],
+     "sla_urgency": "medium"},
     # ── Customer Service ─────────────────────────────────────────
     {"type": "cs", "name": "Check-in", "subs": ["Early check-in", "Key handover", "Welcome instructions"]},
     {"type": "cs", "name": "Check-out", "subs": ["Late checkout", "Key return", "Inspection"]},
     {"type": "cs", "name": "Housekeeping", "subs": ["Mid-stay cleaning", "Linen change", "Restocking"]},
-    {"type": "cs", "name": "Lost Property", "subs": ["Guest left items behind"]},
+    {"type": "cs", "name": "Missing Item", "subs": ["Guest left items behind", "Item search request"]},
     {"type": "cs", "name": "Billing", "subs": ["Invoice question", "Payment issue", "Deposit query"]},
     {"type": "cs", "name": "Staff Behaviour", "subs": ["Staff conduct feedback"]},
     # ── Emergency ────────────────────────────────────────────────
     {"type": "emergency", "name": "Fire", "subs": ["Smoke detected", "Fire alarm", "Sprinkler issue"], "sla_urgency": "urgent"},
     {"type": "emergency", "name": "Flood", "subs": ["Major water leak", "Burst pipe", "Overflowing"], "sla_urgency": "urgent"},
-    {"type": "emergency", "name": "Gas Leak", "subs": ["Gas smell", "Suspected leak"], "sla_urgency": "urgent"},
+    {"type": "emergency", "name": "Gas Leak", "subs": ["Gas smell", "Suspected leak"], "sla_urgency": "urgent", "show_in_form": False},
     {"type": "emergency", "name": "Electrical Hazard", "subs": ["Sparking", "Exposed wires", "Power outage multiple units"], "sla_urgency": "urgent"},
 ]
 
 
 async def seed_categories(db: AsyncSession) -> list[Category]:
-    """Seed the categories table with the full PRD §7 taxonomy."""
+    """Seed the categories table with the full PRD §7 taxonomy.
+
+    Idempotent: only inserts missing rows. ``show_in_form`` on existing
+    parents is synced when the seed data explicitly sets it (e.g. Gas Leak
+    is alert-only, so already-seeded databases get flipped to False on the
+    next startup).
+    """
     created: list[Category] = []
 
     for group in SEED_CATEGORIES_DATA:
@@ -170,10 +186,16 @@ async def seed_categories(db: AsyncSession) -> list[Category]:
                 name=group["name"],
                 parent_id=None,
                 sla_urgency=group.get("sla_urgency"),
+                show_in_form=group.get("show_in_form", True),
             )
             db.add(parent)
             await db.flush()
             created.append(parent)
+        elif "show_in_form" in group and parent.show_in_form != group["show_in_form"]:
+            # Sync visibility for existing rows (e.g. Gas Leak → alert-only)
+            parent.show_in_form = group["show_in_form"]
+            await db.flush()
+            created.append(parent)
 
         # Seed sub-categories
         for sub_name in group["subs"]:

app/services/sla.py

@@ -55,9 +55,12 @@ def should_escalate_on_response(ticket: Ticket) -> bool:
     return datetime.now(timezone.utc) > deadline
 
 
+TERMINAL_STATUSES = {"Closed", "Completed", "Cancelled"}
+
+
 def is_sla_breached(ticket: Ticket) -> bool:
     """Return True if the ticket's resolution SLA deadline has passed."""
-    if ticket.sla_deadline is None or ticket.status in ("Closed", "Completed"):
+    if ticket.sla_deadline is None or ticket.status in TERMINAL_STATUSES:
         return False
     deadline = ticket.sla_deadline
     if deadline.tzinfo is None:
@@ -88,7 +91,7 @@ async def get_sla_status(ticket: Ticket) -> dict:
         rd = resolution_deadline
         if rd.tzinfo is None:
             rd = rd.replace(tzinfo=timezone.utc)
-        resolution_breached = now > rd if ticket.status not in ("Closed", "Completed") else False
+        resolution_breached = now > rd if ticket.status not in TERMINAL_STATUSES else False
 
     return {
         "priority": ticket.priority,

app/services/ticket.py

@@ -6,11 +6,11 @@ from datetime import datetime, timezone
 from typing import Any
 
 from fastapi import HTTPException, status
-from sqlalchemy import func, select
+from sqlalchemy import delete as sa_delete, func, select
 from sqlalchemy.ext.asyncio import AsyncSession
 from sqlalchemy.orm import selectinload
 
-from app.models.ticket import Escalation, Ticket, TicketTimeline
+from app.models.ticket import Escalation, Ticket, TicketPhoto, TicketTimeline
 from app.models.unit import Unit
 from app.models.user import User
 from app.services.sla import compute_sla_deadline
@@ -18,21 +18,23 @@ from app.services.sla import compute_sla_deadline
 # ── Status Transition Map ────────────────────────────────────────────
 # Keys: current status → list of valid next statuses
 VALID_TRANSITIONS: dict[str, list[str]] = {
-    "New": ["Logged"],
-    "Logged": ["Triage", "Closed"],
-    "Triage": ["Assigned", "Escalated"],
-    "Assigned": ["Accepted", "Triage"],
-    "Accepted": ["Travelling", "Triage"],
-    "Travelling": ["On Site", "Triage"],
-    "On Site": ["In Progress", "Triage"],
-    "In Progress": ["Waiting Parts", "Escalated", "Completed"],
-    "Waiting Parts": ["In Progress", "Escalated"],
-    "Escalated": ["Triage", "In Progress", "Completed", "Closed"],
-    "Completed": ["On-Field Verification", "In Progress"],
-    "On-Field Verification": ["Wahab Review", "Completed", "Closed"],
-    "Wahab Review": ["Closed", "On-Field Verification"],
+    "New": ["Logged", "Cancelled"],
+    "Logged": ["Triage", "Closed", "Cancelled"],
+    "Triage": ["Assigned", "Escalated", "Cancelled"],
+    "Assigned": ["Accepted", "Triage", "Cancelled"],
+    "Accepted": ["Travelling", "Triage", "Cancelled"],
+    "Travelling": ["On Site", "Triage", "Cancelled"],
+    "On Site": ["In Progress", "Triage", "Cancelled"],
+    "In Progress": ["Waiting Parts", "Escalated", "Completed", "Cancelled"],
+    "Waiting Parts": ["In Progress", "Escalated", "Cancelled"],
+    "Escalated": ["Triage", "In Progress", "Completed", "Closed", "Cancelled"],
+    "Completed": ["On-Field Verification", "In Progress", "Cancelled"],
+    "On-Field Verification": ["Wahab Review", "Completed", "Closed", "Cancelled"],
+    "Wahab Review": ["Closed", "On-Field Verification", "Cancelled"],
     "Closed": ["Reopened"],
-    "Reopened": ["Triage", "Logged"],
+    "Reopened": ["Triage", "Logged", "Cancelled"],
+    # Terminal: cancelled tickets cannot resume work.
+    "Cancelled": [],
 }
 
 REOPEN_WINDOW_DAYS = 7
@@ -41,15 +43,25 @@ SLA_ACK_USER = "Ama"
 
 # ── Helpers ──────────────────────────────────────────────────────────
 async def _generate_ticket_number(db: AsyncSession) -> str:
-    """Generate the next ticket number in PAV-YYYY-NNNNN format."""
+    """Generate the next ticket number in PAV-YYYY-NNNNN format.
+
+    Uses the highest existing suffix + 1 (not a row count) so that deleting
+    tickets never re-issues an already-used number.
+    """
     year = datetime.now(timezone.utc).year
     prefix = f"PAV-{year}-"
-    # Count existing tickets this year
     result = await db.execute(
-        select(func.count(Ticket.id)).where(Ticket.ticket_number.like(f"{prefix}%"))
+        select(func.max(Ticket.ticket_number)).where(Ticket.ticket_number.like(f"{prefix}%"))
     )
-    count = result.scalar() or 0
-    return f"{prefix}{count + 1:05d}"
+    max_number = result.scalar()
+    if max_number:
+        try:
+            next_seq = int(max_number.rsplit("-", 1)[1]) + 1
+        except (ValueError, IndexError):
+            next_seq = 1
+    else:
+        next_seq = 1
+    return f"{prefix}{next_seq:05d}"
 
 
 async def _log_status_change(
@@ -109,7 +121,8 @@ async def create_ticket(
         unit_id=data.get("unit_id"),
         category_id=data.get("category_id"),
         priority=priority,
-        reporter=data.get("reporter"),
+        reporter=data.get("reporter") or data.get("customer_name"),
+        phone=data.get("phone"),
         reported_via=data.get("reported_via"),
         description=data.get("description"),
         assigned_to=data.get("assigned_to"),
@@ -156,6 +169,8 @@ async def list_tickets(
     status_filter: str | None = None,
     priority_filter: str | None = None,
     property_filter: str | None = None,
+    building_filter: str | None = None,
+    unit_id: int | None = None,
     category_id: int | None = None,
     assigned_to: int | None = None,
     date_from: datetime | None = None,
@@ -177,6 +192,12 @@ async def list_tickets(
         # Join unit to filter by property
         query = query.join(Ticket.unit).where(Unit.property == property_filter)
         count_query = count_query.join(Ticket.unit).where(Unit.property == property_filter)
+    if building_filter:
+        query = query.join(Ticket.unit).where(Unit.building == building_filter)
+        count_query = count_query.join(Ticket.unit).where(Unit.building == building_filter)
+    if unit_id:
+        query = query.where(Ticket.unit_id == unit_id)
+        count_query = count_query.where(Ticket.unit_id == unit_id)
     if category_id:
         query = query.where(Ticket.category_id == category_id)
         count_query = count_query.where(Ticket.category_id == category_id)
@@ -196,7 +217,7 @@ async def list_tickets(
 
     # Paginate
     offset = (page - 1) * page_size
-    query = query.order_by(Ticket.created_at.desc()).offset(offset).limit(page_size)
+    query = query.order_by(Ticket.created_at.desc(), Ticket.id.desc()).offset(offset).limit(page_size).options(selectinload(Ticket.assigned_technician))
 
     result = await db.execute(query)
     tickets = list(result.scalars().all())
@@ -214,8 +235,9 @@ async def update_ticket(
 
     # Handle status transitions separately
     new_status = data.get("status")
+    old_status = ticket.status
+    status_changed = new_status is not None and old_status != new_status
     if new_status is not None:
-        old_status = ticket.status
         if old_status != new_status:
             valid_targets = VALID_TRANSITIONS.get(old_status, [])
             if new_status not in valid_targets:
@@ -275,8 +297,36 @@ async def update_ticket(
 
             ticket.status = new_status
 
+    # Assigning a technician advances pre-Assigned tickets to Assigned with a
+    # timeline entry; tickets already past Assigned keep their current status.
+    advanced_to_assigned = False
+    if "assigned_to" in data and data["assigned_to"] != ticket.assigned_to:
+        if ticket.status in {"New", "Logged", "Triage"}:
+            await _log_status_change(
+                db,
+                ticket.id,
+                from_status=ticket.status,
+                to_status="Assigned",
+                note=data.get("note") if not status_changed else None,
+                user_id=user.id if user else None,
+            )
+            ticket.status = "Assigned"
+            advanced_to_assigned = True
+
+    # Handle standalone note (no status change)
+    note_only = data.get("note")
+    if note_only and not status_changed and not advanced_to_assigned:
+        await _log_status_change(
+            db,
+            ticket.id,
+            from_status=ticket.status,
+            to_status=ticket.status,
+            note=note_only,
+            user_id=user.id if user else None,
+        )
+
     # Update other fields
-    for field in ("unit_id", "category_id", "priority", "reporter", "reported_via",
+    for field in ("unit_id", "category_id", "priority", "reporter", "phone", "reported_via",
                   "description", "assigned_to", "eta", "cost", "parts_used"):
         if field in data:
             setattr(ticket, field, data[field])
@@ -290,3 +340,19 @@ async def update_ticket(
     return ticket
 
 
+async def delete_ticket(db: AsyncSession, ticket_id: int) -> Ticket:
+    """Delete a ticket and all dependent rows (timeline, photos, escalations).
+
+    Returns the deleted ticket so the caller can remove orphaned photo files.
+    """
+    ticket = await _get_ticket_or_404(db, ticket_id)
+
+    # Delete escalations, timeline, and photo rows first (FK children).
+    await db.execute(sa_delete(Escalation).where(Escalation.ticket_id == ticket_id))
+    await db.execute(sa_delete(TicketTimeline).where(TicketTimeline.ticket_id == ticket_id))
+    await db.execute(sa_delete(TicketPhoto).where(TicketPhoto.ticket_id == ticket_id))
+    await db.delete(ticket)
+    await db.flush()
+    return ticket
+
+

app/templates/base.html

@@ -12,17 +12,23 @@
                 extend: {
                     colors: {
                         denya: {
-                            50: '#eff6ff',
-                            100: '#dbeafe',
-                            200: '#bfdbfe',
-                            300: '#93c5fd',
-                            400: '#60a5fa',
-                            500: '#3b82f6',
-                            600: '#2563eb',
-                            700: '#1d4ed8',
-                            800: '#1e40af',
-                            900: '#1e3a8a',
-                        }
+                            50: '#e8f0ea',
+                            100: '#c5d9cb',
+                            200: '#9ebfaa',
+                            300: '#74a589',
+                            400: '#4d8c69',
+                            500: '#2d734d',
+                            600: '#1d5a3a',
+                            700: '#0d2b18',
+                            800: '#0a2012',
+                            900: '#07150c',
+                        },
+                        gold: {
+                            DEFAULT: '#c8a96e',
+                            light: '#e8d5a8',
+                            dark: '#a88a4e',
+                        },
+                        cream: '#faf8f5',
                     }
                 }
             }
@@ -45,53 +51,59 @@
         .status-wahab-review { @apply bg-violet-100 text-violet-800; }
         .status-closed { @apply bg-gray-200 text-gray-600; }
         .status-reopened { @apply bg-pink-100 text-pink-800; }
+        .status-cancelled { @apply bg-gray-300 text-gray-700 line-through; }
         .priority-urgent { @apply bg-red-100 text-red-800 border-red-300; }
         .priority-high { @apply bg-orange-100 text-orange-800 border-orange-300; }
         .priority-medium { @apply bg-yellow-100 text-yellow-800 border-yellow-300; }
         .priority-low { @apply bg-green-100 text-green-800 border-green-300; }
+        .brand-gradient { background: linear-gradient(135deg, #0d2b18 0%, #1a3d24 100%); }
     </style>
 </head>
-<body class="bg-gray-50 min-h-screen" x-data="app()" x-init="init()">
+<body class="bg-cream min-h-screen text-[#1a1a1a]" x-data="app()" x-init="init()">
     <!-- Nav Bar -->
-    <nav class="bg-white border-b border-gray-200 shadow-sm sticky top-0 z-50" x-show="isLoggedIn" x-cloak>
+    <nav class="bg-[#0d2b18] border-b border-denya-800 shadow-lg sticky top-0 z-50" x-show="isLoggedIn" x-cloak>
         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
             <div class="flex items-center justify-between h-16">
                 <!-- Left side -->
                 <div class="flex items-center space-x-4">
-                    <a href="/dashboard/cs" class="flex items-center space-x-2 text-denya-700 font-bold text-lg">
-                        <svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/>
-                        </svg>
-                        <span>Denya OneCare</span>
+                    <a href="/dashboard/cs" class="flex items-center space-x-3">
+                        <!-- Denya Developers Logo Mark -->
+                        <div class="w-9 h-9 bg-gold rounded-lg flex items-center justify-center shadow-sm">
+                            <svg class="w-5 h-5 text-[#0d2b18]" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"/>
+                            </svg>
+                        </div>
+                        <div class="flex flex-col">
+                            <span class="text-white font-bold text-base leading-tight">Denya Developers</span>
+                            <span class="text-gold text-xs leading-tight font-medium">OneCare</span>
+                        </div>
                     </a>
-                    <!-- CS Links -->
+                    <!-- Nav Links -->
                     <template x-if="isCS">
                         <div class="hidden md:flex space-x-1 ml-6">
-                            <a href="/dashboard/cs" class="px-3 py-2 rounded-md text-sm font-medium" :class="currentPath === '/dashboard/cs' ? 'bg-denya-50 text-denya-700' : 'text-gray-600 hover:text-gray-900 hover:bg-gray-50'">Dashboard</a>
-                            <a href="/tickets" class="px-3 py-2 rounded-md text-sm font-medium" :class="currentPath.startsWith('/tickets') ? 'bg-denya-50 text-denya-700' : 'text-gray-600 hover:text-gray-900 hover:bg-gray-50'">All Issues</a>
-                            <a href="/tickets/new" class="px-3 py-2 rounded-md text-sm font-medium text-gray-600 hover:text-gray-900 hover:bg-gray-50">Create Issue</a>
+                            <a href="/dashboard/cs" class="px-3 py-2 rounded-md text-sm font-medium transition-colors" :class="currentPath === '/dashboard/cs' ? 'bg-denya-800 text-gold' : 'text-gray-300 hover:text-white hover:bg-denya-800/50'">Dashboard</a>
+                            <a href="/tickets" class="px-3 py-2 rounded-md text-sm font-medium transition-colors" :class="currentPath.startsWith('/tickets') && !currentPath.endsWith('/new') ? 'bg-denya-800 text-gold' : 'text-gray-300 hover:text-white hover:bg-denya-800/50'">All Issues</a>
+                            <a href="/tickets/new" class="px-3 py-2 rounded-md text-sm font-medium text-gray-300 hover:text-white hover:bg-denya-800/50 transition-colors">Create Issue</a>
                         </div>
                     </template>
-                    <!-- FM Links -->
                     <template x-if="isFM">
                         <div class="hidden md:flex space-x-1 ml-6">
-                            <a href="/dashboard/fm" class="px-3 py-2 rounded-md text-sm font-medium" :class="currentPath === '/dashboard/fm' ? 'bg-denya-50 text-denya-700' : 'text-gray-600 hover:text-gray-900 hover:bg-gray-50'">Dashboard</a>
-                            <a href="/tickets" class="px-3 py-2 rounded-md text-sm font-medium" :class="currentPath.startsWith('/tickets') ? 'bg-denya-50 text-denya-700' : 'text-gray-600 hover:text-gray-900 hover:bg-gray-50'">All Issues</a>
-                            <a href="/tickets/new" class="px-3 py-2 rounded-md text-sm font-medium text-gray-600 hover:text-gray-900 hover:bg-gray-50">Create Issue</a>
+                            <a href="/dashboard/fm" class="px-3 py-2 rounded-md text-sm font-medium transition-colors" :class="currentPath === '/dashboard/fm' ? 'bg-denya-800 text-gold' : 'text-gray-300 hover:text-white hover:bg-denya-800/50'">Dashboard</a>
+                            <a href="/tickets" class="px-3 py-2 rounded-md text-sm font-medium transition-colors" :class="currentPath.startsWith('/tickets') && !currentPath.endsWith('/new') ? 'bg-denya-800 text-gold' : 'text-gray-300 hover:text-white hover:bg-denya-800/50'">All Issues</a>
+                            <a href="/tickets/new" class="px-3 py-2 rounded-md text-sm font-medium text-gray-300 hover:text-white hover:bg-denya-800/50 transition-colors">Create Issue</a>
                         </div>
                     </template>
-                    <!-- CEO/Director Links -->
                     <template x-if="isExecutive">
                         <div class="hidden md:flex space-x-1 ml-6">
-                            <a href="/dashboard/ceo" class="px-3 py-2 rounded-md text-sm font-medium" :class="currentPath === '/dashboard/ceo' ? 'bg-denya-50 text-denya-700' : 'text-gray-600 hover:text-gray-900 hover:bg-gray-50'">Dashboard</a>
-                            <a href="/tickets" class="px-3 py-2 rounded-md text-sm font-medium" :class="currentPath.startsWith('/tickets') ? 'bg-denya-50 text-denya-700' : 'text-gray-600 hover:text-gray-900 hover:bg-gray-50'">Issues</a>
+                            <a href="/dashboard/ceo" class="px-3 py-2 rounded-md text-sm font-medium transition-colors" :class="currentPath === '/dashboard/ceo' ? 'bg-denya-800 text-gold' : 'text-gray-300 hover:text-white hover:bg-denya-800/50'">Dashboard</a>
+                            <a href="/tickets" class="px-3 py-2 rounded-md text-sm font-medium transition-colors" :class="currentPath.startsWith('/tickets') ? 'bg-denya-800 text-gold' : 'text-gray-300 hover:text-white hover:bg-denya-800/50'">Issues</a>
                         </div>
                     </template>
                 </div>
                 <!-- Right side -->
                 <div class="flex items-center space-x-4">
-                    <span class="text-sm text-gray-600 hidden md:block" x-text="`${user.full_name} (${user.role})`"></span>
-                    <button @click="logout()" class="px-3 py-1.5 text-sm text-red-600 hover:text-red-800 hover:bg-red-50 rounded-md transition-colors">
+                    <span class="text-sm text-gray-300 hidden md:block" x-text="`${user.full_name} (${user.role})`"></span>
+                    <button @click="logout()" class="px-3 py-1.5 text-sm text-gold hover:text-gold-light hover:bg-denya-800/50 rounded-md transition-colors border border-denya-600">
                         Logout
                     </button>
                 </div>
@@ -99,19 +111,19 @@
         </div>
     </nav>
 
-    <!-- Mobile Nav (CS) -->
-    <div class="md:hidden border-b bg-white" x-show="isLoggedIn" x-cloak>
+    <!-- Mobile Nav -->
+    <div class="md:hidden border-b bg-[#0d2b18] border-denya-800" x-show="isLoggedIn" x-cloak>
         <template x-if="isCS || isFM">
             <div class="flex overflow-x-auto px-4 py-2 space-x-2">
-                <a href="/dashboard/cs" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap" :class="currentPath === '/dashboard/cs' ? 'bg-denya-50 text-denya-700' : 'text-gray-500'" x-text="isCS ? 'CS Dashboard' : 'FM Dashboard'"></a>
-                <a href="/tickets" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap" :class="currentPath.startsWith('/tickets') && !currentPath.endsWith('/new') ? 'bg-denya-50 text-denya-700' : 'text-gray-500'">Issues</a>
-                <a href="/tickets/new" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap text-gray-500">New Issue</a>
+                <a href="/dashboard/cs" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap" :class="currentPath === '/dashboard/cs' ? 'bg-denya-800 text-gold' : 'text-gray-300'">Dashboard</a>
+                <a href="/tickets" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap" :class="currentPath.startsWith('/tickets') && !currentPath.endsWith('/new') ? 'bg-denya-800 text-gold' : 'text-gray-300'">Issues</a>
+                <a href="/tickets/new" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap text-gray-300">New Issue</a>
             </div>
         </template>
         <template x-if="isExecutive">
             <div class="flex overflow-x-auto px-4 py-2 space-x-2">
-                <a href="/dashboard/ceo" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap" :class="currentPath === '/dashboard/ceo' ? 'bg-denya-50 text-denya-700' : 'text-gray-500'">CEO Dashboard</a>
-                <a href="/tickets" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap text-gray-500">Issues</a>
+                <a href="/dashboard/ceo" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap" :class="currentPath === '/dashboard/ceo' ? 'bg-denya-800 text-gold' : 'text-gray-300'">CEO Dashboard</a>
+                <a href="/tickets" class="px-3 py-1.5 rounded text-sm font-medium whitespace-nowrap text-gray-300">Issues</a>
             </div>
         </template>
     </div>
@@ -122,13 +134,13 @@
     </main>
 
     <!-- Loading Overlay -->
-    <div x-show="loading" class="fixed inset-0 bg-black bg-opacity-30 z-50 flex items-center justify-center" x-cloak>
-        <div class="bg-white rounded-lg p-6 flex items-center space-x-3 shadow-xl">
-            <svg class="animate-spin h-6 w-6 text-denya-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+    <div x-show="loading" class="fixed inset-0 bg-[#0d2b18]/40 z-50 flex items-center justify-center" x-cloak>
+        <div class="bg-white rounded-xl p-6 flex items-center space-x-3 shadow-2xl border border-denya-200">
+            <svg class="animate-spin h-6 w-6 text-denya-700" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                 <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
                 <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"></path>
             </svg>
-            <span class="text-gray-700 font-medium" x-text="loadingMessage || 'Loading...'"></span>
+            <span class="text-denya-800 font-medium" x-text="loadingMessage || 'Loading...'"></span>
         </div>
     </div>
 
@@ -136,7 +148,7 @@
     <div class="fixed bottom-4 right-4 z-50 space-y-2">
         <template x-for="toast in toasts" :key="toast.id">
             <div class="px-4 py-3 rounded-lg shadow-lg text-white text-sm font-medium transition-all duration-300"
-                 :class="{'bg-green-600': toast.type === 'success', 'bg-red-600': toast.type === 'error', 'bg-blue-600': toast.type === 'info', 'bg-yellow-600': toast.type === 'warning'}"
+                 :class="{'bg-denya-600': toast.type === 'success', 'bg-red-600': toast.type === 'error', 'bg-denya-500': toast.type === 'info', 'bg-gold': toast.type === 'warning'}"
                  x-init="setTimeout(() => { toasts = toasts.filter(t => t.id !== toast.id) }, toast.duration || 4000)">
                 <span x-text="toast.message"></span>
             </div>
@@ -164,12 +176,10 @@
                 get isAdmin() { return ['Admin/Jerome', 'Admin/Wahab'].includes(this.user.role) },
 
                 init() {
-                    // Redirect to login if not logged in (skip for login page)
                     if (!this.isLoggedIn && this.currentPath !== '/login') {
                         window.location.href = '/login';
                         return;
                     }
-                    // Verify token on load
                     if (this.isLoggedIn) {
                         this.fetchMe();
                     }
@@ -209,7 +219,7 @@
                             opts.body = JSON.stringify(body);
                         } else if (body instanceof FormData) {
                             opts.body = body;
-                            delete opts.headers['Content-Type']; // Let browser set multipart boundary
+                            delete opts.headers['Content-Type'];
                             opts.headers = { 'Authorization': `Bearer ${this.token}` };
                         }
                         const res = await fetch(url, opts);
@@ -253,13 +263,11 @@
                         localStorage.setItem('refresh_token', data.refresh_token);
                         this.token = data.access_token;
 
-                        // Fetch user info
                         const me = await this.apiGet('/api/auth/me');
                         this.user = me;
                         localStorage.setItem('user', JSON.stringify(me));
                         this.isLoggedIn = true;
 
-                        // Role-based redirect
                         const role = me.role;
                         if (['CS Rep', 'CS Manager'].includes(role)) {
                             window.location.href = '/dashboard/cs';
@@ -311,7 +319,8 @@
                         'on-field verification': 'status-on-field-verification',
                         'wahab review': 'status-wahab-review',
                         'closed': 'status-closed',
-                        'reopened': 'status-reopened'
+                        'reopened': 'status-reopened',
+                        'cancelled': 'status-cancelled'
                     };
                     return map[status.toLowerCase()] || 'bg-gray-100 text-gray-800';
                 },
@@ -348,6 +357,32 @@
                     if (diffHrs < 1) return '< 1h';
                     if (diffHrs < 24) return `${diffHrs}h`;
                     return `${diffDays}d`;
+                },
+
+                groupByPriority(tickets, ageDir = 'desc') {
+                    // Group tickets into Urgent/High/Medium/Low + an other bucket,
+                    // each sorted by age (desc = newest first, asc = oldest first).
+                    const order = ['urgent', 'high', 'medium', 'low'];
+                    const groups = { urgent: [], high: [], medium: [], low: [], other: [] };
+                    const age = (t) => new Date(t.created_at).getTime() || 0;
+                    (tickets || []).forEach(t => {
+                        const p = String(t.priority || '').toLowerCase();
+                        groups[order.includes(p) ? p : 'other'].push(t);
+                    });
+                    Object.keys(groups).forEach(k => {
+                        groups[k].sort((a, b) => (ageDir === 'asc' ? age(a) - age(b) : age(b) - age(a)));
+                    });
+                    return groups;
+                },
+
+                priorityGroupMeta() {
+                    return [
+                        { key: 'urgent', label: '🔴 Urgent', cls: 'border-red-200 bg-red-50' },
+                        { key: 'high', label: '🟠 High', cls: 'border-orange-200 bg-orange-50' },
+                        { key: 'medium', label: '🟡 Medium', cls: 'border-yellow-200 bg-yellow-50' },
+                        { key: 'low', label: '🟢 Low', cls: 'border-green-200 bg-green-50' },
+                        { key: 'other', label: '⚪ No priority / Unknown', cls: 'border-gray-200 bg-gray-50' },
+                    ];
                 }
             }
         }

app/templates/dashboard/ceo.html

@@ -171,17 +171,29 @@
 
             async loadData() {
                 try {
-                    const allData = await app().apiGet('/api/tickets?page_size=500');
-                    if (!allData?.items) return;
-                    const all = allData.items;
-                    const total = allData.total || all.length;
+                    // Fetch ALL tickets via pagination. The API caps page_size at 200
+                    // (app/routers/tickets.py), so a single page_size=500 request returns 422
+                    // and the dashboard renders empty KPIs. Loop pages until we have `total`
+                    // tickets so KPIs stay accurate as volume grows past 200.
+                    const all = [];
+                    const pageSize = 200;
+                    let page = 1;
+                    let total = Infinity;
+                    while (all.length < total && page <= 1000) {  // 1000-page safety bound
+                        const allData = await app().apiGet(`/api/tickets?page=${page}&page_size=${pageSize}`);
+                        if (!allData?.items || !allData.items.length) break;
+                        all.push(...allData.items);
+                        total = allData.total ?? all.length;
+                        page += 1;
+                    }
+                    if (!all.length) return;
 
                     // Basic KPIs
-                    const open = all.filter(t => !['Closed', 'Completed'].includes(t.status));
-                    const closed = all.filter(t => ['Closed', 'Completed'].includes(t.status));
+                    const open = all.filter(t => !['Closed', 'Completed', 'Cancelled'].includes(t.status));
+                    const closed = all.filter(t => ['Closed', 'Completed', 'Cancelled'].includes(t.status));
                     const urgent = all.filter(t => t.priority === 'urgent');
                     const withSLA = all.filter(t => t.sla_deadline);
-                    const slaMet = withSLA.filter(t => new Date(t.sla_deadline) > new Date() || ['Closed', 'Completed'].includes(t.status));
+                    const slaMet = withSLA.filter(t => new Date(t.sla_deadline) > new Date() || ['Closed', 'Completed', 'Cancelled'].includes(t.status));
 
                     // Monthly restored
                     const oneWeekAgo = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000);
@@ -218,20 +230,28 @@
                     });
                     this.charts.monthlyMax = Math.max(...this.charts.monthlyTrend.map(m => m.count), 1);
 
-                    // By property
+                    // By property — load units once and compute from ticket data
                     const propData = { east: 0, west: 0 };
-                    all.forEach(t => { /* would need unit join — estimate from ticket IDs */ });
                     try {
-                        const east = await app().apiGet('/api/tickets?property=East&page_size=1');
-                        const west = await app().apiGet('/api/tickets?property=West&page_size=1');
-                        propData.east = east?.total || 0;
-                        propData.west = west?.total || 0;
-                    } catch (e) { /* api may not support property filter directly */ }
+                        const units = await app().apiGet('/api/tickets/units');
+                        if (units && units.length > 0) {
+                            const unitPropertyMap = {};
+                            units.forEach(u => { unitPropertyMap[u.id] = u.property; });
+                            all.forEach(t => {
+                                if (t.unit_id && unitPropertyMap[t.unit_id]) {
+                                    const p = unitPropertyMap[t.unit_id].toLowerCase();
+                                    if (p === 'east') propData.east++;
+                                    else if (p === 'west') propData.west++;
+                                }
+                            });
+                        }
+                    } catch (e) { console.error('Property stats error', e); }
                     this.charts.byProperty = { east: propData.east, west: propData.west, max: Math.max(propData.east, propData.west, 1) };
 
                     // By category — use categories endpoint
+                    // include_hidden=true so alert-only categories (Gas Leak) stay labeled in reporting
                     try {
-                        const cats = await app().apiGet('/api/tickets/categories/flat');
+                        const cats = await app().apiGet('/api/tickets/categories/flat?include_hidden=true');
                         const catCounts = {};
                         all.forEach(t => {
                             if (t.category_id) {
@@ -250,7 +270,7 @@
 
                     // Risk indicators
                     this.indicators = {
-                        openEmergencies: urgent.filter(t => !['Closed', 'Completed'].includes(t.status)).length,
+                        openEmergencies: urgent.filter(t => !['Closed', 'Completed', 'Cancelled'].includes(t.status)).length,
                         reopenedThisWeek,
                         overdueJobs: open.filter(t => t.sla_deadline && new Date(t.sla_deadline) < new Date()).length,
                         pendingVerification: all.filter(t => ['Completed', 'On-Field Verification'].includes(t.status)).length,
@@ -260,7 +280,7 @@
             },
 
             calcAvgResponse(all) {
-                const open = all.filter(t => !['Closed', 'Completed'].includes(t.status));
+                const open = all.filter(t => !['Closed', 'Completed', 'Cancelled'].includes(t.status));
                 if (!open.length) return '—';
                 const avgHrs = open.reduce((sum, t) => sum + Math.min((new Date() - new Date(t.created_at)) / (1000 * 60 * 60), 168), 0) / open.length;
                 if (avgHrs < 1) return `${Math.round(avgHrs * 60)}m`;

app/templates/dashboard/cs.html

@@ -70,23 +70,24 @@
         <!-- Open by Priority -->
         <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-5">
             <h3 class="text-sm font-semibold text-gray-700 uppercase tracking-wide mb-4">Open by Priority</h3>
-            <div class="space-y-3">
-                <div class="flex items-center justify-between">
+            <div class="space-y-2">
+                <a href="/tickets?group=priority&priority=urgent" class="flex items-center justify-between rounded-lg px-2 py-1.5 hover:bg-red-50 transition">
                     <span class="text-red-600 font-medium">🔴 Urgent</span>
                     <span class="text-2xl font-bold" x-text="kpi.byPriority?.urgent || 0"></span>
-                </div>
-                <div class="flex items-center justify-between">
+                </a>
+                <a href="/tickets?group=priority&priority=high" class="flex items-center justify-between rounded-lg px-2 py-1.5 hover:bg-orange-50 transition">
                     <span class="text-orange-600 font-medium">🟠 High</span>
                     <span class="text-2xl font-bold" x-text="kpi.byPriority?.high || 0"></span>
-                </div>
-                <div class="flex items-center justify-between">
+                </a>
+                <a href="/tickets?group=priority&priority=medium" class="flex items-center justify-between rounded-lg px-2 py-1.5 hover:bg-yellow-50 transition">
                     <span class="text-yellow-600 font-medium">🟡 Medium</span>
                     <span class="text-2xl font-bold" x-text="kpi.byPriority?.medium || 0"></span>
-                </div>
-                <div class="flex items-center justify-between">
+                </a>
+                <a href="/tickets?group=priority&priority=low" class="flex items-center justify-between rounded-lg px-2 py-1.5 hover:bg-green-50 transition">
                     <span class="text-green-600 font-medium">🟢 Low</span>
                     <span class="text-2xl font-bold" x-text="kpi.byPriority?.low || 0"></span>
-                </div>
+                </a>
+                <p class="text-[11px] text-gray-400 pt-1">Click a row to open the priority-grouped queue.</p>
             </div>
         </div>
 
@@ -187,20 +188,20 @@
                     const newToday = all.filter(t => new Date(t.created_at) >= today && t.status === 'New').length;
 
                     // Open tickets (not closed/completed)
-                    const open = all.filter(t => !['Closed', 'Completed'].includes(t.status));
+                    const open = all.filter(t => !['Closed', 'Completed', 'Cancelled'].includes(t.status));
 
                     // By priority
                     const byPriority = { urgent: 0, high: 0, medium: 0, low: 0 };
                     open.forEach(t => { if (t.priority) byPriority[t.priority] = (byPriority[t.priority] || 0) + 1; });
 
                     // Oldest unassigned
-                    const unassigned = all.filter(t => !t.assigned_to && !['Closed', 'Completed'].includes(t.status))
+                    const unassigned = all.filter(t => !t.assigned_to && !['Closed', 'Completed', 'Cancelled'].includes(t.status))
                         .sort((a, b) => new Date(a.created_at) - new Date(b.created_at));
                     this.oldestUnassigned = unassigned[0] || null;
 
                     // SLA compliance (rough: tickets with sla_deadline not breached)
                     const withSLA = all.filter(t => t.sla_deadline);
-                    const slaMet = withSLA.filter(t => new Date(t.sla_deadline) > new Date() || ['Closed', 'Completed'].includes(t.status));
+                    const slaMet = withSLA.filter(t => new Date(t.sla_deadline) > new Date() || ['Closed', 'Completed', 'Cancelled'].includes(t.status));
 
                     this.kpi = {
                         newToday,
@@ -229,7 +230,7 @@
 
             calcAvgResponse(all) {
                 // Rough approximation — in real system this would come from timeline analysis
-                const open = all.filter(t => !['Closed', 'Completed'].includes(t.status));
+                const open = all.filter(t => !['Closed', 'Completed', 'Cancelled'].includes(t.status));
                 if (!open.length) return '—';
                 const avgHrs = open.reduce((sum, t) => {
                     const diff = (new Date() - new Date(t.created_at)) / (1000 * 60 * 60);

app/templates/dashboard/fm.html

@@ -127,11 +127,18 @@
 
     <!-- Active Tickets Table -->
     <div class="bg-white rounded-xl shadow-sm border border-gray-200">
-        <div class="px-5 py-4 border-b border-gray-200 flex items-center justify-between">
+        <div class="px-5 py-4 border-b border-gray-200 flex flex-wrap items-center justify-between gap-3">
             <h3 class="text-sm font-semibold text-gray-700 uppercase tracking-wide">Active Tickets</h3>
-            <a href="/tickets" class="text-sm text-denya-600 hover:text-denya-800">View All →</a>
+            <div class="flex items-center space-x-3">
+                <label class="flex items-center space-x-2 text-sm font-medium text-gray-700 cursor-pointer select-none">
+                    <input type="checkbox" x-model="groupByPriority" class="rounded border-gray-300 text-denya-600 focus:ring-denya-500">
+                    <span>Group by priority</span>
+                </label>
+                <button x-show="groupByPriority" @click="ageDir = ageDir === 'asc' ? 'desc' : 'asc'" class="px-2 py-1 text-xs border border-gray-300 rounded-lg hover:bg-gray-50 text-gray-600" x-text="ageDir === 'desc' ? 'Newest first ↓' : 'Oldest first ↑'"></button>
+                <a href="/tickets" class="text-sm text-denya-600 hover:text-denya-800">View All →</a>
+            </div>
         </div>
-        <div class="overflow-x-auto">
+        <div class="overflow-x-auto" x-show="!groupByPriority">
             <table class="w-full text-sm">
                 <thead class="bg-gray-50 text-gray-600 text-xs uppercase tracking-wider">
                     <tr>
@@ -160,6 +167,32 @@
                 </tbody>
             </table>
         </div>
+        <div class="space-y-3 p-3" x-show="groupByPriority">
+            <template x-for="meta in priorityGroupMeta()" :key="meta.key">
+                <div x-show="(groupedActiveTickets[meta.key] || []).length" class="rounded-xl border border-gray-200 overflow-hidden">
+                    <div class="px-4 py-2.5 flex items-center justify-between border-b border-gray-100" :class="meta.cls">
+                        <span class="text-sm font-semibold text-gray-800" x-text="`${meta.label} (${groupedActiveTickets[meta.key].length})`"></span>
+                    </div>
+                    <div class="overflow-x-auto">
+                        <table class="w-full text-sm">
+                            <tbody class="divide-y divide-gray-100">
+                                <template x-for="ticket in groupedActiveTickets[meta.key]" :key="ticket.id">
+                                    <tr class="hover:bg-gray-50 transition cursor-pointer" @click="window.location.href='/tickets/'+ticket.id">
+                                        <td class="px-5 py-3 font-medium text-denya-600" x-text="ticket.ticket_number"></td>
+                                        <td class="px-5 py-3"><span class="px-2 py-1 rounded-full text-xs font-medium" :class="statusClass(ticket.status)" x-text="ticket.status"></span></td>
+                                        <td class="px-5 py-3"><span class="px-2 py-1 rounded text-xs font-medium" :class="priorityClass(ticket.priority)" x-text="priorityBadge(ticket.priority)"></span></td>
+                                        <td class="px-5 py-3 text-gray-600" x-text="ticket.assigned_technician_name || 'Unassigned'"></td>
+                                        <td class="px-5 py-3 text-gray-600 max-w-xs truncate" x-text="ticket.description || ''"></td>
+                                        <td class="px-5 py-3 text-xs font-medium" :class="timeSince(ticket.created_at).includes('d') && parseInt(timeSince(ticket.created_at)) > 3 ? 'text-red-600' : 'text-gray-500'" x-text="timeSince(ticket.created_at)"></td>
+                                    </tr>
+                                </template>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </template>
+            <div x-show="!activeTickets.length" class="px-5 py-12 text-center text-gray-400">No active tickets</div>
+        </div>
     </div>
 </div>
 
@@ -171,6 +204,12 @@
             aging: {},
             activeTickets: [],
             emergencyCount: 0,
+            groupByPriority: false,
+            ageDir: 'desc',
+
+            get groupedActiveTickets() {
+                return app().groupByPriority(this.activeTickets, this.ageDir);
+            },
 
             async init() {
                 await this.loadData();
@@ -183,7 +222,7 @@
                     const all = data.items;
 
                     // Active: not closed/completed
-                    const active = all.filter(t => !['Closed', 'Completed'].includes(t.status));
+                    const active = all.filter(t => !['Closed', 'Completed', 'Cancelled'].includes(t.status));
                     this.activeTickets = active;
 
                     // KPIs
@@ -203,16 +242,13 @@
                     // Emergency
                     this.emergencyCount = active.filter(t => t.priority === 'urgent').length;
 
-                    // East vs West — we need full tickets with unit info
-                    // For now, estimate from overall data or show placeholder
-                    // We'll load again with property filter or just use total
+                    // East vs West — compute from loaded tickets using unit map
                     try {
-                        const east = await app().apiGet('/api/tickets?property=East&page_size=1');
-                        const west = await app().apiGet('/api/tickets?property=West&page_size=1');
-                        const eastTotal = east?.total || 0;
-                        const westTotal = west?.total || 0;
-                        this.kpi.eastJobs = eastTotal;
-                        this.kpi.westJobs = westTotal;
+                        const units = await app().apiGet('/api/tickets/units');
+                        const unitMap = {};
+                        if (units) units.forEach(u => { unitMap[u.id] = u.property; });
+                        this.kpi.eastJobs = active.filter(t => t.unit_id && unitMap[t.unit_id] === 'East').length;
+                        this.kpi.westJobs = active.filter(t => t.unit_id && unitMap[t.unit_id] === 'West').length;
                     } catch (e) { console.error('Property stats error', e); }
 
                     // Tech workload (simulated from assigned_to counts)
@@ -231,11 +267,11 @@
                         under24h: active.filter(t => (now - new Date(t.created_at)) < 24 * 60 * 60 * 1000).length,
                         oneToTwoDays: active.filter(t => {
                             const diff = (now - new Date(t.created_at)) / (1000 * 60 * 60 * 24);
-                            return diff >= 1 && diff < 2;
+                            return diff >= 1 && diff < 3;
                         }).length,
                         threeToFiveDays: active.filter(t => {
                             const diff = (now - new Date(t.created_at)) / (1000 * 60 * 60 * 24);
-                            return diff >= 2 && diff < 5;
+                            return diff >= 3 && diff < 5;
                         }).length,
                         overFiveDays: active.filter(t => (now - new Date(t.created_at)) / (1000 * 60 * 60 * 24) >= 5).length,
                     };

app/templates/tickets/detail.html

@@ -115,12 +115,16 @@
                             </div>
                             <div class="flex justify-between">
                                 <dt class="text-sm text-gray-500">Assigned To</dt>
-                                <dd class="text-sm font-medium text-gray-900" x-text="ticket.assigned_technician?.full_name || 'Unassigned'"></dd>
+                                <dd class="text-sm font-medium text-gray-900" x-text="ticket.assigned_technician_name || 'Unassigned'"></dd>
                             </div>
                             <div class="flex justify-between">
                                 <dt class="text-sm text-gray-500">Reporter</dt>
                                 <dd class="text-sm font-medium text-gray-900" x-text="ticket.reporter || '—'"></dd>
                             </div>
+                            <div class="flex justify-between" x-show="ticket.phone">
+                                <dt class="text-sm text-gray-500">Phone</dt>
+                                <dd class="text-sm font-medium text-gray-900" x-text="ticket.phone"></dd>
+                            </div>
                             <div class="flex justify-between">
                                 <dt class="text-sm text-gray-500">Reported Via</dt>
                                 <dd class="text-sm font-medium text-gray-900 capitalize" x-text="ticket.reported_via || '—'"></dd>
@@ -200,20 +204,9 @@
                     <label class="block text-sm font-medium text-gray-700 mb-1">Current: <span class="font-bold" x-text="ticket.status"></span></label>
                     <select x-model="statusForm.newStatus" class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 outline-none">
                         <option value="">Select new status</option>
-                        <option value="Logged">Logged</option>
-                        <option value="Triage">Triage</option>
-                        <option value="Assigned">Assigned</option>
-                        <option value="Accepted">Accepted</option>
-                        <option value="Travelling">Travelling</option>
-                        <option value="On Site">On Site</option>
-                        <option value="In Progress">In Progress</option>
-                        <option value="Waiting Parts">Waiting Parts</option>
-                        <option value="Escalated">Escalated</option>
-                        <option value="Completed">Completed</option>
-                        <option value="On-Field Verification">On-Field Verification</option>
-                        <option value="Wahab Review">Wahab Review</option>
-                        <option value="Closed">Closed</option>
-                        <option value="Reopened">Reopened</option>
+                        <template x-for="target in availableTransitions" :key="target">
+                            <option :value="target" x-text="target"></option>
+                        </template>
                     </select>
                 </div>
                 <div>
@@ -298,6 +291,7 @@
             statusForm: { newStatus: '', note: '' },
             statusSubmitting: false,
             statusError: '',
+            availableTransitions: [],
 
             // Assign form
             assignForm: { technicianId: '' },
@@ -311,7 +305,8 @@
 
             async init() {
                 await this.loadTicket();
-                if (this.isFM || this.isAdmin) {
+                await this.loadTransitions();
+                if (app().isFM || app().isAdmin) {
                     await this.loadTechnicians();
                 }
             },
@@ -327,21 +322,25 @@
                 }
             },
 
-            async loadTechnicians() {
-                // Load all users and filter for Tech role
+            async loadTransitions() {
                 try {
-                    const me = await app().apiGet('/api/auth/me');
-                    // Users list not exposed via API directly, so use a known list
-                    // In a real system we'd have GET /api/users
-                    this.technicians = [
-                        { id: 8, full_name: 'Prosper' },
-                        { id: 9, full_name: 'Sam' },
-                        { id: 10, full_name: 'Steven' },
-                        { id: 11, full_name: 'Junior (Samuel)' },
-                        { id: 12, full_name: 'Francis' },
-                        { id: 13, full_name: 'Desmond Afful' },
-                    ];
-                } catch (e) { console.error('Tech load error', e); }
+                    const data = await app().apiGet(`/api/tickets/${this.ticketId}/transitions`);
+                    this.availableTransitions = (data && data.transitions) || [];
+                } catch (e) {
+                    console.error('Transitions load error', e);
+                    this.availableTransitions = [];
+                }
+            },
+
+            async loadTechnicians() {
+                try {
+                    const users = await app().apiGet('/api/auth/users');
+                    // Assign dropdown should only offer Tech-role staff
+                    this.technicians = (users || []).filter(u => u.role === 'Tech');
+                } catch (e) {
+                    console.error('Technicians load error', e);
+                    this.technicians = [];
+                }
             },
 
             async submitStatusUpdate() {
@@ -357,6 +356,7 @@
                     
                     const updated = await app().apiPatch(`/api/tickets/${this.ticketId}`, payload);
                     this.ticket = updated;
+                    await this.loadTransitions();
                     this.showStatusModal = false;
                     this.statusForm = { newStatus: '', note: '' };
                     app().showToast('Status updated', 'success');
@@ -379,6 +379,7 @@
                         assigned_to: parseInt(this.assignForm.technicianId)
                     });
                     this.ticket = updated;
+                    await this.loadTransitions();
                     this.showAssignModal = false;
                     app().showToast('Technician assigned', 'success');
                 } catch (e) {
@@ -392,9 +393,8 @@
                 if (!this.noteForm.note.trim()) return;
                 this.noteSubmitting = true;
                 try {
-                    // Use status update endpoint to add a note without changing status
-                    const updated = await app().apiPost(`/api/tickets/${this.ticketId}/status`, {
-                        status: this.ticket.status,
+                    // Use PATCH endpoint which now supports note-only updates
+                    const updated = await app().apiPatch(`/api/tickets/${this.ticketId}`, {
                         note: this.noteForm.note
                     });
                     this.ticket = updated;
@@ -402,7 +402,7 @@
                     this.noteForm.note = '';
                     app().showToast('Note added', 'success');
                 } catch (e) {
-                    app().showToast(e.message, 'error');
+                    // No need to show error here — api() base method already shows it
                 } finally {
                     this.noteSubmitting = false;
                 }

app/templates/tickets/list.html

@@ -14,7 +14,7 @@
 
     <!-- Filters -->
     <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-6">
-        <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-3">
+        <div class="grid grid-cols-2 md:grid-cols-4 xl:grid-cols-8 gap-3">
             <div>
                 <label class="block text-xs text-gray-500 font-medium mb-1">Search</label>
                 <input type="text" x-model="filters.search" @input.debounce="loadTickets()" placeholder="Ticket # or description..." class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none">
@@ -38,6 +38,7 @@
                     <option value="Wahab Review">Wahab Review</option>
                     <option value="Closed">Closed</option>
                     <option value="Reopened">Reopened</option>
+                    <option value="Cancelled">Cancelled</option>
                 </select>
             </div>
             <div>
@@ -52,12 +53,39 @@
             </div>
             <div>
                 <label class="block text-xs text-gray-500 font-medium mb-1">Property</label>
-                <select x-model="filters.property" @change="loadTickets()" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-denya-500 outline-none">
+                <select x-model="filters.property" @change="onPropertyChange()" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-denya-500 outline-none">
                     <option value="">All Properties</option>
                     <option value="East">Pavilion East</option>
                     <option value="West">Pavilion West</option>
                 </select>
             </div>
+            <div>
+                <label class="block text-xs text-gray-500 font-medium mb-1">Building</label>
+                <select x-model="filters.building" @change="onBuildingChange()" :disabled="!filters.property" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-denya-500 outline-none disabled:bg-gray-50 disabled:text-gray-400">
+                    <option value="">All Buildings</option>
+                    <template x-for="b in buildings" :key="b">
+                        <option :value="b" x-text="b"></option>
+                    </template>
+                </select>
+            </div>
+            <div class="relative">
+                <label class="block text-xs text-gray-500 font-medium mb-1">Apartment</label>
+                <input type="text" x-model="searchApartment" @focus="apartmentOpen = true" @input="apartmentOpen = true" @keydown.escape="apartmentOpen = false"
+                       :disabled="!filters.building" @blur="closeApartment()"
+                       :placeholder="filterUnit ? filterUnit.apartment_code : (filters.building ? 'Search apartment...' : 'Select building')"
+                       class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-denya-500 outline-none disabled:bg-gray-50 disabled:text-gray-400">
+                <div x-show="apartmentOpen && filteredApartments.length" class="absolute z-20 mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg max-h-40 overflow-y-auto">
+                    <template x-for="unit in filteredApartments" :key="unit.id">
+                        <button type="button" @mousedown.prevent="selectFilterUnit(unit)" class="block w-full text-left px-3 py-1.5 hover:bg-denya-50 text-xs">
+                            <span class="font-medium text-gray-800" x-text="unit.apartment_code"></span>
+                            <span class="text-gray-400" x-text="` · Floor ${unit.floor || '—'}`"></span>
+                        </button>
+                    </template>
+                </div>
+                <div x-show="apartmentOpen && !filteredApartments.length && filters.building" class="absolute z-20 mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg px-3 py-2 text-xs text-gray-400">
+                    No apartments match
+                </div>
+            </div>
             <div>
                 <label class="block text-xs text-gray-500 font-medium mb-1">From</label>
                 <input type="date" x-model="filters.dateFrom" @change="loadTickets()" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-denya-500 outline-none">
@@ -67,20 +95,27 @@
                 <input type="date" x-model="filters.dateTo" @change="loadTickets()" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-denya-500 outline-none">
             </div>
         </div>
-        <div class="mt-3 flex items-center justify-between">
-            <div class="flex items-center space-x-2">
+        <div class="mt-3 flex flex-wrap items-center justify-between gap-3">
+            <div class="flex items-center space-x-3">
+                <label class="flex items-center space-x-2 text-sm font-medium text-gray-700 cursor-pointer select-none">
+                    <input type="checkbox" x-model="groupByPriority" @change="syncUrl()" class="rounded border-gray-300 text-denya-600 focus:ring-denya-500">
+                    <span>Group by priority</span>
+                </label>
+                <div x-show="groupByPriority" class="flex items-center space-x-2 text-xs">
+                    <button @click="ageDir = ageDir === 'asc' ? 'desc' : 'asc'" class="px-2 py-1 border border-gray-300 rounded-lg hover:bg-gray-50 text-gray-600" x-text="ageDir === 'desc' ? 'Newest first ↓' : 'Oldest first ↑'"></button>
+                </div>
                 <span class="text-xs text-gray-500">Page <span x-text="page"></span> of <span x-text="totalPages"></span></span>
             </div>
             <div class="flex items-center space-x-2">
                 <button @click="page > 1 && (page--, loadTickets())" :disabled="page <= 1" class="px-3 py-1 text-sm border rounded hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed">Prev</button>
                 <button @click="page < totalPages && (page++, loadTickets())" :disabled="page >= totalPages" class="px-3 py-1 text-sm border rounded hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed">Next</button>
-                <button @click="filters = {search:'',status:'',priority:'',property:'',dateFrom:'',dateTo:''}; page=1; loadTickets()" class="px-3 py-1 text-sm text-gray-500 border rounded hover:bg-gray-50">Clear Filters</button>
+                <button @click="clearFilters()" class="px-3 py-1 text-sm text-gray-500 border rounded hover:bg-gray-50">Clear Filters</button>
             </div>
         </div>
     </div>
 
-    <!-- Tickets Table -->
-    <div class="bg-white rounded-xl shadow-sm border border-gray-200">
+    <!-- Tickets Table (flat) -->
+    <div class="bg-white rounded-xl shadow-sm border border-gray-200" x-show="!groupByPriority">
         <div class="overflow-x-auto">
             <table class="w-full text-sm">
                 <thead class="bg-gray-50 text-gray-600 text-xs uppercase tracking-wider">
@@ -108,7 +143,7 @@
                             <td class="px-5 py-3 text-gray-500 text-xs" x-text="ticket.assigned_technician_name || '—'"></td>
                             <td class="px-5 py-3 text-gray-500 text-xs" x-text="formatDate(ticket.created_at)"></td>
                             <td class="px-5 py-3">
-                                <span x-show="ticket.sla_deadline" class="text-xs" :class="new Date(ticket.sla_deadline) < new Date() && !['Closed','Completed'].includes(ticket.status) ? 'text-red-600 font-medium' : 'text-gray-400'">
+                                <span x-show="ticket.sla_deadline" class="text-xs" :class="new Date(ticket.sla_deadline) < new Date() && !['Closed','Completed','Cancelled'].includes(ticket.status) ? 'text-red-600 font-medium' : 'text-gray-400'">
                                     <span x-text="formatDateShort(ticket.sla_deadline)"></span>
                                 </span>
                                 <span x-show="!ticket.sla_deadline" class="text-xs text-gray-300">—</span>
@@ -125,6 +160,53 @@
             </table>
         </div>
     </div>
+
+    <!-- Tickets grouped by priority -->
+    <div class="space-y-4" x-show="groupByPriority">
+        <template x-for="meta in priorityGroupMeta()" :key="meta.key">
+            <div x-show="(groupedTickets[meta.key] || []).length" class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
+                <div class="px-5 py-3 flex items-center justify-between border-b border-gray-100" :class="meta.cls">
+                    <span class="text-sm font-semibold text-gray-800" x-text="`${meta.label} (${groupedTickets[meta.key].length})`"></span>
+                </div>
+                <div class="overflow-x-auto">
+                    <table class="w-full text-sm">
+                        <thead class="bg-gray-50 text-gray-600 text-xs uppercase tracking-wider">
+                            <tr>
+                                <th class="px-5 py-3 text-left">Ticket</th>
+                                <th class="px-5 py-3 text-left">Status</th>
+                                <th class="px-5 py-3 text-left">Priority</th>
+                                <th class="px-5 py-3 text-left">Description</th>
+                                <th class="px-5 py-3 text-left">Assigned To</th>
+                                <th class="px-5 py-3 text-left">Created</th>
+                                <th class="px-5 py-3 text-left">SLA</th>
+                            </tr>
+                        </thead>
+                        <tbody class="divide-y divide-gray-100">
+                            <template x-for="ticket in groupedTickets[meta.key]" :key="ticket.id">
+                                <tr class="hover:bg-gray-50 transition cursor-pointer" @click="window.location.href='/tickets/'+ticket.id">
+                                    <td class="px-5 py-3 font-medium text-denya-600" x-text="ticket.ticket_number"></td>
+                                    <td class="px-5 py-3"><span class="px-2 py-1 rounded-full text-xs font-medium" :class="statusClass(ticket.status)" x-text="ticket.status"></span></td>
+                                    <td class="px-5 py-3"><span class="px-2 py-1 rounded text-xs font-medium" :class="priorityClass(ticket.priority)" x-text="priorityBadge(ticket.priority)"></span></td>
+                                    <td class="px-5 py-3 text-gray-600 max-w-xs truncate" x-text="ticket.description || ''"></td>
+                                    <td class="px-5 py-3 text-gray-500 text-xs" x-text="ticket.assigned_technician_name || '—'"></td>
+                                    <td class="px-5 py-3 text-gray-500 text-xs" x-text="formatDate(ticket.created_at)"></td>
+                                    <td class="px-5 py-3">
+                                        <span x-show="ticket.sla_deadline" class="text-xs" :class="new Date(ticket.sla_deadline) < new Date() && !['Closed','Completed','Cancelled'].includes(ticket.status) ? 'text-red-600 font-medium' : 'text-gray-400'">
+                                            <span x-text="formatDateShort(ticket.sla_deadline)"></span>
+                                        </span>
+                                        <span x-show="!ticket.sla_deadline" class="text-xs text-gray-300">—</span>
+                                    </td>
+                                </tr>
+                            </template>
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </template>
+        <div x-show="!groupedTotal && !loading" class="bg-white rounded-xl shadow-sm border border-gray-200 px-5 py-16 text-center text-gray-400">
+            No tickets match your filters
+        </div>
+    </div>
 </div>
 
 <script>
@@ -137,25 +219,130 @@
             totalPages: 1,
             sortField: 'created_at',
             sortDir: 'desc',
+            groupByPriority: false,
+            ageDir: 'desc',
+            unitGroups: {},
+            buildings: [],
+            searchApartment: '',
+            apartmentOpen: false,
+            filterUnit: null,
             filters: {
                 search: '',
                 status: '',
                 priority: '',
                 property: '',
+                building: '',
+                unitId: '',
                 dateFrom: '',
                 dateTo: ''
             },
 
             async init() {
+                this.applyUrlParams();
+                await this.loadUnits();
                 await this.loadTickets();
             },
 
+            applyUrlParams() {
+                const params = new URLSearchParams(window.location.search);
+                if (params.get('group') === 'priority') this.groupByPriority = true;
+                if (params.get('priority')) this.filters.priority = params.get('priority');
+                if (params.get('property')) this.filters.property = params.get('property');
+                if (params.get('building')) this.filters.building = params.get('building');
+                if (params.get('unit_id')) this.filters.unitId = params.get('unit_id');
+            },
+
+            syncUrl() {
+                const params = new URLSearchParams();
+                if (this.groupByPriority) params.set('group', 'priority');
+                if (this.filters.priority) params.set('priority', this.filters.priority);
+                if (this.filters.property) params.set('property', this.filters.property);
+                if (this.filters.building) params.set('building', this.filters.building);
+                if (this.filters.unitId) params.set('unit_id', this.filters.unitId);
+                const qs = params.toString();
+                const url = qs ? `/tickets?${qs}` : '/tickets';
+                window.history.replaceState({}, '', url);
+            },
+
+            async loadUnits() {
+                try {
+                    const data = await app().apiGet('/api/tickets/units/grouped');
+                    this.unitGroups = data || {};
+                    if (this.filters.property) this.buildings = Object.keys(this.unitGroups[this.filters.property] || {});
+                    if (this.filters.unitId) {
+                        // Restore displayed apartment for a unit_id deep link
+                        Object.values(this.unitGroups).forEach(prop => Object.values(prop).forEach(units => {
+                            const u = (units || []).find(x => x.id == this.filters.unitId);
+                            if (u) this.filterUnit = u;
+                        }));
+                    }
+                } catch (e) { console.error('Units load error', e); }
+            },
+
+            onPropertyChange() {
+                this.filters.building = '';
+                this.filters.unitId = '';
+                this.filterUnit = null;
+                this.searchApartment = '';
+                this.buildings = this.filters.property ? Object.keys(this.unitGroups[this.filters.property] || {}) : [];
+                this.loadTickets();
+                this.syncUrl();
+            },
+
+            onBuildingChange() {
+                this.filters.unitId = '';
+                this.filterUnit = null;
+                this.searchApartment = '';
+                this.loadTickets();
+                this.syncUrl();
+            },
+
+            get buildingUnits() {
+                if (!this.filters.property || !this.filters.building) return [];
+                return this.unitGroups[this.filters.property]?.[this.filters.building] || [];
+            },
+
+            get filteredApartments() {
+                const q = (this.searchApartment || '').toLowerCase().trim();
+                let units = this.buildingUnits;
+                if (q) {
+                    units = units.filter(u =>
+                        (u.apartment_code || '').toLowerCase().includes(q) ||
+                        String(u.floor || '').includes(q)
+                    );
+                }
+                return units;
+            },
+
+            closeApartment() {
+                setTimeout(() => { this.apartmentOpen = false; }, 150);
+            },
+
+            selectFilterUnit(unit) {
+                this.filterUnit = unit;
+                this.filters.unitId = unit.id;
+                this.searchApartment = unit.apartment_code;
+                this.apartmentOpen = false;
+                this.loadTickets();
+                this.syncUrl();
+            },
+
+            get groupedTickets() {
+                return app().groupByPriority(this.tickets, this.ageDir);
+            },
+
+            get groupedTotal() {
+                return Object.values(this.groupedTickets).reduce((n, g) => n + g.length, 0);
+            },
+
             async loadTickets() {
                 try {
                     let url = `/api/tickets?page=${this.page}&page_size=${this.pageSize}`;
                     if (this.filters.status) url += `&status=${encodeURIComponent(this.filters.status)}`;
                     if (this.filters.priority) url += `&priority=${encodeURIComponent(this.filters.priority)}`;
                     if (this.filters.property) url += `&property=${encodeURIComponent(this.filters.property)}`;
+                    if (this.filters.building) url += `&building=${encodeURIComponent(this.filters.building)}`;
+                    if (this.filters.unitId) url += `&unit_id=${encodeURIComponent(this.filters.unitId)}`;
                     if (this.filters.dateFrom) url += `&date_from=${encodeURIComponent(this.filters.dateFrom)}`;
                     if (this.filters.dateTo) url += `&date_to=${encodeURIComponent(this.filters.dateTo)}`;
 
@@ -204,6 +391,16 @@
                     if (valA > valB) return this.sortDir === 'asc' ? 1 : -1;
                     return 0;
                 });
+            },
+
+            clearFilters() {
+                this.filters = { search: '', status: '', priority: '', property: '', building: '', unitId: '', dateFrom: '', dateTo: '' };
+                this.filterUnit = null;
+                this.searchApartment = '';
+                this.buildings = [];
+                this.page = 1;
+                this.loadTickets();
+                this.syncUrl();
             }
         }
     }

app/templates/tickets/new.html

@@ -6,6 +6,25 @@
         <p class="text-gray-500 mt-1">Report a maintenance or customer service issue</p>
     </div>
 
+    <!-- Report Mode: Standard / Emergency quick path -->
+    <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 max-w-3xl mb-6">
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
+            <button type="button" @click="setMode('standard')" class="flex items-center justify-center space-x-2 px-4 py-3 rounded-xl border-2 text-sm font-medium transition"
+                    :class="mode === 'standard' ? 'border-denya-500 bg-denya-50 text-denya-700' : 'border-gray-200 text-gray-600 hover:bg-gray-50'">
+                <span>Standard Issue</span>
+            </button>
+            <button type="button" @click="setMode('emergency')" class="flex items-center justify-center space-x-2 px-4 py-3 rounded-xl border-2 text-sm font-medium transition"
+                    :class="mode === 'emergency' ? 'border-red-500 bg-red-50 text-red-700' : 'border-gray-200 text-gray-600 hover:bg-gray-50'">
+                <span>🚨 Emergency</span>
+            </button>
+        </div>
+        <p x-show="mode === 'emergency'" class="mt-3 text-xs text-red-600 leading-relaxed">
+            Emergency reports (gas leak, fire, flood, electrical hazard) are created with 🔴 Urgent priority and urgent SLA targets apply.
+            The Gas Leak category is available here only — it stays hidden from the standard issue list.
+        </p>
+        <p x-show="mode === 'standard'" class="mt-3 text-xs text-gray-400">Standard maintenance or customer service issues.</p>
+    </div>
+
     <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 max-w-3xl">
         <form @submit.prevent="submitTicket" class="space-y-5">
             <!-- Row: Customer Name + Phone -->
@@ -20,36 +39,56 @@
                 </div>
             </div>
 
-            <!-- Row: Property + Apartment -->
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <div>
-                    <label class="block text-sm font-medium text-gray-700 mb-1">Property <span class="text-red-500">*</span></label>
-                    <select x-model="form.property" @change="loadUnits()" class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none">
-                        <option value="">Select Property</option>
-                        <option value="East">Pavilion East</option>
-                        <option value="West">Pavilion West</option>
-                    </select>
-                </div>
-                <div>
-                    <label class="block text-sm font-medium text-gray-700 mb-1">Apartment <span class="text-red-500">*</span></label>
-                    <select x-model="form.apartment_code" class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none" :disabled="!form.property">
-                        <option value="">Select Apartment</option>
-                        <template x-for="unit in units" :key="unit.id">
-                            <option :value="unit.apartment_code" x-text="unit.apartment_code"></option>
-                        </template>
-                    </select>
+            <!-- Row: Property → Building → Apartment (3-level cascade + searchable combobox) -->
+            <div>
+                <label class="block text-sm font-medium text-gray-700 mb-1">Location <span class="text-red-500">*</span></label>
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+                    <div>
+                        <select x-model="form.property" @change="onPropertyChange()" class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none">
+                            <option value="">Property</option>
+                            <option value="East">Pavilion East</option>
+                            <option value="West">Pavilion West</option>
+                        </select>
+                    </div>
+                    <div>
+                        <select x-model="form.building" @change="onBuildingChange()" class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none" :disabled="!form.property">
+                            <option value="">Building</option>
+                            <template x-for="b in buildings" :key="b">
+                                <option :value="b" x-text="b"></option>
+                            </template>
+                        </select>
+                    </div>
+                    <div class="relative">
+                        <input type="text" x-model="searchApartment" @focus="apartmentOpen = true" @input="apartmentOpen = true" @keydown.escape="apartmentOpen = false"
+                               :disabled="!form.building" @blur="closeApartment()"
+                               :placeholder="form.apartment_code ? form.apartment_code : (form.building ? 'Search apartment (e.g. 011E, 505, 10W)...' : 'Select building first')"
+                               class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none disabled:bg-gray-50 disabled:text-gray-400">
+                        <div x-show="apartmentOpen && filteredApartments.length" class="absolute z-20 mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg max-h-48 overflow-y-auto">
+                            <template x-for="unit in filteredApartments" :key="unit.id">
+                                <button type="button" @mousedown.prevent="selectApartment(unit)" class="block w-full text-left px-3 py-2 hover:bg-denya-50 text-sm">
+                                    <span class="font-medium text-gray-800" x-text="unit.apartment_code"></span>
+                                    <span class="text-xs text-gray-400" x-text="` · Floor ${unit.floor || '—'} · ${unit.building || ''}`"></span>
+                                </button>
+                            </template>
+                        </div>
+                        <div x-show="apartmentOpen && !filteredApartments.length && form.building" class="absolute z-20 mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg px-3 py-2 text-xs text-gray-400">
+                            No apartments match “<span x-text="searchApartment"></span>”
+                        </div>
+                    </div>
                 </div>
+                <p class="mt-1 text-xs text-gray-400">Property → Building → Apartment. Search matches apartment code, floor, or building.</p>
             </div>
 
             <!-- Category -->
             <div>
                 <label class="block text-sm font-medium text-gray-700 mb-1">Category <span class="text-red-500">*</span></label>
-                <select x-model="form.category_main" @change="loadSubCategories()" class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none">
+                <select x-model="form.category_main" @change="onCategoryChange()" class="w-full px-4 py-2.5 rounded-lg border border-gray-300 focus:ring-2 focus:ring-denya-500 focus:border-transparent outline-none">
                     <option value="">Select Category</option>
                     <template x-for="cat in categories" :key="cat.id">
                         <option :value="cat.id" x-text="cat.name"></option>
                     </template>
                 </select>
+                <div x-show="selectedCategoryHint" class="mt-2 text-xs text-gray-600 bg-amber-50 border border-amber-200 rounded-lg px-3 py-2" x-text="selectedCategoryHint"></div>
             </div>
             <div x-show="subCategories.length">
                 <label class="block text-sm font-medium text-gray-700 mb-1">Sub-Category</label>
@@ -62,23 +101,29 @@
             </div>
 
             <!-- Priority -->
-            <div>
+            <div x-show="mode === 'emergency'">
+                <label class="block text-sm font-medium text-gray-700 mb-1">Priority</label>
+                <div class="p-3 bg-red-50 border border-red-200 rounded-lg text-sm text-red-700 font-medium">
+                    🔴 Urgent — fixed for emergency reports (15 min response / 4 h resolution SLA)
+                </div>
+            </div>
+            <div x-show="mode === 'standard'">
                 <label class="block text-sm font-medium text-gray-700 mb-1">Priority</label>
                 <div class="grid grid-cols-2 md:grid-cols-4 gap-2">
                     <label class="flex items-center p-3 border rounded-lg cursor-pointer hover:bg-gray-50" :class="form.priority === 'urgent' ? 'border-red-500 bg-red-50' : 'border-gray-200'">
-                        <input type="radio" name="priority" value="urgent" x-model="form.priority" class="sr-only">
+                        <input type="radio" name="priority" value="urgent" x-model="form.priority" @change="priorityAuto = false" class="sr-only">
                         <span class="text-sm">🔴 Urgent</span>
                     </label>
                     <label class="flex items-center p-3 border rounded-lg cursor-pointer hover:bg-gray-50" :class="form.priority === 'high' ? 'border-orange-500 bg-orange-50' : 'border-gray-200'">
-                        <input type="radio" name="priority" value="high" x-model="form.priority" class="sr-only">
+                        <input type="radio" name="priority" value="high" x-model="form.priority" @change="priorityAuto = false" class="sr-only">
                         <span class="text-sm">🟠 High</span>
                     </label>
                     <label class="flex items-center p-3 border rounded-lg cursor-pointer hover:bg-gray-50" :class="form.priority === 'medium' ? 'border-yellow-500 bg-yellow-50' : 'border-gray-200'">
-                        <input type="radio" name="priority" value="medium" x-model="form.priority" class="sr-only">
+                        <input type="radio" name="priority" value="medium" x-model="form.priority" @change="priorityAuto = false" class="sr-only">
                         <span class="text-sm">🟡 Medium</span>
                     </label>
                     <label class="flex items-center p-3 border rounded-lg cursor-pointer hover:bg-gray-50" :class="form.priority === 'low' ? 'border-green-500 bg-green-50' : 'border-gray-200'">
-                        <input type="radio" name="priority" value="low" x-model="form.priority" class="sr-only">
+                        <input type="radio" name="priority" value="low" x-model="form.priority" @change="priorityAuto = false" class="sr-only">
                         <span class="text-sm">🟢 Low</span>
                     </label>
                 </div>
@@ -104,7 +149,7 @@
                         <option value="walk-in">Walk-in</option>
                         <option value="whatsapp">WhatsApp</option>
                         <option value="agent">Agent</option>
-                        <option value="qr">QR Code</option>
+                        <!-- QR Code excluded per Sprint 3 scope -->
                     </select>
                 </div>
             </div>
@@ -136,7 +181,7 @@
             <div class="flex items-center space-x-3 pt-2">
                 <button type="submit" :disabled="submitting" class="px-6 py-2.5 bg-denya-600 text-white rounded-lg hover:bg-denya-700 transition font-medium disabled:opacity-50 disabled:cursor-not-allowed flex items-center space-x-2">
                     <svg x-show="submitting" class="animate-spin h-4 w-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"/><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"/></svg>
-                    <span x-text="submitting ? 'Creating...' : 'Create Issue'"></span>
+                    <span x-text="submitting ? 'Creating...' : (mode === 'emergency' ? 'Create Emergency Issue' : 'Create Issue')"></span>
                 </button>
                 <a href="/tickets" class="px-6 py-2.5 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 transition font-medium">Cancel</a>
             </div>
@@ -147,11 +192,14 @@
 <script>
     function createTicket() {
         return {
+            mode: 'standard',
             form: {
                 customer_name: '',
                 phone: '',
                 property: '',
+                building: '',
                 apartment_code: '',
+                unit: null,
                 category_main: '',
                 category_id: null,
                 priority: '',
@@ -159,9 +207,14 @@
                 reporter: '',
                 reported_via: ''
             },
+            priorityAuto: false,
             categories: [],
             subCategories: [],
-            units: [],
+            unitGroups: {},
+            buildings: [],
+            searchApartment: '',
+            apartmentOpen: false,
+            selectedCategoryHint: '',
             photoFiles: [],
             photoPreviews: [],
             submitting: false,
@@ -169,44 +222,115 @@
 
             async init() {
                 await this.loadCategories();
+                await this.loadUnits();
+            },
+
+            // ── Report mode ──────────────────────────────────────────
+            setMode(mode) {
+                this.mode = mode;
+                // Reset category selection; priority follows mode
+                this.form.category_main = '';
+                this.form.category_id = null;
+                this.subCategories = [];
+                this.selectedCategoryHint = '';
+                if (mode === 'emergency') {
+                    this.form.priority = 'urgent';
+                } else {
+                    this.form.priority = '';
+                }
+                this.priorityAuto = false;
+                this.loadCategories();
             },
 
             async loadCategories() {
                 try {
-                    const data = await app().apiGet('/api/tickets/categories');
+                    const url = this.mode === 'emergency'
+                        ? '/api/tickets/categories?type=emergency&include_hidden=true'
+                        : '/api/tickets/categories';
+                    const data = await app().apiGet(url);
                     // Top-level categories only
                     this.categories = data?.filter(c => !c.parent_id) || [];
                 } catch (e) { console.error('Categories load error', e); }
             },
 
-            async loadSubCategories() {
-                this.form.category_id = null;
-                this.subCategories = [];
-                if (!this.form.category_main) return;
+            async loadUnits() {
                 try {
-                    const data = await app().apiGet('/api/tickets/categories');
-                    const parent = data?.find(c => c.id == this.form.category_main);
-                    if (parent?.children) {
-                        this.subCategories = parent.children;
-                    }
-                } catch (e) { console.error('Subcategories load error', e); }
+                    const data = await app().apiGet('/api/tickets/units/grouped');
+                    this.unitGroups = data || {};
+                } catch (e) { console.error('Units load error', e); }
             },
 
-            async loadUnits() {
+            // ── Location cascade ─────────────────────────────────────
+            onPropertyChange() {
+                this.form.building = '';
                 this.form.apartment_code = '';
-                this.units = [];
-                if (!this.form.property) return;
-                // Units aren't directly exposed via API, so we'll construct from known patterns
-                const prefix = this.form.property === 'East' ? 'E' : 'W';
-                const units = [];
-                const buildings = ['A', 'B', 'C', 'D', 'E', 'F'];
-                for (let floor = 1; floor <= 10; floor++) {
-                    for (const bld of buildings) {
-                        const code = `${floor}0${bld}${prefix}`;
-                        units.push({ id: code, apartment_code: code });
-                    }
+                this.form.unit = null;
+                this.searchApartment = '';
+                const prop = this.form.property;
+                this.buildings = prop ? Object.keys(this.unitGroups[prop] || {}) : [];
+            },
+
+            onBuildingChange() {
+                this.form.apartment_code = '';
+                this.form.unit = null;
+                this.searchApartment = '';
+            },
+
+            get buildingUnits() {
+                if (!this.form.property || !this.form.building) return [];
+                return this.unitGroups[this.form.property]?.[this.form.building] || [];
+            },
+
+            get filteredApartments() {
+                const q = (this.searchApartment || '').toLowerCase().trim();
+                let units = this.buildingUnits;
+                if (q) {
+                    units = units.filter(u =>
+                        (u.apartment_code || '').toLowerCase().includes(q) ||
+                        (u.building || '').toLowerCase().includes(q) ||
+                        String(u.floor || '').includes(q)
+                    );
+                }
+                return units;
+            },
+
+            closeApartment() {
+                setTimeout(() => { this.apartmentOpen = false; }, 150);
+            },
+
+            selectApartment(unit) {
+                this.form.unit = unit;
+                this.form.apartment_code = unit.apartment_code;
+                this.searchApartment = unit.apartment_code;
+                this.apartmentOpen = false;
+            },
+
+            // ── Category helpers ─────────────────────────────────────
+            onCategoryChange() {
+                this.form.category_id = null;
+                this.subCategories = [];
+                this.selectedCategoryHint = '';
+                if (!this.form.category_main) return;
+                const parent = this.categories.find(c => c.id == this.form.category_main);
+                if (parent?.children) {
+                    this.subCategories = parent.children;
+                }
+                const hints = {
+                    'Carpentry': 'Triage tip: use Carpentry for structural timber, door and frame work; Furniture for movable pieces (beds, chairs, tables, wardrobes); Security for lock, latch and door-closing functionality.',
+                    'Mould & Damp': 'Damp / mould remediation. Priority defaults to 🟡 Medium unless you change it.',
+                    'Aluminum/Glass': 'Windows, doors, sliding/fixed panels, glass and mirror replacement.'
+                };
+                if (parent?.name && hints[parent.name]) this.selectedCategoryHint = hints[parent.name];
+                // Mould & Damp defaults to Medium priority; clear the auto-default
+                // when switching away so a non-Mould ticket doesn't keep it silently
+                if (parent?.name !== 'Mould & Damp' && this.priorityAuto) {
+                    this.form.priority = '';
+                    this.priorityAuto = false;
+                }
+                if (parent?.name === 'Mould & Damp' && !this.form.priority) {
+                    this.form.priority = 'medium';
+                    this.priorityAuto = true;
                 }
-                this.units = units;
             },
 
             handlePhotos(e) {
@@ -234,8 +358,18 @@
 
                 try {
                     // Validate required fields
-                    if (!this.form.property || !this.form.apartment_code || !this.form.description) {
-                        this.error = 'Please fill in Property, Apartment, and Description.';
+                    if (!this.form.property || !this.form.building || !this.form.unit || !this.form.description) {
+                        this.error = 'Please fill in Property, Building, Apartment, and Description.';
+                        this.submitting = false;
+                        return;
+                    }
+                    if (!this.form.category_main && !this.form.category_id) {
+                        this.error = 'Please select a Category — every issue needs one for correct routing and SLA.';
+                        this.submitting = false;
+                        return;
+                    }
+                    if (this.mode === 'standard' && !this.form.priority) {
+                        this.error = 'Please select a Priority — without one the ticket gets no SLA deadline.';
                         this.submitting = false;
                         return;
                     }
@@ -243,10 +377,13 @@
                     // Create the ticket
                     const payload = {
                         description: this.form.description,
-                        priority: this.form.priority || null,
-                        reporter: this.form.reporter || this.user.full_name,
+                        priority: this.mode === 'emergency' ? 'urgent' : (this.form.priority || null),
+                        reporter: this.form.reporter || this.form.customer_name || app().user.full_name,
                         reported_via: this.form.reported_via || 'walk-in',
                         category_id: this.form.category_id ? parseInt(this.form.category_id) : (this.form.category_main ? parseInt(this.form.category_main) : null),
+                        unit_id: this.form.unit.id,
+                        customer_name: this.form.customer_name || null,
+                        phone: this.form.phone || null,
                     };
 
                     const ticket = await app().apiPost('/api/tickets', payload);

pyproject.toml

@@ -22,8 +22,14 @@ build-backend = "setuptools.build_meta"
 [tool.setuptools.packages.find]
 include = ["app*"]
 
+[tool.pytest.ini_options]
+asyncio_mode = "auto"
+testpaths = ["tests"]
+pythonpath = ["."]
+
 [project.optional-dependencies]
 dev = [
     "pytest>=8.0",
+    "pytest-asyncio>=0.24",
     "httpx>=0.27.0",
 ]

tests/conftest.py

@@ -0,0 +1,66 @@
+"""Shared fixtures for the Denya OneCare test suite.
+
+Sets DATABASE_URL to an isolated temp SQLite file BEFORE importing any app
+module (the engine is created at import time), then provisions tables and
+seed data per test.
+"""
+
+from __future__ import annotations
+
+import os
+import tempfile
+
+_TMP_DIR = tempfile.mkdtemp(prefix="denya-test-")
+os.environ["DATABASE_URL"] = f"sqlite+aiosqlite:///{_TMP_DIR}/test.db"
+
+import pytest_asyncio  # noqa: E402  (DATABASE_URL must be set before app imports)
+from httpx import ASGITransport, AsyncClient  # noqa: E402
+
+from app.core.database import Base, async_session_factory, engine  # noqa: E402
+from app.main import app  # noqa: E402
+from app.models.ticket import Ticket  # noqa: E402
+from app.services.seed import seed_categories, seed_units, seed_users  # noqa: E402
+
+
+@pytest_asyncio.fixture
+async def client():
+    """Async test client with a fresh, seeded database per test."""
+    async with engine.begin() as conn:
+        await conn.run_sync(Base.metadata.create_all)
+    async with async_session_factory() as session:
+        await seed_users(session)
+        await session.commit()
+        # json_path=None → built-in fallback units (same data as the committed
+        # apartment_mapping.json, kept deterministic for tests)
+        await seed_units(session, json_path=None)
+        await session.commit()
+        await seed_categories(session)
+        await session.commit()
+
+    transport = ASGITransport(app=app)
+    async with AsyncClient(transport=transport, base_url="http://test") as c:
+        yield c
+
+    async with engine.begin() as conn:
+        await conn.run_sync(Base.metadata.drop_all)
+
+
+@pytest_asyncio.fixture
+async def seed_tickets():
+    """Insert `n` tickets directly into the DB; returns the count inserted."""
+
+    async def _seed(n: int) -> int:
+        async with async_session_factory() as session:
+            for i in range(n):
+                session.add(
+                    Ticket(
+                        ticket_number=f"PAV-TEST-{i:05d}",
+                        status="Logged",
+                        priority="medium",
+                        description=f"Test ticket {i}",
+                    )
+                )
+            await session.commit()
+        return n
+
+    return _seed

tests/test_categories_and_units.py

@@ -0,0 +1,248 @@
+"""Tests for the Sprint A category + property-hierarchy changes.
+
+Anchors:
+* Alert-only categories (Gas Leak) are hidden from the picker endpoints by
+  default but still present in the DB with urgent SLA urgency, and retrievable
+  via ``include_hidden=true`` (emergency quick path).
+* New seed categories (Aluminum/Glass, Carpentry, Mould & Damp) and the
+  Lost Property → Missing Item rename are idempotent.
+* ``GET /api/tickets/units`` gains a ``building`` filter and the grouped
+  variant ``GET /api/tickets/units/grouped`` returns ``{property: {building: [units]}}``.
+* ``GET /api/tickets`` supports additive ``building``/``unit_id`` filters.
+"""
+
+from __future__ import annotations
+
+import pytest
+
+pytestmark = pytest.mark.asyncio
+
+
+def _find(categories: list[dict], name: str) -> dict | None:
+    return next((c for c in categories if c["name"] == name), None)
+
+
+# ── Category picker visibility ────────────────────────────────────────
+async def test_gas_leak_hidden_from_category_tree_by_default(client):
+    """Gas Leak must not appear in the default category picker."""
+    resp = await client.get("/api/tickets/categories")
+    assert resp.status_code == 200
+    data = resp.json()
+    # Any nesting level: walk top-level only; Gas Leak is top-level emergency
+    assert _find(data, "Gas Leak") is None
+    names = [c["name"] for c in data]
+    assert "Fire" in names and "Flood" in names  # other emergencies still visible
+
+
+async def test_gas_leak_hidden_from_emergency_type_filter(client):
+    """The `?type=emergency` picker also excludes Gas Leak by default."""
+    resp = await client.get("/api/tickets/categories", params={"type": "emergency"})
+    assert resp.status_code == 200
+    data = resp.json()
+    assert _find(data, "Gas Leak") is None
+    assert _find(data, "Fire") is not None
+
+
+async def test_include_hidden_returns_gas_leak(client):
+    """include_hidden=true exposes alert-only categories (emergency quick path)."""
+    resp = await client.get("/api/tickets/categories", params={"include_hidden": "true"})
+    assert resp.status_code == 200
+    gas = _find(resp.json(), "Gas Leak")
+    assert gas is not None
+    assert gas["show_in_form"] is False
+    assert gas["sla_urgency"] == "urgent"
+
+
+async def test_flat_list_hides_gas_leak_and_its_children(client):
+    """Flat picker excludes Gas Leak and orphaned children of hidden parents."""
+    resp = await client.get("/api/tickets/categories/flat")
+    assert resp.status_code == 200
+    names = [c["name"] for c in resp.json()]
+    assert "Gas Leak" not in names
+    assert "Gas smell" not in names  # child of alert-only parent
+    assert "Suspected leak" not in names
+    assert "Fire" in names
+
+
+async def test_flat_list_include_hidden_keeps_gas_leak(client):
+    resp = await client.get("/api/tickets/categories/flat", params={"include_hidden": "true"})
+    assert resp.status_code == 200
+    names = [c["name"] for c in resp.json()]
+    assert "Gas Leak" in names
+    assert "Gas smell" in names
+
+
+# ── Seed taxonomy ─────────────────────────────────────────────────────
+async def test_seed_adds_new_categories(client):
+    """Aluminum/Glass, Carpentry, Mould & Damp land as maintenance categories."""
+    resp = await client.get("/api/tickets/categories", params={"type": "maintenance"})
+    assert resp.status_code == 200
+    data = resp.json()
+    for name in ("Aluminum/Glass", "Carpentry", "Mould & Damp"):
+        cat = _find(data, name)
+        assert cat is not None, f"expected {name} in maintenance categories"
+        assert cat["children"], f"{name} should have sub-categories"
+    mould = _find(data, "Mould & Damp")
+    assert mould["sla_urgency"] == "medium"
+
+
+async def test_seed_renames_lost_property_to_missing_item(client):
+    """Seed must create 'Missing Item' (not 'Lost Property')."""
+    resp = await client.get("/api/tickets/categories", params={"type": "cs"})
+    assert resp.status_code == 200
+    data = resp.json()
+    assert _find(data, "Missing Item") is not None
+    assert _find(data, "Lost Property") is None
+    missing = _find(data, "Missing Item")
+    sub_names = [s["name"] for s in missing["children"]]
+    assert "Guest left items behind" in sub_names
+    assert "Item search request" in sub_names
+
+
+async def test_seed_is_idempotent(client):
+    """Running the seed twice does not duplicate categories."""
+    from app.core.database import async_session_factory
+    from app.services.seed import seed_categories
+
+    async with async_session_factory() as session:
+        created = await seed_categories(session)
+        await session.commit()
+    assert created == []  # nothing new to insert/sync on second pass
+
+
+async def test_seed_syncs_show_in_form_on_existing_rows(client):
+    """Existing databases pick up Gas Leak's alert-only flag on next startup.
+
+    Simulates a pre-existing DB (Gas Leak seeded with show_in_form=True before
+    the flag existed) — re-running the seed must flip it back to False.
+    """
+    from sqlalchemy import select
+    from app.core.database import async_session_factory
+    from app.models.category import Category
+    from app.services.seed import seed_categories
+
+    async with async_session_factory() as session:
+        result = await session.execute(
+            select(Category).where(Category.type == "emergency", Category.name == "Gas Leak", Category.parent_id.is_(None))
+        )
+        gas = result.scalar_one()
+        gas.show_in_form = True  # simulate legacy DB before the flag existed
+        await session.commit()
+
+        created = await seed_categories(session)
+        await session.commit()
+        await session.refresh(gas)
+        assert gas.show_in_form is False
+        assert gas.sla_urgency == "urgent"  # SLA/alert mapping unchanged
+        # Sync counts as a change, but no duplicates are created
+        assert len(created) >= 1
+
+
+async def test_legacy_db_self_heals_show_in_form_column():
+    """A pre-Sprint-A categories table (no show_in_form) gets the column on startup."""
+    from sqlalchemy import text
+
+    from app.core.database import engine
+    from app.main import ensure_legacy_schema
+
+    async with engine.begin() as conn:
+        await conn.execute(text("DROP TABLE IF EXISTS tickets"))
+        await conn.execute(text("DROP TABLE IF EXISTS categories"))
+        await conn.execute(
+            text(
+                "CREATE TABLE categories ("
+                "id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, "
+                "type VARCHAR(20) NOT NULL, "
+                "name VARCHAR(100) NOT NULL, "
+                "parent_id INTEGER, "
+                "sla_urgency VARCHAR(10))"
+            )
+        )
+        await ensure_legacy_schema(conn)
+        result = await conn.execute(text("PRAGMA table_info(categories)"))
+        assert "show_in_form" in {row[1] for row in result}
+
+    # Idempotent on the next startup
+    async with engine.begin() as conn:
+        await ensure_legacy_schema(conn)
+        result = await conn.execute(text("PRAGMA table_info(categories)"))
+        assert "show_in_form" in {row[1] for row in result}
+
+    async with engine.begin() as conn:
+        await conn.execute(text("DROP TABLE IF EXISTS categories"))
+        await conn.execute(text("DROP TABLE IF EXISTS tickets"))
+
+
+# ── Unit hierarchy ────────────────────────────────────────────────────
+async def test_units_building_filter(client):
+    """GET /api/tickets/units?building= filters to one building."""
+    resp = await client.get("/api/tickets/units", params={"building": "Pavilion East"})
+    assert resp.status_code == 200
+    units = resp.json()
+    assert len(units) > 0
+    assert all(u["building"] == "Pavilion East" for u in units)
+    assert all(u["property"] == "East" for u in units)
+
+
+async def test_units_grouped_shape(client):
+    """Grouped variant returns {property: {building: [units]}}."""
+    resp = await client.get("/api/tickets/units/grouped")
+    assert resp.status_code == 200
+    grouped = resp.json()
+    assert "East" in grouped and "West" in grouped
+    east = grouped["East"]
+    assert "Pavilion East" in east
+    assert len(east["Pavilion East"]) == 60
+    unit = east["Pavilion East"][0]
+    assert {"id", "property", "apartment_code", "building", "floor"} <= set(unit.keys())
+    # Distinct apartment codes
+    codes = [u["apartment_code"] for u in east["Pavilion East"]]
+    assert len(set(codes)) == len(codes)
+
+
+async def test_units_grouped_property_filter(client):
+    resp = await client.get("/api/tickets/units/grouped", params={"property": "West"})
+    assert resp.status_code == 200
+    grouped = resp.json()
+    assert set(grouped.keys()) == {"West"}
+
+
+# ── Ticket list filters ───────────────────────────────────────────────
+async def test_tickets_filter_by_building_and_unit(client):
+    """Additive building/unit_id filters compose with the list endpoint."""
+    # Grab two units from different buildings/properties
+    resp = await client.get("/api/tickets/units", params={"building": "Pavilion East"})
+    east_unit = resp.json()[0]
+    resp = await client.get("/api/tickets/units", params={"building": "Pavilion West"})
+    west_unit = resp.json()[0]
+
+    # Two tickets, one per building
+    payloads = [
+        {"description": "east ticket", "unit_id": east_unit["id"], "priority": "medium"},
+        {"description": "west ticket", "unit_id": west_unit["id"], "priority": "high"},
+    ]
+    token = await _login(client)
+    for p in payloads:
+        r = await client.post("/api/tickets", json=p, headers={"Authorization": f"Bearer {token}"})
+        assert r.status_code == 201, r.text
+
+    # building filter
+    r = await client.get("/api/tickets", params={"building": "Pavilion East"})
+    data = r.json()
+    assert data["total"] == 1
+    assert data["items"][0]["description"] == "east ticket"
+
+    # unit_id filter
+    r = await client.get("/api/tickets", params={"unit_id": west_unit["id"]})
+    data = r.json()
+    assert data["total"] == 1
+    assert data["items"][0]["description"] == "west ticket"
+
+
+async def _login(client) -> str:
+    resp = await client.post(
+        "/api/auth/login",
+        json={"email": "wahab@denya.com", "password": "denya123"},
+    )
+    assert resp.status_code == 200, resp.text
+    return resp.json()["access_token"]

tests/test_tickets_pagination.py

@@ -0,0 +1,56 @@
+"""Tests anchoring ticket list pagination behavior.
+
+The CEO dashboard (app/templates/dashboard/ceo.html) previously requested
+`page_size=500`; the API caps page_size at 200 (`le=200` in
+app/routers/tickets.py), so that request returned 422 and the dashboard
+rendered empty KPIs. These tests pin the API contract the frontend now
+relies on: page_size=200 + page loops that collect every ticket.
+"""
+
+from __future__ import annotations
+
+import pytest
+
+pytestmark = pytest.mark.asyncio
+
+
+async def test_page_size_over_cap_returns_422(client):
+    """Requests above the page_size cap must be rejected (the original bug)."""
+    resp = await client.get("/api/tickets", params={"page_size": 500})
+    assert resp.status_code == 422
+
+
+async def test_page_size_at_cap_returns_items_and_total(client, seed_tickets):
+    """page_size=200 is the max legal value and returns the full response shape."""
+    await seed_tickets(14)
+    resp = await client.get("/api/tickets", params={"page": 1, "page_size": 200})
+    assert resp.status_code == 200
+    data = resp.json()
+    assert data["total"] == 14
+    assert len(data["items"]) == 14
+    assert data["page"] == 1
+    assert data["page_size"] == 200
+
+
+async def test_paginated_loop_collects_all_tickets(client, seed_tickets):
+    """The frontend's page loop (page_size=200 until total reached) collects every ticket."""
+    total_seeded = await seed_tickets(450)  # 3 pages of 200
+
+    collected: list[dict] = []
+    total = float("inf")
+    page = 1
+    page_size = 200
+    while len(collected) < total and page <= 1000:
+        resp = await client.get("/api/tickets", params={"page": page, "page_size": page_size})
+        assert resp.status_code == 200
+        data = resp.json()
+        assert data["items"], "expected a non-empty page"
+        collected.extend(data["items"])
+        total = data["total"] or len(collected)
+        page += 1
+
+    assert total == total_seeded
+    assert len(collected) == total_seeded
+    # No duplicate tickets across pages
+    ids = [t["id"] for t in collected]
+    assert len(set(ids)) == len(ids)

tests/test_workflow_hardening.py

@@ -0,0 +1,290 @@
+"""Tests for the Wahab demo-prep hardening batch.
+
+Anchors:
+* ``Cancelled`` is a terminal status reachable from every active state, is
+  excluded from SLA breach reporting, and shows up in the status pickers.
+* Customer ``phone`` collected on the new-issue form is persisted (it used to
+  be silently dropped).
+* ``GET /api/tickets/{id}`` returns nested ``unit``/``category`` objects so the
+  detail page stops rendering "—" for Unit/Property/Category.
+* ``DELETE /api/tickets/{id}`` is admin-only and removes ticket children.
+* ``GET /api/auth/users`` powers the assign-technician dropdown.
+* Ticket numbering uses max+1, so deleting tickets never re-issues a number.
+"""
+
+from __future__ import annotations
+
+import pytest
+
+pytestmark = pytest.mark.asyncio
+
+
+async def _login(client, email="wahab@denya.com", password="denya123") -> str:
+    resp = await client.post(
+        "/api/auth/login",
+        json={"email": email, "password": password},
+    )
+    assert resp.status_code == 200, resp.text
+    return resp.json()["access_token"]
+
+
+async def _create_ticket(client, token: str, **overrides) -> dict:
+    payload = {
+        "unit_id": 2,
+        "category_id": 3,
+        "priority": "medium",
+        "reporter": "Demo Prep Test",
+        "reported_via": "walk-in",
+        "description": "hardening batch test ticket",
+        **overrides,
+    }
+    resp = await client.post(
+        "/api/tickets",
+        json=payload,
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 201, resp.text
+    return resp.json()
+
+
+# ── Cancelled status ──────────────────────────────────────────────────
+async def test_cancelled_is_terminal(client):
+    """A cancelled ticket has no valid next status."""
+    from app.services.ticket import VALID_TRANSITIONS
+
+    assert "Cancelled" in VALID_TRANSITIONS
+    assert VALID_TRANSITIONS["Cancelled"] == []
+
+
+async def test_cancelled_reachable_from_active_states(client):
+    """Logged/Triage/In Progress → Cancelled are all valid transitions."""
+    from app.services.ticket import VALID_TRANSITIONS
+
+    for state in (
+        "New", "Logged", "Triage", "Assigned", "Accepted", "Travelling", "On Site",
+        "In Progress", "Waiting Parts", "Escalated", "On-Field Verification",
+        "Wahab Review", "Reopened",
+    ):
+        assert "Cancelled" in VALID_TRANSITIONS[state], f"{state} should allow Cancelled"
+
+
+async def test_cancel_ticket_via_api(client):
+    """PATCH status=Cancelled works end-to-end and lands in the timeline."""
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, description="cancel me")
+
+    resp = await client.patch(
+        f"/api/tickets/{ticket['id']}",
+        json={"status": "Cancelled", "note": "demo sample"},
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 200, resp.text
+    data = resp.json()
+    assert data["status"] == "Cancelled"
+    assert data["timeline"][-1]["to_status"] == "Cancelled"
+
+
+async def test_cancelled_ticket_not_sla_breached(client):
+    """A cancelled ticket must not report SLA breach (like Closed/Completed)."""
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, priority="urgent", description="cancel sla test")
+
+    # Force the SLA deadline into the past by patching priority (recomputes from now),
+    # then cancel; the breach flags must be False either way.
+    resp = await client.patch(
+        f"/api/tickets/{ticket['id']}",
+        json={"status": "Cancelled"},
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 200
+    sla = resp.json()["sla_status"]
+    assert sla["resolution_breached"] is False
+    assert sla["response_breached"] is False
+
+
+# ── Phone persistence ─────────────────────────────────────────────────
+async def test_phone_persisted_on_create(client):
+    """Customer phone sent at creation is stored and returned."""
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, phone="+233123456789", description="phone test")
+    assert ticket["phone"] == "+233123456789"
+
+    detail = await client.get(f"/api/tickets/{ticket['id']}")
+    assert detail.json()["phone"] == "+233123456789"
+
+
+# ── Nested unit/category in detail ────────────────────────────────────
+async def test_ticket_detail_returns_unit_and_category(client):
+    """TicketOut includes nested unit/category objects (detail page fix)."""
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, unit_id=2, category_id=3)
+    resp = await client.get(f"/api/tickets/{ticket['id']}")
+    assert resp.status_code == 200
+    data = resp.json()
+    assert data["unit"] is not None
+    assert data["unit"]["apartment_code"]
+    assert data["category"] is not None
+    assert data["category"]["name"]
+
+
+# ── Admin-only DELETE ─────────────────────────────────────────────────
+async def test_delete_ticket_requires_admin(client):
+    """A non-admin (CS Rep) gets 403 on DELETE."""
+    token = await _login(client, email="bella@denya.com")  # CS Rep
+    ticket = await _create_ticket(client, token, description="delete perm test")
+    resp = await client.delete(
+        f"/api/tickets/{ticket['id']}",
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 403
+
+
+async def test_delete_ticket_removes_children(client):
+    """Admin DELETE removes the ticket, timeline, and photos."""
+    token = await _login(client)  # Admin/Wahab
+    ticket = await _create_ticket(client, token, description="delete me")
+    tid = ticket["id"]
+
+    resp = await client.delete(
+        f"/api/tickets/{tid}",
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 204
+
+    gone = await client.get(f"/api/tickets/{tid}")
+    assert gone.status_code == 404
+
+    from sqlalchemy import func, select
+    from app.core.database import async_session_factory
+    from app.models.ticket import TicketTimeline
+
+    async with async_session_factory() as session:
+        count = (await session.execute(
+            select(func.count(TicketTimeline.id)).where(TicketTimeline.ticket_id == tid)
+        )).scalar()
+    assert count == 0
+
+
+# ── Users endpoint for the assign picker ──────────────────────────────
+async def test_users_endpoint_requires_auth(client):
+    resp = await client.get("/api/auth/users")
+    assert resp.status_code == 401
+
+
+async def test_users_endpoint_lists_technicians(client):
+    token = await _login(client)
+    resp = await client.get("/api/auth/users", headers={"Authorization": f"Bearer {token}"})
+    assert resp.status_code == 200
+    users = resp.json()
+    assert any(u["role"] == "Tech" for u in users)
+    # Fields the assign dropdown needs
+    assert {"id", "full_name", "role"} <= set(users[0].keys())
+
+
+# ── Transitions helper (status dropdown) ─────────────────────────────
+async def test_transitions_helper_returns_valid_targets(client):
+    """GET /api/tickets/{id}/transitions returns the valid next statuses."""
+    from app.services.ticket import VALID_TRANSITIONS
+
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, description="transitions helper")  # status: Logged
+
+    resp = await client.get(f"/api/tickets/{ticket['id']}/transitions")
+    assert resp.status_code == 200, resp.text
+    data = resp.json()
+    assert data["current_status"] == "Logged"
+    assert set(data["transitions"]) == set(VALID_TRANSITIONS["Logged"])
+
+
+async def test_transitions_helper_terminal_is_empty(client):
+    """A cancelled ticket exposes no selectable next statuses."""
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, description="terminal transitions")
+    resp = await client.patch(
+        f"/api/tickets/{ticket['id']}",
+        json={"status": "Cancelled"},
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 200
+
+    data = (await client.get(f"/api/tickets/{ticket['id']}/transitions")).json()
+    assert data["current_status"] == "Cancelled"
+    assert data["transitions"] == []
+
+
+# ── Assign auto-advance ───────────────────────────────────────────────
+async def _first_tech_id(client, token: str) -> int:
+    users = (await client.get("/api/auth/users", headers={"Authorization": f"Bearer {token}"})).json()
+    return next(u["id"] for u in users if u["role"] == "Tech")
+
+
+async def test_assign_auto_advances_to_assigned(client):
+    """Assigning a pre-Assigned ticket advances it to Assigned with a timeline entry."""
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, description="assign advance")  # status: Logged
+    tech_id = await _first_tech_id(client, token)
+
+    resp = await client.patch(
+        f"/api/tickets/{ticket['id']}",
+        json={"assigned_to": tech_id},
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 200, resp.text
+    data = resp.json()
+    assert data["status"] == "Assigned"
+    assert data["assigned_to"] == tech_id
+    assert data["timeline"][-1]["to_status"] == "Assigned"
+
+
+async def test_assign_does_not_regress_past_assigned(client):
+    """Re-assigning a ticket already past Assigned leaves its status untouched."""
+    token = await _login(client)
+    ticket = await _create_ticket(client, token, description="no regression")
+
+    for step in ("Triage", "Assigned", "Accepted"):
+        resp = await client.patch(
+            f"/api/tickets/{ticket['id']}",
+            json={"status": step},
+            headers={"Authorization": f"Bearer {token}"},
+        )
+        assert resp.status_code == 200, resp.text
+
+    users = (await client.get("/api/auth/users", headers={"Authorization": f"Bearer {token}"})).json()
+    techs = [u["id"] for u in users if u["role"] == "Tech"]
+    other_tech = techs[1] if len(techs) > 1 else techs[0]
+
+    resp = await client.patch(
+        f"/api/tickets/{ticket['id']}",
+        json={"assigned_to": other_tech},
+        headers={"Authorization": f"Bearer {token}"},
+    )
+    assert resp.status_code == 200, resp.text
+    assert resp.json()["status"] == "Accepted"
+
+
+# ── Ticket numbering survives deletions ───────────────────────────────
+async def test_ticket_number_uses_max_plus_one(client, seed_tickets):
+    """After deleting a middle ticket, numbering must skip over surviving numbers."""
+    from sqlalchemy import delete as sa_delete
+    from app.core.database import async_session_factory
+    from app.models.ticket import Ticket
+
+    token = await _login(client)
+    first = await _create_ticket(client, token, description="numbering a")   # …001
+    second = await _create_ticket(client, token, description="numbering b")  # …002
+    third = await _create_ticket(client, token, description="numbering c")   # …003
+
+    async with async_session_factory() as session:
+        # Delete the middle ticket; count+1 numbering would now re-issue …003
+        # (colliding with the surviving third ticket).
+        await session.execute(sa_delete(Ticket).where(Ticket.id == second["id"]))
+        await session.commit()
+
+    fourth = await _create_ticket(client, token, description="numbering d")
+
+    def suffix(tn: str) -> int:
+        return int(tn.rsplit("-", 1)[1])
+
+    survivors = {suffix(first["ticket_number"]), suffix(third["ticket_number"])}
+    assert suffix(fourth["ticket_number"]) not in survivors
+    assert suffix(fourth["ticket_number"]) > max(survivors)