@marinoscar/platform-web 0.0.0-stage → 0.1.0-next.3

package/dist/telemetry/ui/components/dashboard/ApiTimelineChart.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * API timeline — issue #578, epic #576.
+ *
+ * Server requests per bucket as bars stacked by status class (2xx, 3xx, 4xx,
+ * 5xx), with p95 latency as a line on a secondary (ms) axis. Composed from
+ * `@mui/x-charts` parts because a bar + line pair on two y axes is not one of
+ * the packaged charts. Bar colours are the theme's status tokens (#686:
+ * 2xx ok, 3xx info, 4xx warn, 5xx crit), so both modes work and an app can
+ * restyle them; the legend names every series, so colour is never the only key.
+ *
+ * Zoom: see `ZoomBrush` — the caller chooses drag and/or tap per layout.
+ */
+import { Box, useTheme } from '@mui/material';
+import { ChartsDataProvider } from '@mui/x-charts/ChartsDataProvider';
+import { ChartsWrapper } from '@mui/x-charts/ChartsWrapper';
+import { ChartsSurface } from '@mui/x-charts/ChartsSurface';
+import { ChartsLegend } from '@mui/x-charts/ChartsLegend';
+import { ChartsGrid } from '@mui/x-charts/ChartsGrid';
+import { BarPlot } from '@mui/x-charts/BarChart';
+import { LinePlot } from '@mui/x-charts/LineChart';
+import { ChartsXAxis } from '@mui/x-charts/ChartsXAxis';
+import { ChartsYAxis } from '@mui/x-charts/ChartsYAxis';
+import { ChartsTooltip } from '@mui/x-charts/ChartsTooltip';
+import { ChartsAxisHighlight } from '@mui/x-charts/ChartsAxisHighlight';
+import { formatDuration } from '../../../headless/lib/format.js';
+import { TIMELINE_AXIS_ID, timelineXAxis } from './timelineAxis.js';
+import { ZoomBrush } from './ZoomBrush.js';
+import { useTelemetryTokens } from '../../../theme/telemetryTokens.js';
+export function ApiTimelineChart({ buckets, height, spanMs, compact, zoom, onZoomBuckets }) {
+    const theme = useTheme();
+    const tokens = useTelemetryTokens();
+    const starts = buckets.map((bucket) => bucket.t);
+    const bar = (id, label, color) => ({
+        type: 'bar',
+        id,
+        label,
+        data: buckets.map((bucket) => bucket[id]),
+        stack: 'status',
+        color,
+        yAxisId: 'requests',
+    });
+    return (_jsx(Box, { role: "img", "aria-label": `API requests per bucket by status class (2xx, 3xx, 4xx, 5xx) with p95 latency, ${buckets.length} buckets`, sx: { minWidth: 0, width: '100%' }, children: _jsx(ChartsDataProvider, { height: height, skipAnimation: true, series: [
+                bar('s2xx', '2xx', tokens.status.ok),
+                bar('s3xx', '3xx', tokens.status.info),
+                bar('s4xx', '4xx', tokens.status.warn),
+                bar('s5xx', '5xx', tokens.status.crit),
+                {
+                    type: 'line',
+                    id: 'p95',
+                    label: 'p95 latency',
+                    data: buckets.map((bucket) => bucket.p95Ms),
+                    yAxisId: 'latency',
+                    color: theme.palette.text.primary,
+                    connectNulls: false,
+                    showMark: false,
+                    valueFormatter: (value) => (value === null ? '—' : formatDuration(value)),
+                },
+            ], xAxis: [timelineXAxis(starts, spanMs, compact ? 4 : undefined)], yAxis: [
+                { id: 'requests', position: 'left', width: compact ? 44 : 48, min: 0 },
+                {
+                    id: 'latency',
+                    position: 'right',
+                    width: compact ? 44 : 56,
+                    min: 0,
+                    valueFormatter: (value) => formatDuration(value),
+                },
+            ], margin: { top: 8, right: 4, bottom: 4, left: 4 }, children: _jsxs(ChartsWrapper, { legendPosition: { vertical: compact ? 'bottom' : 'top', horizontal: 'center' }, children: [_jsx(ChartsLegend, {}), _jsxs(ChartsSurface, { children: [_jsx(ChartsGrid, { horizontal: true }), _jsx(BarPlot, {}), _jsx(LinePlot, {}), _jsx(ChartsAxisHighlight, { x: "band" }), _jsx(ChartsXAxis, { axisId: TIMELINE_AXIS_ID }), _jsx(ChartsYAxis, { axisId: "requests" }), _jsx(ChartsYAxis, { axisId: "latency" }), _jsx(ZoomBrush, { values: starts, drag: zoom.drag, tap: zoom.tap, onSelect: onZoomBuckets })] }), _jsx(ChartsTooltip, { trigger: "axis" })] }) }) }));
+}
+//# sourceMappingURL=ApiTimelineChart.js.map

package/dist/telemetry/ui/components/dashboard/ApiTimelineChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApiTimelineChart.js","sourceRoot":"","sources":["../../../../../src/telemetry/ui/components/dashboard/ApiTimelineChart.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAExE,OAAO,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAevE,MAAM,UAAU,gBAAgB,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,aAAa,EAAyB;IAC/G,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IACpC,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACjD,MAAM,GAAG,GAAG,CAAC,EAAqC,EAAE,KAAa,EAAE,KAAa,EAAE,EAAE,CAAC,CAAC;QACpF,IAAI,EAAE,KAAc;QACpB,EAAE;QACF,KAAK;QACL,IAAI,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QACzC,KAAK,EAAE,QAAQ;QACf,KAAK;QACL,OAAO,EAAE,UAAU;KACpB,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,GAAG,IACF,IAAI,EAAC,KAAK,gBACE,kFAAkF,OAAO,CAAC,MAAM,UAAU,EACtH,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,YAElC,KAAC,kBAAkB,IACjB,MAAM,EAAE,MAAM,EACd,aAAa,QACb,MAAM,EAAE;gBACN,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;gBACpC,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC;gBACtC,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC;gBACtC,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC;gBACtC;oBACE,IAAI,EAAE,MAAM;oBACZ,EAAE,EAAE,KAAK;oBACT,KAAK,EAAE,aAAa;oBACpB,IAAI,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC;oBAC3C,OAAO,EAAE,SAAS;oBAClB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;oBACjC,YAAY,EAAE,KAAK;oBACnB,QAAQ,EAAE,KAAK;oBACf,cAAc,EAAE,CAAC,KAAoB,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;iBACzF;aACF,EACD,KAAK,EAAE,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAC/D,KAAK,EAAE;gBACL,EAAE,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE;gBACtE;oBACE,EAAE,EAAE,SAAS;oBACb,QAAQ,EAAE,OAAO;oBACjB,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;oBACxB,GAAG,EAAE,CAAC;oBACN,cAAc,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC;iBACzD;aACF,EACD,MAAM,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,YAEhD,MAAC,aAAa,IAAC,cAAc,EAAE,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC3F,KAAC,YAAY,KAAG,EAChB,MAAC,aAAa,eACZ,KAAC,UAAU,IAAC,UAAU,SAAG,EACzB,KAAC,OAAO,KAAG,EACX,KAAC,QAAQ,KAAG,EACZ,KAAC,mBAAmB,IAAC,CAAC,EAAC,MAAM,GAAG,EAChC,KAAC,WAAW,IAAC,MAAM,EAAE,gBAAgB,GAAI,EACzC,KAAC,WAAW,IAAC,MAAM,EAAC,UAAU,GAAG,EACjC,KAAC,WAAW,IAAC,MAAM,EAAC,SAAS,GAAG,EAChC,KAAC,SAAS,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,QAAQ,EAAE,aAAa,GAAI,IACxE,EAChB,KAAC,aAAa,IAAC,OAAO,EAAC,MAAM,GAAG,IAClB,GACG,GACjB,CACP,CAAC;AACJ,CAAC"}

