# Shop Sidebar IA Parity Fix

**Status:** DONE — implemented, browser-verified, uncommitted.
**Branch:** tailwind-poc · **Created:** 2026-07-21
**Trigger:** design-review bug report — staging sidebar groups/labels/items diverged from
the mockup (screenshots of `/shop/home` mockup vs `shop.navagoo.localhost` staging).

## 1. Problem

Sidebar comparison (mockup vs staging), from the report:

| Group | Mockup | Staging (before fix) |
|---|---|---|
| Operations | Bookings, Packages, Analytics, Services, Customers | Calendar, Analytics, Services, Customers (Packages missing, Bookings→Calendar) |
| Money | Finance, Team, Notifications | (matched, no change needed) |
| Growth | Marketing, Invitations, Branches | Promo Codes, Package |
| System | Help | *(group didn't exist — was "More": Branches, Reviews, Help center)* |

## 2. Ground truth

The mockup is the demo app, not an arbitrary design file. Confirmed by reading
`Navagoo_MI/navagoo-app/src/portals/nav.ts:122-175` (`SHOP_NAV`, fetched fresh via
`git fetch origin dev` — local was already current) — it defines exactly the mockup's
groups/order/labels: Home → Operations(Bookings, Packages, Analytics, Services,
Customers) → Money(Finance, Team, Notifications) → Growth(Marketing, Invitations,
Branches) → System(Help) → footer(Navagoo Plans, Settings).

Two demo items have no literal same-named portal controller, so their target route was
resolved by reading the demo source, not guessed:
- `ShopMarketing.tsx` renders `PromotionsManager` → demo's "Marketing" **is** our existing
  Promo Codes feature (`PromoCodeController`, route `/promo-code`).
- `ShopInvitations.tsx` renders bulk SMS/WhatsApp invitation batches → maps to
  `CustomerInvitationsController` (route `/customer-invitations`), which already existed
  in the codebase but was **not wired into the sidebar at all**.

Two real portal features aren't in the demo's IA at all (Reviews, Manage Social Media) —
per the pre-existing code comment ("portal-only surfaces the demo has no home for sit
under More"), they stay in a trimmed "More" section rather than being deleted.

## 3. Implementation

Single source of truth for the menu is `frontend/components/ShopNav.php::sections()`
(both `layouts/_tw_sidebar.php` and `layouts/tailwind.php` read off it — no other
consumers found via `grep -rl "ShopNav::"`).

1. **Operations** — relabel `booking-calendar` item "Calendar" → "Bookings"; move the
   `package` item in from Growth, relabel "Package" → "Packages", icon `package`→`gift`
   (matches demo's Gift icon).
2. **Growth** — relabel `promo-code` item "Promo codes" → "Marketing" (icon
   `ticket-percent`→`sparkles`, matches demo); add new `customer-invitations` item
   "Invitations" (icon `user-plus`, url `/customer-invitations`); move `branch` item in
   from "More".
3. **New System section** — single `technical-support` item, relabeled "Help center" →
   "Help" (icon unchanged, `life-buoy`).
4. **More** — trimmed to the two demo-orphan items only: `rate` ("Reviews") and
   `social-media` ("Manage Social Media", still gated on `$showSocial`).
5. Added stable `key` values to every moved/relabeled item (`packages`, `marketing`,
   `invitations`, `branches`, `help`) for fallback active-nav resolution; none of the
   moved items' `id`/`ctrl`/`views` changed, so `ShopNav::resolveActiveId()` (matched on
   live controller/action) needed no changes and no page passes a now-stale
   `activeNav` fallback key (checked: no controller in the touched set sets
   `$this->params['activeNav']`).
6. i18n: reused existing `Bookings` (frontend), `Marketing` (frontend), `Packages`
   (backend) keys; added new `System`, `Invitations`, `Help` keys to **both**
   `common/messages/{en,ar}/frontend.php` (bilingual hook enforced this — first attempt
   without the `ar` keys was blocked by the repo's i18n-check PostToolUse hook).

## 4. Files changed

- `frontend/components/ShopNav.php` — `sections()` restructured (see above).
- `common/messages/en/frontend.php`, `common/messages/ar/frontend.php` — `System`,
  `Invitations`, `Help` keys added next to the existing sidebar-label block.

No route/controller/migration changes — `customer-invitations` and `package` were
already fully built, just not linked from the shop nav.

## 5. Verification

- `php -l` clean on all 3 changed files (via `projects-webserver` container).
- Logged into `shop.navagoo.localhost` as the standing dev test shop-owner account;
  `read_page` dump of the live sidebar confirms every href matches the plan exactly
  (`/booking-calendar/index`, `/package`, `/promo-code`, `/customer-invitations`,
  `/branch`, `/technical-support/index`, `/rate`).
- Clicked into `/customer-invitations` (new link) — renders full "Customer Invitations"
  page (mobile-number list, WhatsApp/SMS + AR/EN templates, send action) with correct
  active-nav highlight.
- Navigated to `/package` — renders "Package" page with correct active-nav highlight.
- No CSS class changes were made (only labels/order/icons via existing Tailwind
  classes already compiled into `tailwind.css`), so `npm run build:css` was not required.

## 6. Not done / explicitly out of scope

- Did not touch page-level headers/breadcrumbs on Promo Codes or Technical Support
  pages (e.g. still titled "Promo Codes" / "Technical Support" internally) — the bug
  report was scoped to the sidebar only. Flag separately if page titles should also
  read "Marketing" / "Help" for full consistency.
- Did not commit — awaiting user review per session convention.