# Scope: Premium Mega Menu Implementation

## Architecture
- Prisma schema defines the database structure for Menu and MenuItem.
- Types in `packages/types/index.ts` share structures between backend, admin panel, SPA, website.
- Backend routes under `apps/backend/src/routes/menus.ts` read/write menu configs.
- MCP Server (`apps/mcp-server`) exposes tools to inspect and modify menus (menu-tools.ts/menu-toolkit.ts).
- Admin Panel (`apps/admin`) uses TreeNodeEditor in `MenuManagerPage.tsx` to edit rootImage, columnImage, hoverImage.
- SPA Storefront (`apps/spa`) uses `menuStore.ts` and renders navigation with `DesktopMegaMenu.tsx` and `MobileDrawer.tsx`.
- Website (`apps/website`) uses `menuTypes.ts` and renders navigation with `DesktopMegaMenu.tsx` and `MobileDrawer.tsx` (next/image, lazy loading, fade-in animations).

## Milestones
| # | Name | Scope | Dependencies | Status |
|---|------|-------|-------------|--------|
| 1 | Planning & Scope | Create and initialize SCOPE.md, progress.md | none | DONE |
| 2 | M2: Backend & DB | Update Prisma schema, run migration, update types, apps/backend routes, and apps/mcp-server | M1 | PLANNED |
| 3 | M3: Frontend & UI | Update apps/admin, apps/spa, and apps/website menus UI components | M2 | PLANNED |
| 4 | M4: Monorepo Build Verification | Run builds and typechecks across all 4 apps and packages | M3 | PLANNED |
| 5 | M5: E2E Integration | Coordinate with E2E Testing Track, run E2E tests, fix bugs, final audit | M4 | PLANNED |

## Interface Contracts
### Database Schema
- Menu table gets optional field `rootImage` (String?)
- MenuItem table gets optional fields `columnImage` (String?), `hoverImage` (String?)

### Types (packages/types/index.ts)
- Menu type gets `rootImage?: string | null`
- MenuItem type gets `columnImage?: string | null`, `hoverImage?: string | null`