package/dist/telemetry/ui/components/dashboard/DashboardFilterBar.d.ts

@@ -0,0 +1,39 @@
+import { type DashboardState } from '../../../headless/lib/dashboardState.js';
+export type DashboardLayout = 'phone' | 'tablet' | 'desktop';
+export interface DashboardFilterBarProps {
+    state: DashboardState;
+    onChange: (patch: Partial<DashboardState>) => void;
+    services: string[];
+    instances: string[];
+    /** Host names from `/filters`; the Host select is offered when there are any (or one is set). */
+    hosts?: string[];
+    /** `Date.now()` of the latest summary, for "Updated Xs ago". */
+    updatedAt: number | null;
+    layout: DashboardLayout;
+}
+/** Re-renders itself once a second; the rest of the page does not. */
+export declare function UpdatedAgo({ updatedAt }: {
+    updatedAt: number | null;
+}): import("react").JSX.Element | null;
+export declare function zoomLabel(state: DashboardState): string;
+export declare function ResetZoomChip({ state, onChange }: Pick<DashboardFilterBarProps, 'state' | 'onChange'>): import("react").JSX.Element | null;
+interface SelectProps {
+    label: string;
+    allLabel: string;
+    value: string | null;
+    options: string[];
+    onChange: (value: string | null) => void;
+    fullWidth?: boolean;
+}
+export declare function FilterSelect({ label, allLabel, value, options, onChange, fullWidth }: SelectProps): import("react").JSX.Element;
+export declare function RefreshSwitch({ checked, onChange }: {
+    checked: boolean;
+    onChange: (next: boolean) => void;
+}): import("react").JSX.Element;
+export declare function RangeToggle({ state, onChange }: Pick<DashboardFilterBarProps, 'state' | 'onChange'>): import("react").JSX.Element;
+export declare function RangeSelect({ state, onChange, fullWidth, }: Pick<DashboardFilterBarProps, 'state' | 'onChange'> & {
+    fullWidth?: boolean;
+}): import("react").JSX.Element;
+export declare function DashboardFilterBar(props: DashboardFilterBarProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=DashboardFilterBar.d.ts.map

package/dist/telemetry/ui/components/dashboard/DashboardFilterBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardFilterBar.d.ts","sourceRoot":"","sources":["../../../../../src/telemetry/ui/components/dashboard/DashboardFilterBar.tsx"],"names":[],"mappings":"AAgDA,OAAO,EAAqC,KAAK,cAAc,EAAE,MAAM,yCAAyC,CAAC;AAGjH,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE7D,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,cAAc,CAAC;IACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACnD,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,iGAAiG;IACjG,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,gEAAgE;IAChE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,MAAM,EAAE,eAAe,CAAC;CACzB;AAED,sEAAsE;AACtE,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,sCAcrE;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,GAAG,MAAM,CAEvD;AAED,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,UAAU,CAAC,sCAcrG;AAED,UAAU,WAAW;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,WAAW,+BA2BjG;AAED,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE;IAAE,OAAO,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;CAAE,+BAQ3G;AAED,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,UAAU,CAAC,+BAmBnG;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,SAAS,GACV,EAAE,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,OAAO,CAAA;CAAE,+BA6B/E;AAmND,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,+BAIhE"}

package/dist/telemetry/ui/components/dashboard/DashboardFilterBar.js

@@ -0,0 +1,143 @@
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * The Telemetry Dashboard's filter bar — issue #578, epic #576.
+ *
+ * Range (15m … 7d), service and instance (the values `/filters` reports for
+ * the window), host (#602: `/filters` `hosts`, applied by the infrastructure
+ * sections only; offered once the store has host metrics), auto-refresh, "Updated Xs ago", and — while zoomed — a
+ * "Reset zoom" chip that drops `from`/`to` and returns to the preset.
+ *
+ * - Desktop (≥ lg): everything inline, range as a ToggleButtonGroup.
+ * - Tablet (sm–md): range Select inline; service, instance and auto-refresh
+ *   behind a "Filters" button in a popover.
+ * - Phone (below sm): a sticky compact bar (range chip + Filters) whose button
+ *   opens a full-screen dialog with every control, applied on "Apply" (a
+ *   draft, so a half-made choice never fires five requests) or "Reset".
+ */
+import { useEffect, useId, useState } from 'react';
+import { Badge, Box, Button, Chip, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Paper, Popover, FormControl, FormControlLabel, InputLabel, MenuItem, OutlinedInput, Select, Stack, Switch, ToggleButton, ToggleButtonGroup, Typography, } from '@mui/material';
+import ZoomOutIcon from '@mui/icons-material/ZoomOut';
+import TuneIcon from '@mui/icons-material/Tune';
+import CloseIcon from '@mui/icons-material/Close';
+import { DASHBOARD_RANGES, DASHBOARD_RANGE_LABELS, } from '../../../headless/services/telemetryDashboard.js';
+import { DEFAULT_DASHBOARD_STATE, isZoomed } from '../../../headless/lib/dashboardState.js';
+import { formatTimestamp } from '../../../headless/lib/format.js';
+/** Re-renders itself once a second; the rest of the page does not. */
+export function UpdatedAgo({ updatedAt }) {
+    const [now, setNow] = useState(() => Date.now());
+    useEffect(() => {
+        const timer = setInterval(() => setNow(Date.now()), 1000);
+        return () => clearInterval(timer);
+    }, []);
+    if (updatedAt === null)
+        return null;
+    const seconds = Math.max(0, Math.round((now - updatedAt) / 1000));
+    const text = seconds < 60 ? `${seconds}s` : `${Math.floor(seconds / 60)}m`;
+    return (_jsxs(Typography, { variant: "caption", color: "text.secondary", "data-testid": "updated-ago", sx: { whiteSpace: 'nowrap' }, children: ["Updated ", text, " ago"] }));
+}
+export function zoomLabel(state) {
+    return `${formatTimestamp(state.from)} – ${formatTimestamp(state.to)}`;
+}
+export function ResetZoomChip({ state, onChange }) {
+    if (!isZoomed(state))
+        return null;
+    return (_jsx(Chip, { icon: _jsx(ZoomOutIcon, { "aria-hidden": true }), label: "Reset zoom", title: zoomLabel(state), onClick: () => onChange({ from: null, to: null }), onDelete: () => onChange({ from: null, to: null }), color: "primary", variant: "outlined", sx: { minHeight: 36 } }));
+}
+export function FilterSelect({ label, allLabel, value, options, onChange, fullWidth }) {
+    const id = `dashboard-${label.toLowerCase()}`;
+    // A value from the URL that `/filters` does not (yet) list is still shown.
+    const values = value && !options.includes(value) ? [value, ...options] : options;
+    return (_jsxs(FormControl, { size: "small", fullWidth: fullWidth, sx: { minWidth: 160, maxWidth: fullWidth ? undefined : 240 }, children: [_jsx(InputLabel, { id: `${id}-label`, shrink: true, children: label }), _jsxs(Select, { labelId: `${id}-label`, id: id, input: _jsx(OutlinedInput, { notched: true, label: label }), value: value ?? '', displayEmpty: true, onChange: (event) => onChange(event.target.value ? String(event.target.value) : null), renderValue: (selected) => (selected ? String(selected) : allLabel), children: [_jsx(MenuItem, { value: "", children: allLabel }), values.map((option) => (_jsx(MenuItem, { value: option, children: option }, option)))] })] }));
+}
+export function RefreshSwitch({ checked, onChange }) {
+    return (_jsx(FormControlLabel, { control: _jsx(Switch, { checked: checked, onChange: (event) => onChange(event.target.checked) }), label: "Auto-refresh", sx: { mr: 0, whiteSpace: 'nowrap' } }));
+}
+export function RangeToggle({ state, onChange }) {
+    return (_jsx(ToggleButtonGroup, { exclusive: true, size: "small", "aria-label": "Time range", value: isZoomed(state) ? null : state.range, onChange: (_event, next) => {
+            if (next)
+                onChange({ range: next, from: null, to: null });
+            else if (isZoomed(state))
+                onChange({ from: null, to: null });
+        }, children: DASHBOARD_RANGES.map((range) => (_jsx(ToggleButton, { value: range, "aria-label": DASHBOARD_RANGE_LABELS[range], sx: { px: 1.5, textTransform: 'none' }, children: range }, range))) }));
+}
+export function RangeSelect({ state, onChange, fullWidth, }) {
+    const id = useId();
+    return (_jsxs(FormControl, { size: "small", fullWidth: fullWidth, sx: { minWidth: 170 }, children: [_jsx(InputLabel, { id: `${id}-label`, shrink: true, children: "Range" }), _jsxs(Select, { labelId: `${id}-label`, input: _jsx(OutlinedInput, { notched: true, label: "Range" }), value: isZoomed(state) ? 'zoom' : state.range, onChange: (event) => {
+                    const next = event.target.value;
+                    if (next !== 'zoom')
+                        onChange({ range: next, from: null, to: null });
+                }, children: [isZoomed(state) && (_jsx(MenuItem, { value: "zoom", disabled: true, children: "Zoomed window" })), DASHBOARD_RANGES.map((range) => (_jsx(MenuItem, { value: range, children: DASHBOARD_RANGE_LABELS[range] }, range)))] })] }));
+}
+/** How many non-default filters hide behind the Filters button. */
+function hiddenFilterCount(state) {
+    return (state.service ? 1 : 0) + (state.instance ? 1 : 0) + (state.host ? 1 : 0) + (state.refresh ? 0 : 1);
+}
+/**
+ * The Host select (#602), shown once `/filters` reports a host (or the URL
+ * carries one): with no host metrics in the store it would filter nothing.
+ */
+function HostSelect({ value, hosts, onChange, fullWidth, }) {
+    if (hosts.length === 0 && !value)
+        return null;
+    return (_jsx(FilterSelect, { label: "Host", allLabel: "All hosts", value: value, options: hosts, onChange: onChange, fullWidth: fullWidth }));
+}
+function TabletFilterBar({ state, onChange, services, instances, hosts = [], updatedAt }) {
+    const [anchor, setAnchor] = useState(null);
+    const popoverId = useId();
+    return (_jsxs(Stack, { direction: "row", spacing: 1.5, useFlexGap: true, role: "toolbar", "aria-label": "Dashboard filters", sx: { alignItems: 'center', flexWrap: 'wrap', minWidth: 0 }, children: [_jsx(RangeSelect, { state: state, onChange: onChange }), _jsx(Badge, { color: "primary", badgeContent: hiddenFilterCount(state), children: _jsx(Button, { variant: "outlined", startIcon: _jsx(TuneIcon, {}), "aria-haspopup": "dialog", "aria-controls": anchor ? popoverId : undefined, "aria-expanded": anchor ? 'true' : 'false', onClick: (event) => setAnchor(event.currentTarget), sx: { minHeight: 40 }, children: "Filters" }) }), _jsx(ResetZoomChip, { state: state, onChange: onChange }), _jsx(Box, { sx: { ml: 'auto' }, children: _jsx(UpdatedAgo, { updatedAt: updatedAt }) }), _jsx(Popover, { id: popoverId, open: !!anchor, anchorEl: anchor, onClose: () => setAnchor(null), anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, slotProps: { paper: { role: 'dialog', 'aria-label': 'Filters', sx: { p: 2, width: 320 } } }, children: _jsxs(Stack, { spacing: 2, children: [_jsx(FilterSelect, { label: "Service", allLabel: "All services", value: state.service, options: services, onChange: (service) => onChange({ service }), fullWidth: true }), _jsx(FilterSelect, { label: "Instance", allLabel: "All instances", value: state.instance, options: instances, onChange: (instance) => onChange({ instance }), fullWidth: true }), _jsx(HostSelect, { value: state.host, hosts: hosts, onChange: (host) => onChange({ host }), fullWidth: true }), _jsx(RefreshSwitch, { checked: state.refresh, onChange: (refresh) => onChange({ refresh }) })] }) })] }));
+}
+function PhoneFilterBar({ state, onChange, services, instances, hosts = [], updatedAt }) {
+    const [open, setOpen] = useState(false);
+    const [draft, setDraft] = useState(state);
+    const titleId = useId();
+    const openDialog = () => {
+        setDraft(state);
+        setOpen(true);
+    };
+    const patchDraft = (patch) => setDraft((current) => ({ ...current, ...patch }));
+    const apply = () => {
+        onChange({
+            range: draft.range,
+            from: draft.from,
+            to: draft.to,
+            service: draft.service,
+            instance: draft.instance,
+            host: draft.host,
+            refresh: draft.refresh,
+        });
+        setOpen(false);
+    };
+    const reset = () => {
+        const { range, from, to, service, instance, host, refresh } = DEFAULT_DASHBOARD_STATE;
+        onChange({ range, from, to, service, instance, host, refresh });
+        setOpen(false);
+    };
+    const rangeText = isZoomed(state) ? 'Zoomed' : state.range;
+    return (_jsxs(_Fragment, { children: [_jsxs(Paper, { square: true, elevation: 0, role: "toolbar", "aria-label": "Dashboard filters", "data-testid": "phone-filter-bar", sx: {
+                    position: 'sticky',
+                    // Below the sticky AppBar (56px on phones).
+                    top: 56,
+                    zIndex: (theme) => theme.zIndex.appBar - 1,
+                    mx: -3,
+                    px: 3,
+                    py: 1,
+                    bgcolor: 'background.default',
+                    borderBottom: 1,
+                    borderColor: 'divider',
+                    display: 'flex',
+                    alignItems: 'center',
+                    gap: 1,
+                    minWidth: 0,
+                }, children: [_jsx(Chip, { label: rangeText, onClick: openDialog, "aria-label": `Range: ${rangeText}. Change filters`, sx: { minHeight: 44 } }), isZoomed(state) && (_jsx(IconButton, { "aria-label": "Reset zoom", onClick: () => onChange({ from: null, to: null }), sx: { width: 44, height: 44 }, children: _jsx(ZoomOutIcon, {}) })), _jsx(Box, { sx: { flex: 1, minWidth: 0, overflow: 'hidden' }, children: _jsx(UpdatedAgo, { updatedAt: updatedAt }) }), _jsx(Badge, { color: "primary", badgeContent: hiddenFilterCount(state), children: _jsx(Button, { variant: "outlined", startIcon: _jsx(TuneIcon, {}), "aria-haspopup": "dialog", onClick: openDialog, sx: { minHeight: 44 }, children: "Filters" }) })] }), _jsxs(Dialog, { fullScreen: true, open: open, onClose: () => setOpen(false), "aria-labelledby": titleId, children: [_jsxs(DialogTitle, { id: titleId, sx: { display: 'flex', alignItems: 'center', justifyContent: 'space-between' }, children: ["Filters", _jsx(IconButton, { "aria-label": "Close filters", onClick: () => setOpen(false), sx: { width: 44, height: 44 }, children: _jsx(CloseIcon, {}) })] }), _jsx(DialogContent, { dividers: true, children: _jsxs(Stack, { spacing: 3, sx: { pt: 1 }, children: [_jsx(RangeSelect, { state: draft, onChange: patchDraft, fullWidth: true }), _jsx(FilterSelect, { label: "Service", allLabel: "All services", value: draft.service, options: services, onChange: (service) => patchDraft({ service }), fullWidth: true }), _jsx(FilterSelect, { label: "Instance", allLabel: "All instances", value: draft.instance, options: instances, onChange: (instance) => patchDraft({ instance }), fullWidth: true }), _jsx(HostSelect, { value: draft.host, hosts: hosts, onChange: (host) => patchDraft({ host }), fullWidth: true }), _jsx(RefreshSwitch, { checked: draft.refresh, onChange: (refresh) => patchDraft({ refresh }) })] }) }), _jsxs(DialogActions, { sx: { p: 2, gap: 1 }, children: [_jsx(Button, { onClick: reset, sx: { minHeight: 44 }, children: "Reset" }), _jsx(Button, { variant: "contained", onClick: apply, sx: { minHeight: 44, flex: 1 }, children: "Apply" })] })] })] }));
+}
+export function DashboardFilterBar(props) {
+    if (props.layout === 'phone')
+        return _jsx(PhoneFilterBar, { ...props });
+    if (props.layout === 'tablet')
+        return _jsx(TabletFilterBar, { ...props });
+    return _jsx(DesktopFilterBar, { ...props });
+}
+function DesktopFilterBar({ state, onChange, services, instances, hosts = [], updatedAt }) {
+    return (_jsxs(Stack, { direction: "row", spacing: 1.5, useFlexGap: true, role: "toolbar", "aria-label": "Dashboard filters", sx: { alignItems: 'center', flexWrap: 'wrap', minWidth: 0 }, children: [_jsx(RangeToggle, { state: state, onChange: onChange }), _jsx(ResetZoomChip, { state: state, onChange: onChange }), _jsx(FilterSelect, { label: "Service", allLabel: "All services", value: state.service, options: services, onChange: (service) => onChange({ service }) }), _jsx(FilterSelect, { label: "Instance", allLabel: "All instances", value: state.instance, options: instances, onChange: (instance) => onChange({ instance }) }), _jsx(HostSelect, { value: state.host, hosts: hosts, onChange: (host) => onChange({ host }) }), _jsx(RefreshSwitch, { checked: state.refresh, onChange: (refresh) => onChange({ refresh }) }), _jsx(UpdatedAgo, { updatedAt: updatedAt })] }));
+}
+//# sourceMappingURL=DashboardFilterBar.js.map

package/dist/telemetry/ui/components/dashboard/DashboardFilterBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardFilterBar.js","sourceRoot":"","sources":["../../../../../src/telemetry/ui/components/dashboard/DashboardFilterBar.tsx"],"names":[],"mappings":"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"}

package/dist/telemetry/ui/components/dashboard/DashboardPanel.d.ts

@@ -0,0 +1,58 @@
+/**
+ * One Telemetry Dashboard panel — issue #578, epic #576.
+ *
+ * The frame every panel shares: a titled region, a header ACTIONS SLOT, and
+ * the loading / error / empty states, so a panel's own component only draws
+ * its data.
+ *
+ * Actions slot (the seam for #579 — "Open in Explorer", "Ask assistant"): a
+ * panel takes `actions`, each `{ key, label, icon, onClick }`. They render as
+ * icon buttons from `sm` up and fold into one ⋮ menu on phones. `onClick`
+ * receives the panel's `sql` — the statement(s) the API reports it ran for
+ * this panel, primary first — so an action never has to rebuild the query.
+ *
+ * Failure is PER PANEL: the error Alert shows the API's message and
+ * `details.reason`, with a Retry that refetches this panel only.
+ */
+import { type ReactNode } from 'react';
+import { type TelemetryErrorInfo } from '../../../headless/hooks/useTelemetryExplorer.js';
+export interface PanelAction {
+    key: string;
+    label: string;
+    icon: ReactNode;
+    /** Receives the panel's SQL, primary statement first. */
+    onClick: (sql: string[]) => void;
+    disabled?: boolean;
+}
+export interface DashboardPanelProps {
+    title: string;
+    /** Panel id for tests and deep links. */
+    id: string;
+    /**
+     * DOM id of the panel's region, for in-page links (#602: a verdict reason
+     * scrolls to its section). The region is then focusable by script
+     * (`tabIndex=-1`), so moving focus there announces the section.
+     */
+    anchorId?: string;
+    /** Beside the title: filters that belong to the panel (severity chips, a toggle). */
+    headerExtra?: ReactNode;
+    actions?: PanelAction[];
+    /** The `sql` of the panel's response(s); handed to every action. */
+    sql?: string | string[] | null;
+    isLoading?: boolean;
+    isRefreshing?: boolean;
+    error?: TelemetryErrorInfo | null;
+    onRetry?: () => void;
+    /** True when the data is present but holds nothing to show. */
+    isEmpty?: boolean;
+    emptyMessage?: string;
+    /** Skeleton height while the first result loads. */
+    skeletonHeight?: number;
+    children?: ReactNode;
+}
+export declare function PanelError({ error, onRetry }: {
+    error: TelemetryErrorInfo;
+    onRetry?: () => void;
+}): import("react").JSX.Element;
+export declare function DashboardPanel({ title, id, anchorId, headerExtra, actions, sql, isLoading, isRefreshing, error, onRetry, isEmpty, emptyMessage, skeletonHeight, children, }: DashboardPanelProps): import("react").JSX.Element;
+//# sourceMappingURL=DashboardPanel.d.ts.map

package/dist/telemetry/ui/components/dashboard/DashboardPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardPanel.d.ts","sourceRoot":"","sources":["../../../../../src/telemetry/ui/components/dashboard/DashboardPanel.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAqBxD,OAAO,EAAuB,KAAK,kBAAkB,EAAE,MAAM,iDAAiD,CAAC;AAG/G,MAAM,WAAW,WAAW;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,yDAAyD;IACzD,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,yCAAyC;IACzC,EAAE,EAAE,MAAM,CAAC;IACX;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qFAAqF;IACrF,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB,oEAAoE;IACpE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,KAAK,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oDAAoD;IACpD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE;IAAE,KAAK,EAAE,kBAAkB,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,+BAuBjG;AAkED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,EAAE,EACF,QAAQ,EACR,WAAW,EACX,OAAY,EACZ,GAAG,EACH,SAAiB,EACjB,YAAoB,EACpB,KAAY,EACZ,OAAO,EACP,OAAe,EACf,YAAwC,EACxC,cAAoB,EACpB,QAAQ,GACT,EAAE,mBAAmB,+BAqErB"}

package/dist/telemetry/ui/components/dashboard/DashboardPanel.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * One Telemetry Dashboard panel — issue #578, epic #576.
+ *
+ * The frame every panel shares: a titled region, a header ACTIONS SLOT, and
+ * the loading / error / empty states, so a panel's own component only draws
+ * its data.
+ *
+ * Actions slot (the seam for #579 — "Open in Explorer", "Ask assistant"): a
+ * panel takes `actions`, each `{ key, label, icon, onClick }`. They render as
+ * icon buttons from `sm` up and fold into one ⋮ menu on phones. `onClick`
+ * receives the panel's `sql` — the statement(s) the API reports it ran for
+ * this panel, primary first — so an action never has to rebuild the query.
+ *
+ * Failure is PER PANEL: the error Alert shows the API's message and
+ * `details.reason`, with a Retry that refetches this panel only.
+ */
+import { useId, useState } from 'react';
+import { Alert, AlertTitle, Box, Button, IconButton, LinearProgress, ListItemIcon, ListItemText, Menu, MenuItem, Paper, Skeleton, Stack, Tooltip, Typography, useMediaQuery, useTheme, } from '@mui/material';
+import MoreVertIcon from '@mui/icons-material/MoreVert';
+import { telemetryErrorTitle } from '../../../headless/hooks/useTelemetryExplorer.js';
+import { sqlList } from '../../../headless/services/telemetryDashboard.js';
+export function PanelError({ error, onRetry }) {
+    return (_jsxs(Alert, { severity: error.reason === 'TELEMETRY_QUERY_TIMEOUT' ? 'warning' : 'error', action: onRetry ? (_jsx(Button, { color: "inherit", size: "small", onClick: onRetry, sx: { minHeight: 44 }, children: "Retry" })) : undefined, children: [_jsx(AlertTitle, { children: telemetryErrorTitle(error) }), _jsx(Box, { component: "span", sx: { wordBreak: 'break-word' }, children: error.message }), (error.reason ?? error.code) && (_jsx(Typography, { variant: "caption", component: "div", sx: { mt: 0.5, opacity: 0.8 }, children: error.reason ?? error.code }))] }));
+}
+function PanelActions({ actions, sql, title, isPhone, }) {
+    const [anchor, setAnchor] = useState(null);
+    const menuId = useId();
+    if (actions.length === 0)
+        return null;
+    if (isPhone) {
+        return (_jsxs(_Fragment, { children: [_jsx(IconButton, { "aria-label": `${title} actions`, "aria-haspopup": "menu", "aria-controls": anchor ? menuId : undefined, "aria-expanded": anchor ? 'true' : undefined, onClick: (event) => setAnchor(event.currentTarget), sx: { width: 44, height: 44 }, children: _jsx(MoreVertIcon, {}) }), _jsx(Menu, { id: menuId, anchorEl: anchor, open: !!anchor, onClose: () => setAnchor(null), children: actions.map((action) => (_jsxs(MenuItem, { disabled: action.disabled, sx: { minHeight: 44 }, onClick: () => {
+                            setAnchor(null);
+                            action.onClick(sql);
+                        }, children: [_jsx(ListItemIcon, { children: action.icon }), _jsx(ListItemText, { children: action.label })] }, action.key))) })] }));
+    }
+    return (_jsx(Stack, { direction: "row", spacing: 0.5, children: actions.map((action) => (_jsx(Tooltip, { title: action.label, children: _jsx("span", { children: _jsx(IconButton, { "aria-label": action.label, disabled: action.disabled, onClick: () => action.onClick(sql), children: action.icon }) }) }, action.key))) }));
+}
+export function DashboardPanel({ title, id, anchorId, headerExtra, actions = [], sql, isLoading = false, isRefreshing = false, error = null, onRetry, isEmpty = false, emptyMessage = 'Nothing in this window.', skeletonHeight = 160, children, }) {
+    const theme = useTheme();
+    const isPhone = useMediaQuery(theme.breakpoints.down('sm'));
+    const headingId = `${id}-title`;
+    let body;
+    if (error)
+        body = _jsx(PanelError, { error: error, onRetry: onRetry });
+    else if (isLoading)
+        body = _jsx(Skeleton, { variant: "rounded", height: skeletonHeight, "data-testid": `${id}-skeleton` });
+    else if (isEmpty)
+        body = (_jsx(Typography, { variant: "body2", color: "text.secondary", sx: { py: 3, textAlign: 'center' }, children: emptyMessage }));
+    else
+        body = children;
+    return (_jsxs(Paper, { component: "section", variant: "outlined", "aria-labelledby": headingId, "data-testid": id, ...(anchorId ? { id: anchorId, tabIndex: -1 } : {}), sx: {
+            position: 'relative',
+            p: { xs: 1.5, sm: 2 },
+            minWidth: 0,
+            height: '100%',
+            overflow: 'hidden',
+            // Clear the sticky AppBar (and the phone filter bar) when scrolled to.
+            ...(anchorId && { scrollMarginTop: { xs: 112, sm: 80 } }),
+        }, children: [isRefreshing && (_jsx(LinearProgress, { "aria-label": `Refreshing ${title}`, sx: { position: 'absolute', top: 0, left: 0, right: 0, height: 2 } })), _jsxs(Stack, { direction: "row", spacing: 1, useFlexGap: true, sx: { alignItems: 'center', flexWrap: isPhone ? 'nowrap' : 'wrap', mb: 1.5, minHeight: 40 }, children: [_jsx(Typography, { id: headingId, variant: "h6", component: "h2", sx: { fontSize: '1rem', mr: 'auto', minWidth: 0, overflowWrap: 'anywhere' }, children: title }), !isPhone && headerExtra, _jsx(PanelActions, { actions: actions, sql: sqlList(sql), title: title, isPhone: isPhone })] }), isPhone && headerExtra && (_jsx(Box, { "data-testid": `${id}-header-extra`, sx: { mb: 1.5, minWidth: 0 }, children: headerExtra })), body] }));
+}
+//# sourceMappingURL=DashboardPanel.js.map

package/dist/telemetry/ui/components/dashboard/DashboardPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardPanel.js","sourceRoot":"","sources":["../../../../../src/telemetry/ui/components/dashboard/DashboardPanel.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAC;AACxD,OAAO,EACL,KAAK,EACL,UAAU,EACV,GAAG,EACH,MAAM,EACN,UAAU,EACV,cAAc,EACd,YAAY,EACZ,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,KAAK,EACL,OAAO,EACP,UAAU,EACV,aAAa,EACb,QAAQ,GACT,MAAM,eAAe,CAAC;AACvB,OAAO,YAAY,MAAM,8BAA8B,CAAC;AACxD,OAAO,EAAE,mBAAmB,EAA2B,MAAM,iDAAiD,CAAC;AAC/G,OAAO,EAAE,OAAO,EAAE,MAAM,kDAAkD,CAAC;AAsC3E,MAAM,UAAU,UAAU,CAAC,EAAE,KAAK,EAAE,OAAO,EAAuD;IAChG,OAAO,CACL,MAAC,KAAK,IACJ,QAAQ,EAAE,KAAK,CAAC,MAAM,KAAK,yBAAyB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,EAC1E,MAAM,EACJ,OAAO,CAAC,CAAC,CAAC,CACR,KAAC,MAAM,IAAC,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,sBAEnE,CACV,CAAC,CAAC,CAAC,SAAS,aAGf,KAAC,UAAU,cAAE,mBAAmB,CAAC,KAAK,CAAC,GAAc,EACrD,KAAC,GAAG,IAAC,SAAS,EAAC,MAAM,EAAC,EAAE,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,YAClD,KAAK,CAAC,OAAO,GACV,EACL,CAAC,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAC/B,KAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,SAAS,EAAC,KAAK,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,YACxE,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,IAAI,GAChB,CACd,IACK,CACT,CAAC;AACJ,CAAC;AAED,SAAS,YAAY,CAAC,EACpB,OAAO,EACP,GAAG,EACH,KAAK,EACL,OAAO,GAMR;IACC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAqB,IAAI,CAAC,CAAC;IAC/D,MAAM,MAAM,GAAG,KAAK,EAAE,CAAC;IAEvB,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IAEtC,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CACL,8BACE,KAAC,UAAU,kBACG,GAAG,KAAK,UAAU,mBAChB,MAAM,mBACL,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,mBAC3B,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC1C,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,aAAa,CAAC,EAClD,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,YAE7B,KAAC,YAAY,KAAG,GACL,EACb,KAAC,IAAI,IAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,YAC/E,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,MAAC,QAAQ,IAEP,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,EACrB,OAAO,EAAE,GAAG,EAAE;4BACZ,SAAS,CAAC,IAAI,CAAC,CAAC;4BAChB,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;wBACtB,CAAC,aAED,KAAC,YAAY,cAAE,MAAM,CAAC,IAAI,GAAgB,EAC1C,KAAC,YAAY,cAAE,MAAM,CAAC,KAAK,GAAgB,KATtC,MAAM,CAAC,GAAG,CAUN,CACZ,CAAC,GACG,IACN,CACJ,CAAC;IACJ,CAAC;IAED,OAAO,CACL,KAAC,KAAK,IAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAE,GAAG,YAChC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,KAAC,OAAO,IAAkB,KAAK,EAAE,MAAM,CAAC,KAAK,YAC3C,yBACE,KAAC,UAAU,kBAAa,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,YAChG,MAAM,CAAC,IAAI,GACD,GACR,IALK,MAAM,CAAC,GAAG,CAMd,CACX,CAAC,GACI,CACT,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,EAC7B,KAAK,EACL,EAAE,EACF,QAAQ,EACR,WAAW,EACX,OAAO,GAAG,EAAE,EACZ,GAAG,EACH,SAAS,GAAG,KAAK,EACjB,YAAY,GAAG,KAAK,EACpB,KAAK,GAAG,IAAI,EACZ,OAAO,EACP,OAAO,GAAG,KAAK,EACf,YAAY,GAAG,yBAAyB,EACxC,cAAc,GAAG,GAAG,EACpB,QAAQ,GACY;IACpB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,OAAO,GAAG,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IAC5D,MAAM,SAAS,GAAG,GAAG,EAAE,QAAQ,CAAC;IAChC,IAAI,IAAe,CAAC;IACpB,IAAI,KAAK;QAAE,IAAI,GAAG,KAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,GAAI,CAAC;SAC5D,IAAI,SAAS;QAAE,IAAI,GAAG,KAAC,QAAQ,IAAC,OAAO,EAAC,SAAS,EAAC,MAAM,EAAE,cAAc,iBAAe,GAAG,EAAE,WAAW,GAAI,CAAC;SAC5G,IAAI,OAAO;QACd,IAAI,GAAG,CACL,KAAC,UAAU,IAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,gBAAgB,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,YAClF,YAAY,GACF,CACd,CAAC;;QACC,IAAI,GAAG,QAAQ,CAAC;IAErB,OAAO,CACL,MAAC,KAAK,IACJ,SAAS,EAAC,SAAS,EACnB,OAAO,EAAC,UAAU,qBACD,SAAS,iBACb,EAAE,KACX,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACpD,EAAE,EAAE;YACF,QAAQ,EAAE,UAAU;YACpB,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE;YACrB,QAAQ,EAAE,CAAC;YACX,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,QAAQ;YAClB,uEAAuE;YACvE,GAAG,CAAC,QAAQ,IAAI,EAAE,eAAe,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;SAC1D,aAEA,YAAY,IAAI,CACf,KAAC,cAAc,kBACD,cAAc,KAAK,EAAE,EACjC,EAAE,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,GAClE,CACH,EAOD,MAAC,KAAK,IACJ,SAAS,EAAC,KAAK,EACf,OAAO,EAAE,CAAC,EACV,UAAU,QACV,EAAE,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE,aAE3F,KAAC,UAAU,IACT,EAAE,EAAE,SAAS,EACb,OAAO,EAAC,IAAI,EACZ,SAAS,EAAC,IAAI,EACd,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,EAAE,YAAY,EAAE,UAAU,EAAE,YAE1E,KAAK,GACK,EACZ,CAAC,OAAO,IAAI,WAAW,EACxB,KAAC,YAAY,IAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,GAAI,IAC/E,EACP,OAAO,IAAI,WAAW,IAAI,CACzB,KAAC,GAAG,mBAAc,GAAG,EAAE,eAAe,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,YACjE,WAAW,GACR,CACP,EACA,IAAI,IACC,CACT,CAAC;AACJ,CAAC"}

package/dist/telemetry/ui/components/dashboard/EventsFeed.d.ts

@@ -0,0 +1,21 @@
+import type { DashboardEventsResource } from '../../../headless/hooks/useTelemetryDashboard.js';
+import { type DashboardSeverity } from '../../../headless/services/telemetryDashboard.js';
+import { type PanelAction } from './DashboardPanel.js';
+import type { DashboardLayout } from './DashboardFilterBar.js';
+export declare const SEARCH_DEBOUNCE_MS = 400;
+export interface EventsFeedProps {
+    events: DashboardEventsResource;
+    sev: DashboardSeverity[];
+    q: string;
+    onChange: (patch: {
+        sev?: DashboardSeverity[];
+        q?: string;
+    }) => void;
+    layout: DashboardLayout;
+    actions?: PanelAction[];
+    /** Opens a trace (a validated 32-hex id) in the explorer (#579). Omitted: no link. */
+    onViewTrace?: (traceId: string) => void;
+    now?: number;
+}
+export declare function EventsFeed({ events, sev, q, onChange, layout, actions, onViewTrace, now, }: EventsFeedProps): import("react").JSX.Element;
+//# sourceMappingURL=EventsFeed.d.ts.map

package/dist/telemetry/ui/components/dashboard/EventsFeed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventsFeed.d.ts","sourceRoot":"","sources":["../../../../../src/telemetry/ui/components/dashboard/EventsFeed.tsx"],"names":[],"mappings":"AA6CA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kDAAkD,CAAC;AAChG,OAAO,EAGL,KAAK,iBAAiB,EACvB,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EAA8B,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACnF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAK/D,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAkItC,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,uBAAuB,CAAC;IAChC,GAAG,EAAE,iBAAiB,EAAE,CAAC;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,QAAQ,EAAE,CAAC,KAAK,EAAE;QAAE,GAAG,CAAC,EAAE,iBAAiB,EAAE,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACrE,MAAM,EAAE,eAAe,CAAC;IACxB,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB,sFAAsF;IACtF,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,GAAG,EACH,CAAC,EACD,QAAQ,EACR,MAAM,EACN,OAAY,EACZ,WAAW,EACX,GAAgB,GACjB,EAAE,eAAe,+BAgJjB"}

package/dist/telemetry/ui/components/dashboard/EventsFeed.js

@@ -0,0 +1,96 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Recent events — issue #578, epic #576.
+ *
+ * Log records newest first, filtered by the severity chips (`sev`, shared with
+ * the log timeline) and a body search (`q`, debounced 400 ms, ≤ 200
+ * characters — the API's limit). "Load more" follows the API's `nextCursor`.
+ *
+ * Desktop: a table (time, severity, service, one-line message). Tablet: the
+ * same without the service column. Phone: a list (severity chip + relative
+ * time, two-line message). Any row opens the full record in a dialog —
+ * full-screen on phones — with the body, exact timestamp, service, trace id
+ * and span id. MUI's Dialog traps focus and restores it to the row on close.
+ *
+ * "View trace" (#579): an event whose trace id is a real OpenTelemetry id (32
+ * lower-case hex digits, `traceLink.ts`) offers it in that detail, and opens
+ * the trace's spans in the Telemetry Explorer (loaded, not run). It lives in
+ * the detail rather than on the row because a row is itself a button, and a
+ * control nested in a control is unreachable for assistive technology. Any
+ * other id gets no link.
+ */
+import { useEffect, useId, useRef, useState } from 'react';
+import { Box, Button, CircularProgress, Dialog, DialogContent, DialogTitle, IconButton, InputAdornment, List, ListItemButton, Stack, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, TextField, Typography, } from '@mui/material';
+import SearchIcon from '@mui/icons-material/Search';
+import CloseIcon from '@mui/icons-material/Close';
+import AccountTreeOutlinedIcon from '@mui/icons-material/AccountTreeOutlined';
+import { DASHBOARD_SEARCH_MAX_LENGTH, } from '../../../headless/services/telemetryDashboard.js';
+import { DashboardPanel, PanelError } from './DashboardPanel.js';
+import { SeverityChip, SeverityChips, SeverityLabel } from './severity.js';
+import { formatRelative, formatTimestamp } from '../../../headless/lib/format.js';
+import { isTraceId } from '../../../headless/lib/traceLink.js';
+export const SEARCH_DEBOUNCE_MS = 400;
+/** A search box that reports its value 400 ms after the last keystroke. */
+function SearchField({ value, onChange }) {
+    const [draft, setDraft] = useState(value);
+    const onChangeRef = useRef(onChange);
+    onChangeRef.current = onChange;
+    const committed = useRef(value);
+    // An outside change (Reset, back button) replaces the draft.
+    useEffect(() => {
+        if (value !== committed.current) {
+            committed.current = value;
+            setDraft(value);
+        }
+    }, [value]);
+    useEffect(() => {
+        if (draft === committed.current)
+            return;
+        const timer = setTimeout(() => {
+            committed.current = draft;
+            onChangeRef.current(draft);
+        }, SEARCH_DEBOUNCE_MS);
+        return () => clearTimeout(timer);
+    }, [draft]);
+    return (_jsx(TextField, { size: "small", fullWidth: true, type: "search", label: "Search messages", value: draft, onChange: (event) => setDraft(event.target.value.slice(0, DASHBOARD_SEARCH_MAX_LENGTH)), slotProps: {
+            htmlInput: { maxLength: DASHBOARD_SEARCH_MAX_LENGTH },
+            input: {
+                startAdornment: (_jsx(InputAdornment, { position: "start", children: _jsx(SearchIcon, { fontSize: "small", "aria-hidden": true }) })),
+            },
+        }, sx: { mb: 1.5 } }));
+}
+function DetailRow({ label, value, mono = false }) {
+    return (_jsxs(Box, { sx: { mb: 1.5 }, children: [_jsx(Typography, { variant: "caption", color: "text.secondary", component: "dt", children: label }), _jsx(Typography, { component: "dd", variant: "body2", sx: { m: 0, wordBreak: 'break-all', fontFamily: mono ? 'monospace' : undefined }, children: value ?? '—' })] }));
+}
+function EventDialog({ event, fullScreen, onClose, onViewTrace, }) {
+    const titleId = useId();
+    return (_jsx(Dialog, { open: event !== null, onClose: onClose, fullScreen: fullScreen, fullWidth: true, maxWidth: "md", "aria-labelledby": titleId, children: event && (_jsxs(_Fragment, { children: [_jsxs(DialogTitle, { id: titleId, sx: { display: 'flex', alignItems: 'center', gap: 1, pr: 1 }, children: [_jsx(SeverityLabel, { severity: event.severity }), _jsx(Box, { component: "span", sx: { flex: 1 }, children: "Log event" }), _jsx(IconButton, { "aria-label": "Close event", onClick: onClose, sx: { width: 44, height: 44 }, children: _jsx(CloseIcon, {}) })] }), _jsxs(DialogContent, { dividers: true, children: [_jsx(Box, { component: "pre", "data-testid": "event-body", sx: { m: 0, mb: 2, whiteSpace: 'pre-wrap', wordBreak: 'break-word', fontFamily: 'monospace', fontSize: 13 }, children: event.body ?? '(no message)' }), _jsxs(Box, { component: "dl", sx: { m: 0 }, children: [_jsx(DetailRow, { label: "Timestamp (UTC)", value: event.timestamp, mono: true }), _jsx(DetailRow, { label: "Service", value: event.service }), _jsx(DetailRow, { label: "Trace id", value: event.traceId, mono: true }), _jsx(DetailRow, { label: "Span id", value: event.spanId, mono: true })] }), onViewTrace && isTraceId(event.traceId) && (_jsx(Button, { variant: "outlined", startIcon: _jsx(AccountTreeOutlinedIcon, {}), onClick: () => onViewTrace(event.traceId), sx: { minHeight: 44 }, children: "View trace" }))] })] })) }));
+}
+/** Event timestamps carry nanoseconds; `Date.parse` needs at most milliseconds. */
+function eventTime(timestamp) {
+    const match = /^(.*T\d{2}:\d{2}:\d{2})(\.\d+)?(Z|[+-]\d{2}:?\d{2})?$/.exec(timestamp.replace(' ', 'T'));
+    if (!match)
+        return timestamp;
+    const fraction = match[2] ? match[2].slice(0, 4) : '';
+    return `${match[1]}${fraction}${match[3] ?? 'Z'}`;
+}
+export function EventsFeed({ events, sev, q, onChange, layout, actions = [], onViewTrace, now = Date.now(), }) {
+    const [selected, setSelected] = useState(null);
+    const isPhone = layout === 'phone';
+    const showService = layout === 'desktop';
+    const openOnKey = (event, item) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            setSelected(item);
+        }
+    };
+    const rows = isPhone ? (_jsx(List, { disablePadding: true, "aria-label": "Recent events", children: events.items.map((item, index) => (_jsxs(ListItemButton, { divider: true, onClick: () => setSelected(item), sx: { px: 0.5, display: 'block', minHeight: 44 }, children: [_jsxs(Stack, { direction: "row", spacing: 1, sx: { alignItems: 'center', mb: 0.5 }, children: [_jsx(SeverityChip, { severity: item.severity }), _jsx(Typography, { variant: "caption", color: "text.secondary", title: formatTimestamp(eventTime(item.timestamp)), children: formatRelative(eventTime(item.timestamp), now) })] }), _jsx(Typography, { variant: "body2", sx: {
+                        display: '-webkit-box',
+                        WebkitLineClamp: 2,
+                        WebkitBoxOrient: 'vertical',
+                        overflow: 'hidden',
+                        wordBreak: 'break-word',
+                    }, children: item.body ?? '(no message)' })] }, `${item.timestamp}-${item.spanId ?? ''}-${index}`))) })) : (_jsx(TableContainer, { children: _jsxs(Table, { size: "small", "aria-label": "Recent events", sx: { tableLayout: 'fixed' }, children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { sx: { width: 96 }, children: "Time" }), _jsx(TableCell, { sx: { width: 96 }, children: "Severity" }), showService && _jsx(TableCell, { sx: { width: 160 }, children: "Service" }), _jsx(TableCell, { children: "Message" })] }) }), _jsx(TableBody, { children: events.items.map((item, index) => (_jsxs(TableRow, { hover: true, tabIndex: 0, role: "button", "aria-label": `Open event: ${item.body ?? 'no message'}`, onClick: () => setSelected(item), onKeyDown: (event) => openOnKey(event, item), sx: { cursor: 'pointer' }, children: [_jsx(TableCell, { sx: { whiteSpace: 'nowrap' }, title: formatTimestamp(eventTime(item.timestamp)), children: formatRelative(eventTime(item.timestamp), now) }), _jsx(TableCell, { children: _jsx(SeverityLabel, { severity: item.severity }) }), showService && (_jsx(TableCell, { sx: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, children: item.service ?? '—' })), _jsx(TableCell, { sx: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, children: item.body ?? '(no message)' })] }, `${item.timestamp}-${item.spanId ?? ''}-${index}`))) })] }) }));
+    return (_jsxs(DashboardPanel, { id: "panel-events", title: "Recent events", headerExtra: _jsx(SeverityChips, { value: sev, onChange: (next) => onChange({ sev: next }), large: isPhone, label: "Event severity filter" }), actions: actions, sql: events.data?.sql, isRefreshing: events.isRefreshing, children: [_jsx(SearchField, { value: q, onChange: (next) => onChange({ q: next }) }), events.error ? (_jsx(PanelError, { error: events.error, onRetry: events.reload })) : events.isLoading ? (_jsx(Stack, { sx: { alignItems: 'center', py: 4 }, children: _jsx(CircularProgress, { size: 28, "aria-label": "Loading events" }) })) : events.items.length === 0 ? (_jsx(Typography, { variant: "body2", color: "text.secondary", sx: { py: 3, textAlign: 'center' }, children: q ? 'No events match this search.' : 'No events of the selected severities in this window.' })) : (_jsxs(_Fragment, { children: [rows, events.loadMoreError && (_jsx(Box, { sx: { mt: 1.5 }, children: _jsx(PanelError, { error: events.loadMoreError, onRetry: events.loadMore }) })), events.hasMore && (_jsx(Stack, { sx: { alignItems: 'center', mt: 1.5 }, children: _jsx(Button, { variant: "outlined", onClick: events.loadMore, disabled: events.isLoadingMore, startIcon: events.isLoadingMore ? _jsx(CircularProgress, { size: 16 }) : undefined, sx: { minHeight: 44 }, children: "Load more" }) }))] })), _jsx(EventDialog, { event: selected, fullScreen: isPhone, onClose: () => setSelected(null), onViewTrace: onViewTrace })] }));
+}
+//# sourceMappingURL=EventsFeed.js.map

package/dist/telemetry/ui/components/dashboard/EventsFeed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventsFeed.js","sourceRoot":"","sources":["../../../../../src/telemetry/ui/components/dashboard/EventsFeed.tsx"],"names":[],"mappings":"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"}