root = Card([header, regionFilter, metricsRow, chartsSection, incidentsSection, endpointsSection, alertThresholdSection, followUps], "card", "column", "l")

header = CardHeader("Service Health Dashboard", "On-call view · Last updated 2 minutes ago")

regionFilter = Card([regionLabel, regionSelect], "clear", "row", "m", "center", "between")
regionLabel = TextContent("Region:", "small-heavy")
regionSelect = Select("region", regionOptions, "All regions", null, "medium")
regionOptions = [optAll, optUsEast, optUsWest, optEuWest, optApSouth]
optAll = SelectItem("all", "All regions")
optUsEast = SelectItem("us-east-1", "US East (N. Virginia)")
optUsWest = SelectItem("us-west-2", "US West (Oregon)")
optEuWest = SelectItem("eu-west-1", "EU West (Ireland)")
optApSouth = SelectItem("ap-south-1", "Asia Pacific (Mumbai)")

metricsRow = Card([uptimeMetric, errorRateMetric, cpuCurrentMetric, memoryCurrentMetric], "sunk", "row", "m", "stretch", "around", true)

uptimeMetric = Card([uptimeLabel, uptimeValue], "clear", "column", "xs", "center")
uptimeLabel = TextContent("Uptime this quarter", "small-heavy")
uptimeValue = TextContent("99.97%", "large-heavy")

errorRateMetric = Card([errorRateLabel, errorRateValue], "clear", "column", "xs", "center")
errorRateLabel = TextContent("Error rate (now)", "small-heavy")
errorRateValue = TextContent("0.23%", "large-heavy")

cpuCurrentMetric = Card([cpuCurrentLabel, cpuCurrentValue], "clear", "column", "xs", "center")
cpuCurrentLabel = TextContent("CPU (current)", "small-heavy")
cpuCurrentValue = TextContent("42%", "large-heavy")

memoryCurrentMetric = Card([memoryCurrentLabel, memoryCurrentValue], "clear", "column", "xs", "center")
memoryCurrentLabel = TextContent("Memory (current)", "small-heavy")
memoryCurrentValue = TextContent("68%", "large-heavy")

chartsSection = Card([chartsHeader, cpuMemChart], "card", "column", "m")
chartsHeader = Heading("CPU & Memory Usage — Last 24 Hours", "h3")
cpuMemChart = LineChart(chartLabels, [cpuSeries, memSeries], "natural", "Time", "Usage %")
chartLabels = ["00:00", "03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "21:00", "00:00"]
cpuSeries = Series("CPU %", [35, 28, 22, 45, 52, 48, 41, 38, 35])
memSeries = Series("Memory %", [62, 58, 55, 70, 75, 72, 68, 65, 62])

incidentsSection = Card([incidentsHeader, incidentsTable], "card", "column", "m")
incidentsHeader = Heading("Open Incidents", "h3")
incidentsTable = Table([incidentIdCol, incidentTitleCol, incidentSeverityCol, incidentSinceCol, incidentActionCol])
incidentIdCol = Col("ID", ["INC-2847", "INC-2831", "INC-2795", "INC-2782", "INC-2756"])
incidentTitleCol = Col("Title", ["Payment API timeout", "Database connection pool exhausted", "Cache cluster degradation", "Auth service 5xx spike", "CDN origin fetch failures"])
incidentSeverityCol = Col("Severity", [sevCritical, sevHigh, sevMedium, sevHigh, sevLow])
sevCritical = Tag("Critical", null, "md", "danger")
sevHigh = Tag("High", null, "md", "warning")
sevMedium = Tag("Medium", null, "md", "info")
sevLow = Tag("Low", null, "md", "neutral")
incidentSinceCol = Col("Since", ["12 min ago", "47 min ago", "2h 13m", "3h 08m", "5h 42m"])
incidentActionCol = Col("Action", [ackBtn1, ackBtn2, ackBtn3, ackBtn4, ackBtn5])
ackBtn1 = Button("Acknowledge", ["ack:INC-2847"], "primary", "normal", "small")
ackBtn2 = Button("Acknowledge", ["ack:INC-2831"], "primary", "normal", "small")
ackBtn3 = Button("Acknowledge", ["ack:INC-2795"], "primary", "normal", "small")
ackBtn4 = Button("Acknowledge", ["ack:INC-2782"], "primary", "normal", "small")
ackBtn5 = Button("Acknowledge", ["ack:INC-2756"], "primary", "normal", "small")

endpointsSection = Card([endpointsHeader, endpointsTable], "card", "column", "m")
endpointsHeader = Heading("Five Slowest Endpoints (p99 latency)", "h3")
endpointsTable = Table([endpointPathCol, endpointMethodCol, endpointP99Col, endpointP95Col, endpointRpsCol])
endpointPathCol = Col("Endpoint", ["/api/v2/payments/charge", "/api/v1/users/profile", "/api/v3/orders/history", "/api/v2/search/products", "/api/v1/auth/refresh"])
endpointMethodCol = Col("Method", ["POST", "GET", "GET", "GET", "POST"])
endpointP99Col = Col("p99 (ms)", [2840, 1920, 1650, 1480, 1210])
endpointP95Col = Col("p95 (ms)", [1890, 1340, 1120, 980, 890])
endpointRpsCol = Col("RPS", [45, 120, 85, 210, 340])

alertThresholdSection = Card([thresholdHeader, thresholdForm], "card", "column", "m")
thresholdHeader = Heading("Alert Threshold Configuration", "h3")
thresholdForm = Form("alert-threshold", thresholdButtons, [cpuThresholdField, memoryThresholdField, errorRateThresholdField, latencyThresholdField])
cpuThresholdField = FormControl("CPU Alert Threshold (%)", cpuThresholdInput, "Trigger alert when CPU exceeds this for 5 min")
cpuThresholdInput = Slider("cpu_threshold", "continuous", 0, 100, 5, [80], null, null)
memoryThresholdField = FormControl("Memory Alert Threshold (%)", memoryThresholdInput, "Trigger alert when memory exceeds this for 5 min")
memoryThresholdInput = Slider("memory_threshold", "continuous", 0, 100, 5, [85], null, null)
errorRateThresholdField = FormControl("Error Rate Alert Threshold (%)", errorRateThresholdInput, "Trigger alert when error rate exceeds this for 2 min")
errorRateThresholdInput = Slider("error_rate_threshold", "continuous", 0, 10, 0.1, [1.0], null, null)
latencyThresholdField = FormControl("p99 Latency Alert Threshold (ms)", latencyThresholdInput, "Trigger alert when p99 exceeds this for 5 min")
latencyThresholdInput = Slider("latency_threshold", "continuous", 0, 5000, 100, [2000], null, null)
thresholdButtons = Buttons([saveThresholdBtn, resetThresholdBtn], "row")
saveThresholdBtn = Button("Save Thresholds", ["save:thresholds"], "primary")
resetThresholdBtn = Button("Reset to Defaults", ["reset:thresholds"], "secondary")

followUps = FollowUpBlock([followUp1, followUp2, followUp3, followUp4])
followUp1 = FollowUpItem("Show me the incident timeline for INC-2847")
followUp2 = FollowUpItem("Compare error rates across all regions")
followUp3 = FollowUpItem("Generate a postmortem template for the payment API incident")
followUp4 = FollowUpItem("Set up a war room for the database connection pool issue")