{
  "app_name": "Warehouse Management System",
  "pages": [
    {
      "page_id": "dashboard",
      "page_title": "Dashboard",
      "route_path": "/",
      "route_params": [],
      "image_indices": [],
      "description": "Main landing page showing summary statistics and key metrics. Displays stat cards for total trucks, active ASNs, pending orders, and active vendors. Includes a recent activity feed showing latest truck entries, ASN updates, and order changes. Quick action buttons to navigate to Trucks, ASNs, Orders, and Vendors pages. Shows notifications count badge in the header.",
      "navigates_to": [
        "trucks_list",
        "asn_list",
        "purchase_orders",
        "vendors_list",
        "notifications",
        "user_management"
      ]
    },
    {
      "page_id": "trucks_list",
      "page_title": "Truck Operations",
      "route_path": "/trucks",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all truck entries in a data table with columns: Truck ID, License Plate, Driver, Purpose, Status, Arrival Time, and Actions. Supports search/filter by status, purpose, and date range. Pagination controls at bottom. Action buttons per row: View Details, Edit, Archive, Delete. Clicking 'Add Truck' opens a modal/drawer with fields: license plate, driver name, purpose (dropdown from truck purpose configurations), notes. Clicking 'Archive' opens a confirmation modal that archives the truck with history. Row click navigates to truck detail page.",
      "navigates_to": [
        "truck_detail",
        "dashboard",
        "driver_licenses"
      ]
    },
    {
      "page_id": "truck_detail",
      "page_title": "Truck Details",
      "route_path": "/trucks/:truckId",
      "route_params": [
        "truckId"
      ],
      "image_indices": [],
      "description": "Displays detailed information about a specific truck including purpose details (fetched from GET /trucks/{truck_id}/details). Shows truck metadata: license plate, driver info, purpose, current status, timestamps. Includes a history section showing all truck history records in a timeline or table format with columns: Date, Action, User, Notes. Edit button opens inline editing or a drawer with editable fields. Archive button triggers POST /{truck_id}/archive. Back button returns to trucks list.",
      "navigates_to": [
        "trucks_list"
      ]
    },
    {
      "page_id": "asn_list",
      "page_title": "ASN Management",
      "route_path": "/asns",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all Advanced Shipping Notices in a table with columns: ASN ID, Vendor, Status, Expected Delivery Date, Line Items Count, Created Date, Actions. Filters by status (dropdown from ASN status configurations), vendor, and date range. Search bar for ASN ID or vendor name. Pagination controls. Action buttons per row: View Details, Edit, Close ASN, Delete. 'Create ASN' button opens a modal with fields: vendor (dropdown), expected delivery date, status, notes. 'Close ASN' triggers POST /asns/{asn_id}/close with confirmation dialog.",
      "navigates_to": [
        "asn_detail",
        "dashboard",
        "vendors_list"
      ]
    },
    {
      "page_id": "asn_detail",
      "page_title": "ASN Details",
      "route_path": "/asns/:asnId",
      "route_params": [
        "asnId"
      ],
      "image_indices": [],
      "description": "Shows full ASN details from GET /asns/{asn_id}/details including vendor info, status, dates, and notes. Contains a Line Items section with a table: Line Item ID, SKU, Description, Quantity, Unit, Status, Actions. Supports adding line items via a modal (fields: SKU, description, quantity, unit). Batch update button opens a drawer for bulk editing line items via POST /asns/{asn_id}/line-items/batch. History tab shows ASN history records in chronological order. Close ASN button with confirmation. Edit ASN button opens editable form drawer.",
      "navigates_to": [
        "asn_list"
      ]
    },
    {
      "page_id": "purchase_orders",
      "page_title": "Purchase Orders",
      "route_path": "/orders",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all purchase orders in a table with columns: Order ID, Vendor, Order Date, Status, Total Amount, Delivery Date, Actions. Filters by vendor, status, and date range. Search by order ID. Pagination. Action buttons: View, Edit, Delete. 'Create Order' button opens a modal with fields: vendor (dropdown), order date, expected delivery date, status, line items, total amount, notes. Edit opens same modal pre-filled. Delete shows confirmation dialog. Includes order history accessible via an expandable row or detail view showing all changes.",
      "navigates_to": [
        "dashboard",
        "vendors_list"
      ]
    },
    {
      "page_id": "vendors_list",
      "page_title": "Vendors",
      "route_path": "/vendors",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all vendors in a table with columns: Vendor ID, Name, Contact Person, Email, Phone, Status, Actions. Search by name or email. Filter by status. Pagination. 'Add Vendor' button opens a modal with fields: name, contact person, email, phone, address, status, notes. Edit button opens same modal pre-filled. Delete shows confirmation. Each vendor row can be expanded or clicked to see vendor history records showing all modifications over time.",
      "navigates_to": [
        "dashboard",
        "purchase_orders"
      ]
    },
    {
      "page_id": "pallet_configs",
      "page_title": "Pallet Configurations",
      "route_path": "/pallet-configs",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all pallet configurations in a table with columns: Config ID, Name, Dimensions (L x W x H), Max Weight, Material Type, Status, Actions. Search by name. Filter by material type. 'Create Configuration' button opens a modal with fields: name, length, width, height, max weight, material type, description. Edit and Delete actions per row. History section or tab showing pallet configuration history records with change tracking.",
      "navigates_to": [
        "dashboard",
        "configuration"
      ]
    },
    {
      "page_id": "driver_licenses",
      "page_title": "Driver Licenses",
      "route_path": "/driver-licenses",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all driver licenses in a table with columns: License ID, Driver Name, License Number, License Type, Expiry Date, Status, Actions. Search by driver name or license number. Filter by type and expiry status (valid/expired/expiring soon). 'Add License' opens a modal with fields: driver name, license number, license type, issue date, expiry date, issuing authority, status. View Details action fetches GET /driver-licenses/{entity_id}/details showing full license info. History tab shows license modification history.",
      "navigates_to": [
        "dashboard",
        "trucks_list"
      ]
    },
    {
      "page_id": "user_management",
      "page_title": "User Management",
      "route_path": "/user-management",
      "route_params": [],
      "image_indices": [],
      "description": "Tabbed interface with three tabs: Users, Roles, Permissions. Users tab: table with columns User ID, Username, Email, Role, Status, Last Login, Actions. 'Create User' modal with fields: username, email, password, role (dropdown), status. Edit and Delete per row. Roles tab: table with Role ID, Name, Description, Permissions Count, Actions. 'Create Role' modal with fields: name, description, permissions (multi-select). Permissions tab: table with Permission ID, Name, Code, Module, Actions. 'Create Permission' modal with fields: name, code, module, description. Each tab supports search and pagination. Roles and Permissions tabs include history viewing capability.",
      "navigates_to": [
        "dashboard",
        "user_preferences"
      ]
    },
    {
      "page_id": "user_preferences",
      "page_title": "User Preferences",
      "route_path": "/user-management/preferences",
      "route_params": [],
      "image_indices": [],
      "description": "Lists user preferences in a table with columns: Preference ID, User, Key, Value, Category, Actions. 'Add Preference' opens a modal with fields: user (dropdown), preference key, value, category. Edit and Delete actions per row. View Details action shows expanded preference information from GET /user-preferences/{preference_id}/details. Search by user or key. Filter by category.",
      "navigates_to": [
        "user_management"
      ]
    },
    {
      "page_id": "notifications",
      "page_title": "Notifications",
      "route_path": "/notifications",
      "route_params": [],
      "image_indices": [],
      "description": "Lists all notifications in a table/list view with columns: ID, Title, Message, Type, Read Status, Created Date, Actions. Filter by type and read/unread status. Mark as read/unread actions. Delete action with confirmation. 'Create Notification' button (admin) opens modal with fields: title, message, type, target user(s). Includes an Audit Logs tab/section showing system audit logs in a table: Log ID, Action, Module, User, Timestamp, Details. Audit logs support search by action or module and date range filtering.",
      "navigates_to": [
        "dashboard"
      ]
    },
    {
      "page_id": "configuration",
      "page_title": "System Configuration",
      "route_path": "/configuration",
      "route_params": [],
      "image_indices": [],
      "description": "Tabbed interface with three tabs: Truck Purposes, ASN Statuses, System Settings. Truck Purposes tab: table with columns Entity ID, Name, Code, Description, Active, Actions. 'Add Purpose' modal with fields: name, code, description, active toggle. ASN Statuses tab: table with Entity ID, Name, Code, Color, Sort Order, Actions. 'Add Status' modal with fields: name, code, color picker, sort order, description. System Settings tab: table with Entity ID, Key, Value, Category, Description, Actions. 'Add Setting' modal with fields: key, value, category, description. All tabs support CRUD operations with edit/delete per row.",
      "navigates_to": [
        "dashboard",
        "pallet_configs"
      ]
    },
    {
      "page_id": "navigation_management",
      "page_title": "Navigation Management",
      "route_path": "/navigation",
      "route_params": [],
      "image_indices": [],
      "description": "Manages application menus and submenus. Two sections: Menus and Submenus. Menus section: table with Menu ID, Label, Icon, Route, Sort Order, Parent Menu, Active, Actions. 'Create Menu' modal with fields: label, icon (icon picker), route path, sort order, parent menu (dropdown for nesting), active toggle. Submenus section: table with Submenu ID, Label, Parent Menu, Route, Sort Order, Active, Actions. 'Create Submenu' modal with fields: label, parent menu (dropdown), route, sort order, icon, active toggle. View Details action shows full menu/submenu details including child items. Drag-and-drop reordering support for sort order.",
      "navigates_to": [
        "dashboard",
        "configuration"
      ]
    }
  ],
  "shared_state": [
    {
      "key": "currentUser",
      "type": "{ id: string; username: string; email: string; role: string; permissions: string[] } | null",
      "initial_value": "null",
      "description": "Currently authenticated user information used across all pages for authorization and display"
    },
    {
      "key": "notifications",
      "type": "{ unreadCount: number }",
      "initial_value": "{ \"unreadCount\": 0 }",
      "description": "Unread notification count displayed in the header/nav across all pages"
    },
    {
      "key": "navigationMenus",
      "type": "Array<{ id: string; label: string; icon: string; route: string; children: Array<{ id: string; label: string; route: string }> }>",
      "initial_value": "[]",
      "description": "Dynamic navigation menu structure loaded from API and rendered in the sidebar across all pages"
    },
    {
      "key": "systemSettings",
      "type": "Record<string, string>",
      "initial_value": "{}",
      "description": "Global system settings that affect behavior and display across multiple pages"
    }
  ],
  "default_route": "dashboard",
  "design_system": {
    "theme_mode": "light",
    "density": "comfortable",
    "color_primary": "#1677ff",
    "color_success": "#52c41a",
    "color_warning": "#faad14",
    "color_error": "#ff4d4f",
    "color_bg_container": "#ffffff",
    "color_bg_layout": "#f5f5f5",
    "color_text": "#000000e0",
    "color_border": "#d9d9d9",
    "font_family": "Inter, -apple-system, sans-serif",
    "font_size_base": 14,
    "border_radius": 6,
    "component_overrides": {}
  }
}