{ "page_ir": { "page_id": "admin_users", "page_goal": "Administrator-only page for managing system users (librarians and administrators). Provides a searchable, filterable table with CRUD operations including create, edit, deactivate/activate, and reset password functionality.", "style": { "tone": "professional", "theme": "light", "density": "comfortable", "color_intent": "neutral with primary accents" }, "accessibility": { "required_labels": [ "search_input", "role_filter", "status_filter", "create_librarian_button", "create_admin_button", "users_table" ], "skip_navigation": true, "focus_management": true, "announce_changes": [] }, "responsive": { "breakpoints": { "sm": 576, "md": 768, "lg": 992, "xl": 1200 }, "collapse_rules": [ "table scrolls horizontally on small screens", "filters stack vertically on mobile" ], "hidden_on_small": [ "user_id_column" ], "stack_on_small": [] }, "constraints": [ "Only administrators can access this page", "Cannot deactivate own account" ], "seo_title": null, "seo_description": null }, "data_ir": { "types": {}, "state": { "users": { "type": "array", "initial": [], "required": true, "constraints": {}, "item_type": null }, "loading": { "type": "boolean", "initial": false, "required": false, "constraints": {}, "item_type": null }, "searchText": { "type": "string", "initial": "", "required": false, "constraints": {}, "item_type": null }, "filterRole": { "type": "string", "initial": "", "required": false, "constraints": {}, "item_type": null }, "filterStatus": { "type": "string", "initial": "", "required": false, "constraints": {}, "item_type": null }, "createLibrarianModalVisible": { "type": "boolean", "initial": false, "required": false, "constraints": {}, "item_type": null }, "createAdminModalVisible": { "type": "boolean", "initial": false, "required": false, "constraints": {}, "item_type": null }, "editModalVisible": { "type": "boolean", "initial": false, "required": false, "constraints": {}, "item_type": null }, "resetPasswordModalVisible": { "type": "boolean", "initial": false, "required": false, "constraints": {}, "item_type": null }, "selectedUserId": { "type": "string", "initial": null, "required": false, "constraints": {}, "item_type": null }, "pagination": { "type": "object", "initial": { "current": 1, "pageSize": 20, "total": 0 }, "required": false, "constraints": {}, "item_type": null } }, "derived": { "filteredUsers": { "type": "array", "expr": "users.filter(u => (!searchText || u.email.toLowerCase().includes(searchText.toLowerCase()) || (u.first_name + ' ' + u.last_name).toLowerCase().includes(searchText.toLowerCase())) && (!filterRole || u.role === filterRole) && (!filterStatus || u.status === filterStatus))", "deps": [] } } }, "data_fetch_ir": { "endpoints": { "c240e4ad4ff945279021dec8952d7cb7": { "endpoint_id": "c240e4ad4ff945279021dec8952d7cb7", "module": "User Management", "endpoint": "/users/", "method": "GET", "path_params": {}, "query_params": { "limit": "$state.pagination.pageSize", "offset": "($state.pagination.current - 1) * $state.pagination.pageSize", "role": "$state.filterRole", "status": "$state.filterStatus" }, "body": null, "fields": [ "id", "email", "first_name", "last_name", "phone", "address", "role", "status", "created_at", "updated_at" ], "response_target": "users", "response_transform": null, "trigger": "on_mount", "depends_on": [], "debounce_ms": null, "loading_field": null, "error_field": null }, "1843f7320e9549389573cd2162aea592": { "endpoint_id": "1843f7320e9549389573cd2162aea592", "module": "User Management", "endpoint": "/users/", "method": "POST", "path_params": {}, "query_params": {}, "body": {}, "fields": [ "id", "email", "first_name", "last_name", "role", "status", "created_at" ], "response_target": "createUser_data", "response_transform": null, "trigger": "manual", "depends_on": [], "debounce_ms": null, "loading_field": null, "error_field": null }, "41b7b626bb87481b9acb9cf930a2acc9": { "endpoint_id": "41b7b626bb87481b9acb9cf930a2acc9", "module": "User Management", "endpoint": "/users/{user_id}", "method": "PUT", "path_params": { "user_id": "$state.selectedUserId" }, "query_params": {}, "body": {}, "fields": [ "id", "email", "first_name", "last_name", "role", "status", "created_at", "updated_at" ], "response_target": "updateUser_data", "response_transform": null, "trigger": "manual", "depends_on": [], "debounce_ms": null, "loading_field": null, "error_field": null }, "912f8accb60741fea74b31a4f1aecc8e": { "endpoint_id": "912f8accb60741fea74b31a4f1aecc8e", "module": "User Management", "endpoint": "/users/{user_id}", "method": "DELETE", "path_params": { "user_id": "$state.selectedUserId" }, "query_params": {}, "body": null, "fields": [], "response_target": "deleteUser_data", "response_transform": null, "trigger": "manual", "depends_on": [], "debounce_ms": null, "loading_field": null, "error_field": null } } }, "data_model_ir": { "entities": { "user": { "name": "User", "backend_module": "User Management", "fields": [ "id", "email", "first_name", "last_name", "phone", "address", "role", "status", "created_at", "updated_at" ], "computed": [ "fullName" ], "display_fields": [ "id", "first_name", "last_name", "email", "role", "status", "created_at" ], "search_fields": [ "email", "first_name", "last_name" ], "filters": [ "role", "status" ], "default_sort": null, "default_sort_dir": "asc" } }, "relationships": [] }, "behaviour_ir": { "events": { "onSearchChange": { "type": "mutation", "updates": [ { "target": "state.searchText", "expr": "event.target.value" } ], "description": "" }, "onRoleFilterChange": { "type": "mutation", "updates": [ { "target": "state.filterRole", "expr": "value" } ], "description": "" }, "onStatusFilterChange": { "type": "mutation", "updates": [ { "target": "state.filterStatus", "expr": "value" } ], "description": "" }, "onPaginationChange": { "type": "mutation", "updates": [ { "target": "state.pagination.current", "expr": "page" }, { "target": "state.pagination.pageSize", "expr": "pageSize" } ], "description": "" } }, "actions": { "5fe7dce6b04a44b8930427272086a422": { "action_id": "5fe7dce6b04a44b8930427272086a422", "trigger": "button_click", "target_component_id": "create_librarian_button", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.createLibrarianModalVisible", "expr": "true" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "8c35410b13674fb787746863f381cbf0": { "action_id": "8c35410b13674fb787746863f381cbf0", "trigger": "button_click", "target_component_id": "create_admin_button", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.createAdminModalVisible", "expr": "true" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "3cfca903789c4a92acf08a8f773b7f3a": { "action_id": "3cfca903789c4a92acf08a8f773b7f3a", "trigger": "button_click", "target_component_id": "create_librarian_modal", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.createLibrarianModalVisible", "expr": "false" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "32bacf78b2ac47a5a1b0e66ee6669d3e": { "action_id": "32bacf78b2ac47a5a1b0e66ee6669d3e", "trigger": "button_click", "target_component_id": "create_admin_modal", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.createAdminModalVisible", "expr": "false" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "31e03e993f8e4063b773447302ee4cbf": { "action_id": "31e03e993f8e4063b773447302ee4cbf", "trigger": "form_submit", "target_component_id": "create_librarian_form", "operation": "create", "description": "", "payload": { "role": "LIBRARIAN", "status": "ACTIVE" }, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [ { "rule_id": "val_0", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"email\", \"message\": \"Please enter a valid email address\", \"rule_id\": \"val_email\", \"type\": \"email\"}", "message": "{\"field\": \"email\", \"message\": \"Please enter a valid email address\", \"rule_id\": \"val_email\", \"type\": \"email\"}" }, { "rule_id": "val_1", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"first_name\", \"message\": \"First name is required\", \"rule_id\": \"val_first_name\", \"type\": \"required\"}", "message": "{\"field\": \"first_name\", \"message\": \"First name is required\", \"rule_id\": \"val_first_name\", \"type\": \"required\"}" }, { "rule_id": "val_2", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"last_name\", \"message\": \"Last name is required\", \"rule_id\": \"val_last_name\", \"type\": \"required\"}", "message": "{\"field\": \"last_name\", \"message\": \"Last name is required\", \"rule_id\": \"val_last_name\", \"type\": \"required\"}" }, { "rule_id": "val_3", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"password\", \"message\": \"Password must be at least 8 characters\", \"rule_id\": \"val_password\", \"type\": \"min_length\"}", "message": "{\"field\": \"password\", \"message\": \"Password must be at least 8 characters\", \"rule_id\": \"val_password\", \"type\": \"min_length\"}" } ], "validation_messages": {}, "updates": [ { "target": "state.createLibrarianModalVisible", "expr": "false" } ], "api_endpoint": "1843f7320e9549389573cd2162aea592", "api_body": "{ email: formValues.email, first_name: formValues.first_name, last_name: formValues.last_name, phone: formValues.phone, password: formValues.password, role: 'LIBRARIAN', status: 'ACTIVE' }", "side_effects": [ { "type": "toast", "config": { "message": "Librarian created successfully", "type": "success" } }, { "type": "refresh", "config": { "target": "fetchUsers" } } ], "then": null, "catch": null, "data_action": null }, "5ecf1f054ec44a8fa847adbfd6eb34f6": { "action_id": "5ecf1f054ec44a8fa847adbfd6eb34f6", "trigger": "form_submit", "target_component_id": "create_admin_form", "operation": "create", "description": "", "payload": { "role": "ADMINISTRATOR", "status": "ACTIVE" }, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [ { "rule_id": "val_0", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"email\", \"message\": \"Please enter a valid email address\", \"rule_id\": \"val_admin_email\", \"type\": \"email\"}", "message": "{\"field\": \"email\", \"message\": \"Please enter a valid email address\", \"rule_id\": \"val_admin_email\", \"type\": \"email\"}" }, { "rule_id": "val_1", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"first_name\", \"message\": \"First name is required\", \"rule_id\": \"val_admin_first_name\", \"type\": \"required\"}", "message": "{\"field\": \"first_name\", \"message\": \"First name is required\", \"rule_id\": \"val_admin_first_name\", \"type\": \"required\"}" }, { "rule_id": "val_2", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"last_name\", \"message\": \"Last name is required\", \"rule_id\": \"val_admin_last_name\", \"type\": \"required\"}", "message": "{\"field\": \"last_name\", \"message\": \"Last name is required\", \"rule_id\": \"val_admin_last_name\", \"type\": \"required\"}" }, { "rule_id": "val_3", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"password\", \"message\": \"Password must be at least 8 characters\", \"rule_id\": \"val_admin_password\", \"type\": \"min_length\"}", "message": "{\"field\": \"password\", \"message\": \"Password must be at least 8 characters\", \"rule_id\": \"val_admin_password\", \"type\": \"min_length\"}" } ], "validation_messages": {}, "updates": [ { "target": "state.createAdminModalVisible", "expr": "false" } ], "api_endpoint": "1843f7320e9549389573cd2162aea592", "api_body": "{ email: formValues.email, first_name: formValues.first_name, last_name: formValues.last_name, phone: formValues.phone, password: formValues.password, role: 'ADMINISTRATOR', status: 'ACTIVE' }", "side_effects": [ { "type": "toast", "config": { "message": "Administrator created successfully", "type": "success" } }, { "type": "refresh", "config": { "target": "fetchUsers" } } ], "then": null, "catch": null, "data_action": null }, "246b967982c54c0a98675b1106243af9": { "action_id": "246b967982c54c0a98675b1106243af9", "trigger": "button_click", "target_component_id": "users_table", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.editModalVisible", "expr": "true" }, { "target": "state.selectedUserId", "expr": "record.id" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "2946399038ae45408391753233f795bc": { "action_id": "2946399038ae45408391753233f795bc", "trigger": "button_click", "target_component_id": "edit_user_modal", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.editModalVisible", "expr": "false" }, { "target": "state.selectedUserId", "expr": "null" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "d04503d200d04af5b57c6bcc0d8ef20e": { "action_id": "d04503d200d04af5b57c6bcc0d8ef20e", "trigger": "form_submit", "target_component_id": "edit_user_form", "operation": "update", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [ { "rule_id": "val_0", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"email\", \"message\": \"Please enter a valid email address\", \"rule_id\": \"val_edit_email\", \"type\": \"email\"}", "message": "{\"field\": \"email\", \"message\": \"Please enter a valid email address\", \"rule_id\": \"val_edit_email\", \"type\": \"email\"}" }, { "rule_id": "val_1", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"first_name\", \"message\": \"First name is required\", \"rule_id\": \"val_edit_first_name\", \"type\": \"required\"}", "message": "{\"field\": \"first_name\", \"message\": \"First name is required\", \"rule_id\": \"val_edit_first_name\", \"type\": \"required\"}" }, { "rule_id": "val_2", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"last_name\", \"message\": \"Last name is required\", \"rule_id\": \"val_edit_last_name\", \"type\": \"required\"}", "message": "{\"field\": \"last_name\", \"message\": \"Last name is required\", \"rule_id\": \"val_edit_last_name\", \"type\": \"required\"}" } ], "validation_messages": {}, "updates": [ { "target": "state.editModalVisible", "expr": "false" }, { "target": "state.selectedUserId", "expr": "null" } ], "api_endpoint": "41b7b626bb87481b9acb9cf930a2acc9", "api_body": "{ email: formValues.email, first_name: formValues.first_name, last_name: formValues.last_name, phone: formValues.phone, role: formValues.role, status: formValues.status }", "side_effects": [ { "type": "toast", "config": { "message": "User updated successfully", "type": "success" } }, { "type": "refresh", "config": { "target": "fetchUsers" } } ], "then": null, "catch": null, "data_action": null }, "c2e7b762a7dd43f893b17ac8297c14a5": { "action_id": "c2e7b762a7dd43f893b17ac8297c14a5", "trigger": "button_click", "target_component_id": "users_table", "operation": "update", "description": "", "payload": {}, "guard": null, "requires_confirmation": true, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.selectedUserId", "expr": "record.id" } ], "api_endpoint": "41b7b626bb87481b9acb9cf930a2acc9", "api_body": "{ status: record.status === 'ACTIVE' ? 'INACTIVE' : 'ACTIVE' }", "side_effects": [ { "type": "toast", "config": { "message": "User status updated successfully", "type": "success" } }, { "type": "refresh", "config": { "target": "fetchUsers" } } ], "then": null, "catch": null, "data_action": null }, "48eb5fc7546a457a9cbcfa411bf5b630": { "action_id": "48eb5fc7546a457a9cbcfa411bf5b630", "trigger": "button_click", "target_component_id": "users_table", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.resetPasswordModalVisible", "expr": "true" }, { "target": "state.selectedUserId", "expr": "record.id" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "9423b4b5e7d747cca6eedeb4d004d0a9": { "action_id": "9423b4b5e7d747cca6eedeb4d004d0a9", "trigger": "button_click", "target_component_id": "reset_password_modal", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [ { "target": "state.resetPasswordModalVisible", "expr": "false" }, { "target": "state.selectedUserId", "expr": "null" } ], "api_endpoint": null, "api_body": null, "side_effects": [], "then": null, "catch": null, "data_action": null }, "ada9c2ab1f464a8c919113f4226af087": { "action_id": "ada9c2ab1f464a8c919113f4226af087", "trigger": "button_click", "target_component_id": "reset_password_confirm_button", "operation": "update", "description": "", "payload": {}, "guard": null, "requires_confirmation": true, "confirmation_message": null, "validation_rules": [ { "rule_id": "val_0", "field": null, "type": "custom", "value": null, "expression": "{\"field\": \"password\", \"message\": \"Password must be at least 8 characters\", \"rule_id\": \"val_new_password\", \"type\": \"min_length\"}", "message": "{\"field\": \"password\", \"message\": \"Password must be at least 8 characters\", \"rule_id\": \"val_new_password\", \"type\": \"min_length\"}" } ], "validation_messages": {}, "updates": [ { "target": "state.resetPasswordModalVisible", "expr": "false" }, { "target": "state.selectedUserId", "expr": "null" } ], "api_endpoint": "41b7b626bb87481b9acb9cf930a2acc9", "api_body": "{ password: formValues.password }", "side_effects": [ { "type": "toast", "config": { "message": "Password reset successfully", "type": "success" } } ], "then": null, "catch": null, "data_action": null }, "5b9ad09eac53494189f567200cb96f28": { "action_id": "5b9ad09eac53494189f567200cb96f28", "trigger": "button_click", "target_component_id": "breadcrumb_dashboard", "operation": "custom", "description": "", "payload": {}, "guard": null, "requires_confirmation": false, "confirmation_message": null, "validation_rules": [], "validation_messages": {}, "updates": [], "api_endpoint": null, "api_body": null, "side_effects": [ { "type": "navigate", "config": { "path": "/admin/dashboard" } } ], "then": null, "catch": null, "data_action": null } }, "feedback": { "31e03e993f8e4063b773447302ee4cbf": { "action_id": "31e03e993f8e4063b773447302ee4cbf", "loading_indicator": "spinner", "loading_text": null, "success_message": "Librarian created successfully", "error_message": "Failed to create librarian. Please try again.", "ui_updates": [] }, "5ecf1f054ec44a8fa847adbfd6eb34f6": { "action_id": "5ecf1f054ec44a8fa847adbfd6eb34f6", "loading_indicator": "spinner", "loading_text": null, "success_message": "Administrator created successfully", "error_message": "Failed to create administrator. Please try again.", "ui_updates": [] }, "d04503d200d04af5b57c6bcc0d8ef20e": { "action_id": "d04503d200d04af5b57c6bcc0d8ef20e", "loading_indicator": "spinner", "loading_text": null, "success_message": "User updated successfully", "error_message": "Failed to update user. Please try again.", "ui_updates": [] }, "c2e7b762a7dd43f893b17ac8297c14a5": { "action_id": "c2e7b762a7dd43f893b17ac8297c14a5", "loading_indicator": "spinner", "loading_text": null, "success_message": "User status updated successfully", "error_message": "Failed to update user status.", "ui_updates": [] }, "ada9c2ab1f464a8c919113f4226af087": { "action_id": "ada9c2ab1f464a8c919113f4226af087", "loading_indicator": "spinner", "loading_text": null, "success_message": "Password reset successfully", "error_message": "Failed to reset password. Please try again.", "ui_updates": [] } } }, "component_ir": { "library": "antd", "theme": { "primaryColor": "#1677ff", "secondaryColor": "#000000", "successColor": null, "warningColor": null, "errorColor": null, "fontFamily": "sans-serif", "fontSize": null, "borderRadius": 6 }, "components": { "main_container": { "type": "Layout", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": {}, "dynamic_props": {}, "styles": { "minHeight": "100vh", "width": "100%", "padding": "24px", "background": "#f5f5f5" }, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "page_header_section": { "type": "div", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": {}, "dynamic_props": {}, "styles": { "marginBottom": "24px" }, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "breadcrumb": { "type": "Breadcrumb", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "items": [ { "title": "Dashboard", "key": "dashboard" }, { "title": "User Administration", "key": "users" } ] }, "dynamic_props": {}, "styles": { "marginBottom": "16px" }, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "breadcrumb_dashboard": { "type": "Button", "label": "Dashboard", "description": null, "bind": null, "onClick": "navigateToDashboard", "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "type": "link", "size": "small" }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "page_title_row": { "type": "div", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": {}, "dynamic_props": {}, "styles": { "display": "flex", "justifyContent": "space-between", "alignItems": "center" }, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "page_title": { "type": "Typography.Title", "label": "User Administration", "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "level": 2 }, "dynamic_props": {}, "styles": { "margin": 0 }, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "action_buttons_group": { "type": "Space", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": {}, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "create_librarian_button": { "type": "Button", "label": "Create Librarian", "description": null, "bind": null, "onClick": "openCreateLibrarianModal", "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "type": "primary", "icon": "PlusOutlined" }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "create_admin_button": { "type": "Button", "label": "Create Administrator", "description": null, "bind": null, "onClick": "openCreateAdminModal", "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "type": "default", "icon": "PlusOutlined" }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "filters_section": { "type": "Card", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "bordered": false }, "dynamic_props": {}, "styles": { "marginBottom": "16px" }, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "filters_row": { "type": "div", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": {}, "dynamic_props": {}, "styles": { "display": "flex", "gap": "16px", "flexWrap": "wrap" }, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "search_input": { "type": "Input.Search", "label": "Search by name or email", "description": null, "bind": "state.searchText", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "placeholder": "Search by name or email...", "allowClear": true, "style": { "width": 300 } }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "role_filter": { "type": "Select", "label": "Filter by Role", "description": null, "bind": "state.filterRole", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "placeholder": "All Roles", "allowClear": true, "style": { "width": 180 }, "options": [ { "label": "Administrator", "value": "ADMINISTRATOR" }, { "label": "Librarian", "value": "LIBRARIAN" } ] }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "status_filter": { "type": "Select", "label": "Filter by Status", "description": null, "bind": "state.filterStatus", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "placeholder": "All Statuses", "allowClear": true, "style": { "width": 180 }, "options": [ { "label": "Active", "value": "ACTIVE" }, { "label": "Inactive", "value": "INACTIVE" }, { "label": "Suspended", "value": "SUSPENDED" } ] }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "table_card": { "type": "Card", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "bordered": false }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "users_table": { "type": "Table", "label": "Users Table", "description": null, "bind": "state.users", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "rowKey": "id", "loading": "$state.loading", "pagination": { "current": "$state.pagination.current", "pageSize": "$state.pagination.pageSize", "total": "$state.pagination.total" }, "columns": [ { "title": "User ID", "dataIndex": "id", "key": "id", "width": 100, "ellipsis": true }, { "title": "Name", "dataIndex": "first_name", "key": "name", "render": "record.first_name + ' ' + record.last_name" }, { "title": "Email", "dataIndex": "email", "key": "email" }, { "title": "Role", "dataIndex": "role", "key": "role", "render": "tag", "tagColorMap": { "ADMINISTRATOR": "red", "LIBRARIAN": "blue" } }, { "title": "Status", "dataIndex": "status", "key": "status", "render": "tag", "tagColorMap": { "ACTIVE": "green", "INACTIVE": "default", "SUSPENDED": "orange" } }, { "title": "Created", "dataIndex": "created_at", "key": "created_at", "render": "date" }, { "title": "Actions", "key": "actions", "render": "actions", "actions": [ "edit", "toggleStatus", "resetPassword" ] } ] }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "create_librarian_modal": { "type": "Modal", "label": "Create Librarian", "description": null, "bind": "state.createLibrarianModalVisible", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "title": "Create Librarian", "okText": "Create", "cancelText": "Cancel", "width": 520 }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "create_librarian_form": { "type": "Form", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "layout": "vertical", "fields": [ { "name": "first_name", "label": "First Name", "type": "input", "required": true }, { "name": "last_name", "label": "Last Name", "type": "input", "required": true }, { "name": "email", "label": "Email", "type": "input", "required": true, "inputType": "email" }, { "name": "phone", "label": "Phone", "type": "input", "required": false }, { "name": "employee_id", "label": "Employee ID", "type": "input", "required": false }, { "name": "password", "label": "Password", "type": "password", "required": true } ] }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "create_admin_modal": { "type": "Modal", "label": "Create Administrator", "description": null, "bind": "state.createAdminModalVisible", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "title": "Create Administrator", "okText": "Create", "cancelText": "Cancel", "width": 520 }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "create_admin_form": { "type": "Form", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "layout": "vertical", "fields": [ { "name": "first_name", "label": "First Name", "type": "input", "required": true }, { "name": "last_name", "label": "Last Name", "type": "input", "required": true }, { "name": "email", "label": "Email", "type": "input", "required": true, "inputType": "email" }, { "name": "phone", "label": "Phone", "type": "input", "required": false }, { "name": "employee_id", "label": "Employee ID", "type": "input", "required": false }, { "name": "password", "label": "Password", "type": "password", "required": true } ] }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "edit_user_modal": { "type": "Modal", "label": "Edit User", "description": null, "bind": "state.editModalVisible", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "title": "Edit User", "okText": "Save", "cancelText": "Cancel", "width": 520 }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "edit_user_form": { "type": "Form", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "layout": "vertical", "fields": [ { "name": "first_name", "label": "First Name", "type": "input", "required": true }, { "name": "last_name", "label": "Last Name", "type": "input", "required": true }, { "name": "email", "label": "Email", "type": "input", "required": true, "inputType": "email" }, { "name": "phone", "label": "Phone", "type": "input", "required": false }, { "name": "role", "label": "Role", "type": "select", "required": true, "options": [ { "label": "Administrator", "value": "ADMINISTRATOR" }, { "label": "Librarian", "value": "LIBRARIAN" } ] }, { "name": "status", "label": "Status", "type": "select", "required": true, "options": [ { "label": "Active", "value": "ACTIVE" }, { "label": "Inactive", "value": "INACTIVE" }, { "label": "Suspended", "value": "SUSPENDED" } ] } ] }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "reset_password_modal": { "type": "Modal", "label": "Reset Password", "description": null, "bind": "state.resetPasswordModalVisible", "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "title": "Reset Password", "okText": "Reset Password", "cancelText": "Cancel", "width": 420 }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "reset_password_form": { "type": "Form", "label": null, "description": null, "bind": null, "onClick": null, "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "layout": "vertical", "fields": [ { "name": "password", "label": "New Password", "type": "password", "required": true }, { "name": "confirm_password", "label": "Confirm Password", "type": "password", "required": true } ] }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null }, "reset_password_confirm_button": { "type": "Button", "label": "Reset Password", "description": null, "bind": null, "onClick": "confirmResetPassword", "onChange": null, "onSubmit": null, "onHover": null, "onKeyPress": null, "props": { "type": "primary", "danger": true }, "dynamic_props": {}, "styles": {}, "dynamic_styles": {}, "class_name": null, "dynamic_class": null, "transitions": [], "visible_when": null, "disabled_when": null, "repeat": null, "slots": {}, "a11y_role": null, "a11y_label": null } } }, "layout_ir": { "root": "main_container", "children": { "main_container": [ "page_header_section", "filters_section", "table_card", "create_librarian_modal", "create_admin_modal", "edit_user_modal", "reset_password_modal" ], "page_header_section": [ "breadcrumb", "breadcrumb_dashboard", "page_title_row" ], "page_title_row": [ "page_title", "action_buttons_group" ], "action_buttons_group": [ "create_librarian_button", "create_admin_button" ], "filters_section": [ "filters_row" ], "filters_row": [ "search_input", "role_filter", "status_filter" ], "table_card": [ "users_table" ], "create_librarian_modal": [ "create_librarian_form" ], "create_admin_modal": [ "create_admin_form" ], "edit_user_modal": [ "edit_user_form" ], "reset_password_modal": [ "reset_password_form", "reset_password_confirm_button" ] }, "layout": { "main_container": { "type": "vertical", "gap": 0, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "page_header_section": { "type": "vertical", "gap": 8, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "page_title_row": { "type": "horizontal", "gap": 16, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "action_buttons_group": { "type": "horizontal", "gap": 8, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "filters_section": { "type": "vertical", "gap": 0, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "filters_row": { "type": "horizontal", "gap": 16, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "table_card": { "type": "vertical", "gap": 0, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "create_librarian_modal": { "type": "vertical", "gap": 16, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "create_admin_modal": { "type": "vertical", "gap": 16, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "edit_user_modal": { "type": "vertical", "gap": 16, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null }, "reset_password_modal": { "type": "vertical", "gap": 16, "padding": null, "columns": null, "column_template": null, "row_template": null, "align_items": null, "justify_content": null, "wrap": false, "min_height": null, "overflow": null } }, "layout_zones": [ { "zone_id": "main_content", "component": "main_container", "anchor": "top-left", "size_hint": "full-width", "z_layer": "base", "notes": "Main page container with full viewport height" }, { "zone_id": "create_librarian_overlay", "component": "create_librarian_modal", "anchor": "center", "size_hint": "auto", "z_layer": "overlay", "notes": "Modal overlay for creating librarian" }, { "zone_id": "create_admin_overlay", "component": "create_admin_modal", "anchor": "center", "size_hint": "auto", "z_layer": "overlay", "notes": "Modal overlay for creating administrator" }, { "zone_id": "edit_user_overlay", "component": "edit_user_modal", "anchor": "center", "size_hint": "auto", "z_layer": "overlay", "notes": "Modal overlay for editing user" }, { "zone_id": "reset_password_overlay", "component": "reset_password_modal", "anchor": "center", "size_hint": "auto", "z_layer": "overlay", "notes": "Modal overlay for resetting password" } ], "responsive_overrides": [] }, "navigation_ir": { "tabs": [], "modals": {}, "drawers": {}, "routes": [], "breadcrumb": null, "default_tab": null }, "realtime_ir": { "timers": {}, "polling": {} }, "metadata": { "ir_version": "3.5", "generated_at": "", "source_prompt": null, "schema_session_id": null, "warnings": [] }, "page_data_contract": null, "schema_ir": null }