""" System health monitoring layout for the dashboard. """ from dash import html import dash_bootstrap_components as dbc def create_quick_status_card(title, component_id, icon): """Helper to create a quick status card.""" return dbc.Card(dbc.CardBody([ html.H5(f"{icon} {title}", className="card-title"), html.Div(id=component_id, children=[ dbc.Badge("Checking...", color="warning", className="me-1") ]) ]), className="text-center") def _create_header_section(): """Creates the header section for the system health layout.""" return html.Div([ html.H2("⚙️ System Health & Data Monitoring"), html.P("Real-time monitoring of data collection services, database health, and system performance", className="lead") ], className="p-5 mb-4 bg-light rounded-3") def _create_quick_status_row(): """Creates the quick status overview row.""" return dbc.Row([ dbc.Col(create_quick_status_card("Data Collection", "data-collection-quick-status", "📊"), width=3), dbc.Col(create_quick_status_card("Database", "database-quick-status", "🗄️"), width=3), dbc.Col(create_quick_status_card("Redis", "redis-quick-status", "🔗"), width=3), dbc.Col(create_quick_status_card("Performance", "performance-quick-status", "📈"), width=3), ], className="mb-4") def _create_data_collection_service_card(): """Creates the data collection service status card.""" return dbc.Card([ dbc.CardHeader(html.H4("📡 Data Collection Service")), dbc.CardBody([ html.H5("Service Status", className="card-title"), html.Div(id='data-collection-service-status', className="mb-4"), html.H5("Collection Metrics", className="card-title"), html.Div(id='data-collection-metrics', className="mb-4"), html.H5("Service Controls", className="card-title"), dbc.ButtonGroup([ dbc.Button("🔄 Refresh Status", id="refresh-data-status-btn", color="primary", outline=True, size="sm"), dbc.Button("📊 View Details", id="view-collection-details-btn", color="secondary", outline=True, size="sm"), dbc.Button("📋 View Logs", id="view-collection-logs-btn", color="info", outline=True, size="sm") ]) ]) ], className="mb-4") def _create_individual_collectors_card(): """Creates the individual collectors health card.""" return dbc.Card([ dbc.CardHeader(html.H4("🔌 Individual Collectors")), dbc.CardBody([ html.Div(id='individual-collectors-status'), html.Div([ dbc.Alert( "Collector health data will be displayed here when the data collection service is running.", id="collectors-info-alert", color="info", is_open=True, ) ], id='collectors-placeholder') ]) ], className="mb-4") def _create_database_status_card(): """Creates the database health status card.""" return dbc.Card([ dbc.CardHeader(html.H4("🗄️ Database Health")), dbc.CardBody([ html.H5("Connection Status", className="card-title"), html.Div(id='database-status', className="mb-3"), html.Hr(), html.H5("Database Statistics", className="card-title"), html.Div(id='database-stats') ]) ], className="mb-4") def _create_redis_status_card(): """Creates the Redis health status card.""" return dbc.Card([ dbc.CardHeader(html.H4("🔗 Redis Status")), dbc.CardBody([ html.H5("Connection Status", className="card-title"), html.Div(id='redis-status', className="mb-3"), html.Hr(), html.H5("Redis Statistics", className="card-title"), html.Div(id='redis-stats') ]) ], className="mb-4") def _create_system_performance_card(): """Creates the system performance metrics card.""" return dbc.Card([ dbc.CardHeader(html.H4("📈 System Performance")), dbc.CardBody([ html.Div(id='system-performance-metrics') ]) ], className="mb-4") def _create_collection_details_modal(): """Creates the data collection details modal.""" return dbc.Modal([ dbc.ModalHeader(dbc.ModalTitle("📊 Data Collection Details")), dbc.ModalBody(id="collection-details-content") ], id="collection-details-modal", is_open=False, size="lg") def _create_collection_logs_modal(): """Creates the collection service logs modal.""" return dbc.Modal([ dbc.ModalHeader(dbc.ModalTitle("📋 Collection Service Logs")), dbc.ModalBody( html.Div( html.Pre(id="collection-logs-content", style={'max-height': '400px', 'overflow-y': 'auto'}), style={'white-space': 'pre-wrap', 'background-color': '#f8f9fa', 'padding': '15px', 'border-radius': '5px'} ) ), dbc.ModalFooter([ dbc.Button("Refresh", id="refresh-logs-btn", color="primary"), dbc.Button("Close", id="close-logs-modal", color="secondary", className="ms-auto") ]) ], id="collection-logs-modal", is_open=False, size="xl") def get_system_health_layout(): """Create the enhanced system health monitoring layout with Bootstrap components.""" return html.Div([ _create_header_section(), _create_quick_status_row(), dbc.Row([ dbc.Col([ _create_data_collection_service_card(), _create_individual_collectors_card(), ], width=6), dbc.Col([ _create_database_status_card(), _create_redis_status_card(), _create_system_performance_card(), ], width=6) ]), _create_collection_details_modal(), _create_collection_logs_modal() ])