{
  "app_name": "Stage",
  "pages": [
    {
      "page_id": "dashboard",
      "page_title": "Dashboard",
      "route_path": "/",
      "route_params": [],
      "image_indices": [],
      "description": "Main dashboard with role-specific analytics and key metrics. Displays stat cards for upcoming events count, active productions, pending bookings, overdue tasks. Shows a calendar widget with today's schedule, recent notifications list, budget status summary with utilization percentages, and quick-action buttons for common tasks (create production, add booking, create task). Includes a venue utilization chart and task completion progress bars.",
      "navigates_to": [
        "venues_list",
        "productions_list",
        "bookings_list",
        "tasks_list",
        "schedules_calendar",
        "notifications_list",
        "resources_list"
      ]
    },
    {
      "page_id": "venues_list",
      "page_title": "Venues",
      "route_path": "/venues",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all venues in a table with columns: Name, Address, Stages Count, Active Productions, Status. Includes search bar, filters by status. Action buttons per row for Edit and View Details. A 'Create Venue' button opens a modal with fields: Name, Address, City, State, Zip, Phone, Email, Description, Capacity. Editing also opens a modal with the same fields pre-filled. Delete confirmation is shown as a popover.",
      "navigates_to": [
        "venue_detail",
        "dashboard"
      ]
    },
    {
      "page_id": "venue_detail",
      "page_title": "Venue Details",
      "route_path": "/venues/:venueId",
      "route_params": [
        "venueId"
      ],
      "image_indices": [],
      "description": "Detailed view of a single venue with tabs: Overview, Stages, Calendar, Resources, Productions, Staff, Documents. Overview tab shows venue info cards (address, contact, capacity), venue managers list, and utilization stats. Stages tab shows a table of stages (Name, Capacity, Dimensions, Technical Capabilities, Status) with 'Add Stage' button opening a modal with fields: Name, Capacity, Width, Depth, Height, Technical Specs, Description. Calendar tab shows venue-wide calendar with day/week/month views filtered by stage. Resources tab lists venue resources. Productions tab lists productions at this venue. Clicking 'Add Manager' opens a modal to assign a user as venue manager.",
      "navigates_to": [
        "venues_list",
        "production_detail",
        "resources_list",
        "schedules_calendar"
      ]
    },
    {
      "page_id": "productions_list",
      "page_title": "Productions",
      "route_path": "/productions",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all productions in a table with columns: Title, Venue, Status (Planning/Rehearsal/Running/Closed), Opening Date, Closing Date, Genre. Includes search bar, filters by status, venue, and date range. 'Create Production' button opens a modal with fields: Title, Description, Venue (dropdown), Genre, Type, Rehearsal Start Date, Opening Night, Closing Night. Row actions include Edit (modal), Delete (confirmation popover), and View Details link.",
      "navigates_to": [
        "production_detail",
        "dashboard",
        "venues_list"
      ]
    },
    {
      "page_id": "production_detail",
      "page_title": "Production Details",
      "route_path": "/productions/:productionId",
      "route_params": [
        "productionId"
      ],
      "image_indices": [],
      "description": "Comprehensive production dashboard with tabs: Overview, Schedule, Cast, Crew, Budget, Resources, Documents, Notes, Tasks. Overview tab shows production info (title, venue, dates, status, genre), timeline with milestones, upcoming rehearsals/performances list, budget summary card (total budget, spent, remaining with progress bar), task completion stats. Schedule tab shows production-specific calendar with rehearsals and performances color-coded. Cast tab shows table (Performer, Role, Type: Principal/Understudy, Status) with 'Add Cast Member' button opening a modal (User dropdown, Role Name, Type dropdown). Crew tab shows table (Staff Member, Position, Start Date, End Date) with 'Add Crew' modal. Budget tab shows budget categories with allocated vs spent, expense list. Resources tab shows assigned resources. Documents tab shows uploaded files. Notes tab shows timestamped notes with add note form. Tasks tab shows production tasks filtered view. 'Complete Production' action button with confirmation dialog.",
      "navigates_to": [
        "productions_list",
        "tasks_list",
        "budgets_detail",
        "schedules_calendar"
      ]
    },
    {
      "page_id": "bookings_list",
      "page_title": "Bookings",
      "route_path": "/bookings",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all bookings in a table with columns: Event Name, Venue, Stage, Requester, Start Date, End Date, Status (Pending/Approved/Rejected/Cancelled). Includes search, filters by status, venue, and date range. 'Create Booking' button opens a modal with fields: Event Name, Description, Venue (dropdown), Stage (dropdown), Start Date, End Date, Start Time, End Time, Event Type, Requirements, Contact Name, Contact Email, Contact Phone. Row actions: View Details (drawer showing full booking info), Approve (confirmation), Reject (with reason modal), Cancel (with reason modal), Edit (modal). Status badges are color-coded.",
      "navigates_to": [
        "dashboard",
        "venues_list"
      ]
    },
    {
      "page_id": "resources_list",
      "page_title": "Resources",
      "route_path": "/resources",
      "route_params": [],
      "image_indices": [],
      "description": "Resource management page with tabs: Catalog, Categories, Assignments, Maintenance. Catalog tab shows table of resources (Name, Category, Venue, Quantity, Available Qty, Status, Condition) with search and filters by category, venue, status. 'Add Resource' button opens modal with fields: Name, Description, Category (dropdown), Venue (dropdown), Quantity, Asset Tag, Specifications, Condition, Status. Categories tab shows hierarchical list of resource categories with 'Add Category' modal (Name, Description, Parent Category). Assignments tab shows table (Resource, Production, Quantity, Start Date, End Date, Status) with 'Create Assignment' modal. Maintenance tab shows maintenance records table (Resource, Date, Technician, Type, Description, Cost, Next Due) with 'Add Maintenance Record' modal.",
      "navigates_to": [
        "resource_detail",
        "dashboard",
        "venues_list"
      ]
    },
    {
      "page_id": "resource_detail",
      "page_title": "Resource Details",
      "route_path": "/resources/:resourceId",
      "route_params": [
        "resourceId"
      ],
      "image_indices": [],
      "description": "Detailed view of a single resource showing: resource info card (name, category, venue, quantity, available quantity, asset tag, specifications, condition, status), assignment history table (Production, Quantity, Dates, Status), maintenance history table (Date, Type, Technician, Description, Cost), availability calendar. Action buttons: Edit Resource (modal), Create Assignment (modal), Add Maintenance Record (modal), Mark Out of Service (confirmation).",
      "navigates_to": [
        "resources_list",
        "production_detail"
      ]
    },
    {
      "page_id": "schedules_calendar",
      "page_title": "Schedule",
      "route_path": "/schedule",
      "route_params": [],
      "image_indices": [],
      "description": "Full calendar view with day/week/month toggle. Events are color-coded by type (performances in purple, rehearsals in blue, bookings in green, maintenance in orange). Sidebar filters for venue, stage, production, event type. Clicking an empty time slot opens a 'Create Schedule Entry' modal with fields: Title, Type (dropdown), Production (dropdown), Venue, Stage, Start DateTime, End DateTime, Description, Participants. Clicking an existing event opens a detail drawer showing event info with Edit and Delete actions. Supports drag-and-drop for rescheduling. Shows conflict warnings as red indicators on overlapping events.",
      "navigates_to": [
        "dashboard",
        "production_detail",
        "venues_list"
      ]
    },
    {
      "page_id": "tasks_list",
      "page_title": "Tasks",
      "route_path": "/tasks",
      "route_params": [],
      "image_indices": [],
      "description": "Task management page with Kanban board view (columns: To Do, In Progress, Complete) and list view toggle. Each task card shows: Title, Priority badge (High/Medium/Low), Due Date, Assignee avatar, Production tag. List view shows table with columns: Title, Assignee, Production, Priority, Due Date, Status. Filters: status, priority, assignee, production, overdue toggle. 'Create Task' button opens modal with fields: Title, Description, Assignee (user dropdown), Production (dropdown, optional), Priority (dropdown), Due Date, Dependencies (multi-select tasks). Clicking a task opens a detail drawer showing full task info, comments thread with add comment form, status update buttons, and 'Complete Task' action. Overdue tasks highlighted in red.",
      "navigates_to": [
        "dashboard",
        "production_detail"
      ]
    },
    {
      "page_id": "staff_assignments_list",
      "page_title": "Staff Assignments",
      "route_path": "/staff-assignments",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all staff assignments in a table with columns: Staff Member, Production, Venue, Position/Role, Start Date, End Date, Status. Filters by venue, production, staff member, date range. 'Create Assignment' button opens modal with fields: Staff Member (user dropdown), Production (dropdown), Venue (dropdown), Position, Start Date, End Date, Notes. Row actions: Edit (modal), Delete (confirmation popover), View Details (drawer showing assignment info and related schedule entries).",
      "navigates_to": [
        "dashboard",
        "production_detail",
        "users_list"
      ]
    },
    {
      "page_id": "budgets_detail",
      "page_title": "Budget & Finances",
      "route_path": "/financial",
      "route_params": [],
      "image_indices": [],
      "description": "Financial management page with tabs: Budgets, Expenses, Reports. Budgets tab shows list of production budgets (Production, Total Budget, Spent, Remaining, Utilization %) with 'Create Budget' modal (Production dropdown, categories with allocated amounts). Clicking a budget expands to show category breakdown with progress bars. Expenses tab shows table (Description, Amount, Category, Production, Date, Vendor, Status: Pending/Approved/Rejected) with 'Add Expense' modal (Description, Amount, Category dropdown, Production dropdown, Date, Vendor, Receipt upload). Row actions: Approve, Reject (with reason), Edit, Delete. Reports tab shows budget vs actual charts, expense breakdown pie chart, and export buttons (CSV, PDF). Approve All Pending button for batch approval.",
      "navigates_to": [
        "dashboard",
        "production_detail"
      ]
    },
    {
      "page_id": "users_list",
      "page_title": "Users",
      "route_path": "/users",
      "route_params": [],
      "image_indices": [],
      "description": "User directory with table showing: Name, Email, Role(s), Venue(s), Status (Active/Inactive), Last Login. Search bar and filters by role, venue, status. 'Create User' button opens modal with fields: First Name, Last Name, Email, Password, Role (multi-select: Administrator, Venue Manager, Production Manager, Technical Director, Staff Member, Performer), Assigned Venues (multi-select), Phone, Bio. Row actions: Edit (modal), Deactivate/Activate (toggle with confirmation), Delete (admin only, confirmation dialog), View Profile link.",
      "navigates_to": [
        "user_profile",
        "dashboard"
      ]
    },
    {
      "page_id": "user_profile",
      "page_title": "User Profile",
      "route_path": "/users/:userId",
      "route_params": [
        "userId"
      ],
      "image_indices": [],
      "description": "User profile page showing: profile header (avatar, name, roles, contact info), tabs: Overview, Assignments, Schedule, Availability, Documents. Overview shows bio, contact details, assigned venues, recent activity. Assignments tab shows current staff and cast assignments. Schedule tab shows personal calendar with all assigned events. Availability tab shows availability calendar with 'Set Availability' modal (Start Date, End Date, Recurring pattern, Reason, Available/Unavailable toggle). Documents tab shows user's uploaded documents. Edit Profile button opens modal for updating profile fields.",
      "navigates_to": [
        "users_list",
        "schedules_calendar",
        "staff_assignments_list"
      ]
    },
    {
      "page_id": "contacts_list",
      "page_title": "Contacts",
      "route_path": "/contacts",
      "route_params": [],
      "image_indices": [],
      "description": "External contacts directory with table: Name, Organization, Type (Vendor/Contractor/Agent/Other), Email, Phone, Associated Productions. Search and filter by type, organization. 'Add Contact' button opens modal with fields: First Name, Last Name, Organization, Type (dropdown), Email, Phone, Address, Notes, Associated Productions (multi-select). Row actions: Edit (modal), Delete (confirmation), View Details (drawer showing full contact info and production associations).",
      "navigates_to": [
        "dashboard",
        "production_detail"
      ]
    },
    {
      "page_id": "documents_list",
      "page_title": "Documents",
      "route_path": "/documents",
      "route_params": [],
      "image_indices": [],
      "description": "Document management page showing documents in a grid/list toggle view. Each document card shows: filename, type icon, upload date, uploader, associated entity (production/venue), file size. Filters by type (Script, Contract, Design, Rider, Other), production, venue. Search by filename and tags. 'Upload Document' button opens modal with fields: File upload dropzone, Name, Description, Type (dropdown), Tags (multi-input), Associated Production (dropdown), Associated Venue (dropdown), Visibility (Public/Private/Specific Users). Clicking a document opens a detail drawer with preview (for supported formats), version history list, download button, 'Upload New Version' button, metadata, and permissions settings. Delete moves to trash with confirmation.",
      "navigates_to": [
        "dashboard",
        "production_detail",
        "venue_detail"
      ]
    },
    {
      "page_id": "notifications_list",
      "page_title": "Notifications",
      "route_path": "/notifications",
      "route_params": [],
      "image_indices": [],
      "description": "Notifications center showing a list of all notifications sorted by date (newest first). Each notification shows: icon by type, title, message preview, timestamp, read/unread indicator. Filters: All, Unread, type (Assignment, Schedule, Approval, Reminder, System). Bulk actions: Mark All Read, Delete Selected. Clicking a notification marks it as read and navigates to the relevant entity. Notification preferences link to settings. 'Create Announcement' button (for admins/managers) opens modal with fields: Title, Message (rich text), Target Audience (All Users, Specific Roles, Specific Production, Specific Venue).",
      "navigates_to": [
        "dashboard",
        "production_detail",
        "schedules_calendar",
        "tasks_list"
      ]
    },
    {
      "page_id": "notes_list",
      "page_title": "Notes",
      "route_path": "/notes",
      "route_params": [],
      "image_indices": [],
      "description": "Notes listing page showing all notes across productions. Table/card view with: Content preview, Author, Associated Production, Created Date, Tags. Filters by production, author, date range. Search by content. 'Add Note' button opens modal with fields: Content (rich text), Production (dropdown), Tags (multi-input). Clicking a note opens detail drawer showing full content, author info, timestamps, with Edit and Delete actions.",
      "navigates_to": [
        "dashboard",
        "production_detail"
      ]
    },
    {
      "page_id": "availability_mgmt",
      "page_title": "Availability",
      "route_path": "/availability",
      "route_params": [],
      "image_indices": [],
      "description": "Availability management page with tabs: My Availability, Staff Availability, Resource Availability, Venue/Stage Availability. My Availability shows personal calendar with available (green) and unavailable (red) blocks, with 'Set Availability' button opening modal (Start Date, End Date, Start Time, End Time, Recurring toggle with pattern options, Reason, Type: Available/Unavailable). Staff Availability tab shows a grid/matrix of staff members vs dates with color-coded availability. Resource Availability shows resource calendar. Venue/Stage Availability shows venue calendar with blocked dates. Managers can override availability with justification modal.",
      "navigates_to": [
        "dashboard",
        "schedules_calendar",
        "users_list"
      ]
    },
    {
      "page_id": "reports",
      "page_title": "Reports & Analytics",
      "route_path": "/reports",
      "route_params": [],
      "image_indices": [],
      "description": "Reporting page with sections: Standard Reports (cards for Venue Utilization, Production Schedules, Budget Summaries, Staff Assignments, Resource Usage), each clickable to generate with date range picker and filters. Results shown in tables and charts. Export buttons for PDF and CSV. Custom Report Builder section (admin only) with field selector, filter builder, and save/share options. Audit Logs section showing table (User, Action, Entity, Timestamp, Details) with search and date filters.",
      "navigates_to": [
        "dashboard"
      ]
    }
  ],
  "shared_state": [
    {
      "key": "currentUser",
      "type": "{ id: string; firstName: string; lastName: string; email: string; roles: string[]; venueIds: string[]; avatarUrl?: string } | null",
      "initial_value": "null",
      "description": "The currently authenticated user's profile and role information, used for RBAC throughout the app"
    },
    {
      "key": "selectedVenueId",
      "type": "string | null",
      "initial_value": "null",
      "description": "The currently selected venue context for filtering data across pages when user manages multiple venues"
    },
    {
      "key": "notifications",
      "type": "{ id: string; title: string; read: boolean; createdAt: string }[]",
      "initial_value": "[]",
      "description": "Unread notifications shown in the global header notification bell across all pages"
    },
    {
      "key": "sidebarCollapsed",
      "type": "boolean",
      "initial_value": "false",
      "description": "Whether the navigation sidebar is collapsed, persisted across page navigations"
    }
  ],
  "default_route": "dashboard",
  "design_system": {
    "theme_mode": "light",
    "density": "comfortable",
    "color_primary": "#6366f1",
    "color_success": "#10b981",
    "color_warning": "#f59e0b",
    "color_error": "#ef4444",
    "color_bg_container": "#ffffff",
    "color_bg_layout": "#f8fafc",
    "color_text": "#1e293b",
    "color_border": "#e2e8f0",
    "font_family": "Inter, -apple-system, sans-serif",
    "font_size_base": 14,
    "border_radius": 8,
    "component_overrides": {}
  }
}