@lunora/studio 1.0.0-alpha.55 → 1.0.0-alpha.57

package/dist/packem_chunks/LogsPanel.js

@@ -1,25 +1,466 @@
 import { c } from 'react/compiler-runtime';
 import { useVirtualizer } from '@tanstack/react-virtual';
-import { useState, useEffect, useMemo, useRef } from 'react';
+import { useState, useReducer, useRef, useEffect, useMemo } from 'react';
 import { f as formatLogFields } from '../packem_shared/log-fields-jEH83H2G.js';
-import { E as ErrorAlert } from '../packem_shared/error-alert-vIPQoN3Y.js';
+import { E as ErrorAlert } from '../packem_shared/error-alert-D9uIFJUS.js';
 import { L as LiveError } from '../packem_shared/live-status-FZ0psC1z.js';
 import { ShardInput } from '../packem_shared/ShardInput-CZnpHILL.js';
 import { B as Badge } from '../packem_shared/badge-B2PKA1-5.js';
 import { E as EmptyState } from '../packem_shared/empty-state-DY_oe0k6.js';
 import { I as Input } from '../packem_shared/input-XH4r1Pt1.js';
-import { u as useAdminQuery } from '../packem_shared/use-admin-query-BGJ010yZ.js';
+import { u as useAdminQuery } from '../packem_shared/use-admin-query-C7JNuQp-.js';
 import useDebounced from '../packem_shared/useDebounced-Dxncpg6z.js';
 import { useT } from '../packem_shared/DEFAULT_LOCALE-CiX4W7Kr.js';
-import { ADMIN_FUNCTIONS } from '../packem_shared/ADMIN_FUNCTIONS-C6TEeUiJ.js';
+import { ADMIN_FUNCTIONS } from '../packem_shared/ADMIN_FUNCTIONS-C1LXrovV.js';
 import { b as CLOUDFLARE_OBSERVABILITY_URL } from '../packem_shared/cf-links-SIbyi4Y1.js';
 import { r as recordShard } from '../packem_shared/shard-history-AxiJ1WPP.js';
 import { c as cn } from '../packem_shared/utils-B05Dmz_H.js';
 import { f as flooredRectObserver } from '../packem_shared/virtual-rect-CVMUskSm.js';
-import { jsxDEV } from 'react/jsx-dev-runtime';
+import { useLunora } from '@lunora/react';
+import { B as Button } from '../packem_shared/button-BhsN2uZH.js';
+import { T as Table, a as TableHeader, b as TableRow, c as TableHead, d as TableBody, e as TableCell } from '../packem_shared/table-DsCa9Qp9.js';
+import { f as fireAndForget, l as errorCode, e as errorMessage } from '../packem_shared/internal-DzHCc2Rq.js';
+import { jsxDEV, Fragment } from 'react/jsx-dev-runtime';
 
 const LOG_LEVEL_ORDER = ["trace", "debug", "log", "info", "warn", "error", "fatal"];
 
+const LOG_ARCHIVE_NOT_CONFIGURED = "LOG_ARCHIVE_NOT_CONFIGURED";
+
+const LEVEL_VARIANT = {
+  debug: "secondary",
+  error: "destructive",
+  fatal: "destructive",
+  info: "outline",
+  log: "outline",
+  trace: "outline",
+  warn: "secondary"
+};
+
+const INITIAL_STATE = {
+  cursor: void 0,
+  error: null,
+  loading: false,
+  notConfigured: false,
+  rows: null
+};
+const archiveReducer = (state, action) => {
+  switch (action.type) {
+    case "append": {
+      return {
+        ...state,
+        cursor: action.cursor,
+        error: null,
+        loading: false,
+        rows: [...state.rows ?? [], ...action.rows]
+      };
+    }
+    case "failed": {
+      return {
+        cursor: void 0,
+        error: action.message,
+        loading: false,
+        notConfigured: false,
+        rows: null
+      };
+    }
+    case "loaded": {
+      return {
+        cursor: action.cursor,
+        error: null,
+        loading: false,
+        notConfigured: false,
+        rows: action.rows
+      };
+    }
+    case "loading": {
+      return {
+        ...state,
+        error: null,
+        loading: true,
+        notConfigured: false
+      };
+    }
+    case "notConfigured": {
+      return {
+        cursor: void 0,
+        error: null,
+        loading: false,
+        notConfigured: true,
+        rows: null
+      };
+    }
+    case "pageFailed": {
+      return {
+        ...state,
+        error: action.message,
+        loading: false
+      };
+    }
+    default: {
+      return state;
+    }
+  }
+};
+const ArchiveRow = (t0) => {
+  const $ = c(33);
+  const {
+    row
+  } = t0;
+  let t1;
+  if ($[0] !== row.fields) {
+    t1 = formatLogFields(row.fields);
+    $[0] = row.fields;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const fields = t1;
+  const t2 = `lg-archive-row-${String(row.ts)}`;
+  let t3;
+  if ($[2] !== row.ts) {
+    t3 = new Date(row.ts).toLocaleString();
+    $[2] = row.ts;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  let t4;
+  if ($[4] !== t3) {
+    t4 = /* @__PURE__ */ jsxDEV(TableCell, {
+      className: "tabular-nums whitespace-nowrap text-xs text-muted-foreground",
+      children: t3
+    }, void 0, false);
+    $[4] = t3;
+    $[5] = t4;
+  } else {
+    t4 = $[5];
+  }
+  const t5 = LEVEL_VARIANT[row.level];
+  let t6;
+  if ($[6] !== row.level || $[7] !== t5) {
+    t6 = /* @__PURE__ */ jsxDEV(TableCell, {
+      children: /* @__PURE__ */ jsxDEV(Badge, {
+        variant: t5,
+        children: row.level
+      }, void 0, false)
+    }, void 0, false);
+    $[6] = row.level;
+    $[7] = t5;
+    $[8] = t6;
+  } else {
+    t6 = $[8];
+  }
+  let t7;
+  if ($[9] !== row.functionPath) {
+    t7 = /* @__PURE__ */ jsxDEV(TableCell, {
+      className: "font-mono text-xs",
+      children: row.functionPath
+    }, void 0, false);
+    $[9] = row.functionPath;
+    $[10] = t7;
+  } else {
+    t7 = $[10];
+  }
+  let t8;
+  if ($[11] !== row.message) {
+    t8 = /* @__PURE__ */ jsxDEV("div", {
+      className: "truncate",
+      title: row.message,
+      children: row.message
+    }, void 0, false);
+    $[11] = row.message;
+    $[12] = t8;
+  } else {
+    t8 = $[12];
+  }
+  let t9;
+  if ($[13] !== fields) {
+    t9 = fields !== "" && /* @__PURE__ */ jsxDEV("div", {
+      className: "truncate font-mono text-[11px] text-muted-foreground",
+      title: fields,
+      children: fields
+    }, void 0, false);
+    $[13] = fields;
+    $[14] = t9;
+  } else {
+    t9 = $[14];
+  }
+  let t10;
+  if ($[15] !== t8 || $[16] !== t9) {
+    t10 = /* @__PURE__ */ jsxDEV(TableCell, {
+      className: "max-w-md",
+      children: [t8, t9]
+    }, void 0, true);
+    $[15] = t8;
+    $[16] = t9;
+    $[17] = t10;
+  } else {
+    t10 = $[17];
+  }
+  const t11 = row.traceId ?? "—";
+  let t12;
+  if ($[18] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV(TableCell, {
+      className: "font-mono text-[11px] text-muted-foreground",
+      children: t11
+    }, void 0, false);
+    $[18] = t11;
+    $[19] = t12;
+  } else {
+    t12 = $[19];
+  }
+  const t13 = row.shardKey ?? "—";
+  let t14;
+  if ($[20] !== t13) {
+    t14 = /* @__PURE__ */ jsxDEV(TableCell, {
+      className: "font-mono text-[11px] text-muted-foreground",
+      children: t13
+    }, void 0, false);
+    $[20] = t13;
+    $[21] = t14;
+  } else {
+    t14 = $[21];
+  }
+  const t15 = row.userId ?? "—";
+  let t16;
+  if ($[22] !== t15) {
+    t16 = /* @__PURE__ */ jsxDEV(TableCell, {
+      className: "font-mono text-[11px] text-muted-foreground",
+      children: t15
+    }, void 0, false);
+    $[22] = t15;
+    $[23] = t16;
+  } else {
+    t16 = $[23];
+  }
+  let t17;
+  if ($[24] !== t10 || $[25] !== t12 || $[26] !== t14 || $[27] !== t16 || $[28] !== t2 || $[29] !== t4 || $[30] !== t6 || $[31] !== t7) {
+    t17 = /* @__PURE__ */ jsxDEV(TableRow, {
+      "data-testid": t2,
+      children: [t4, t6, t7, t10, t12, t14, t16]
+    }, void 0, true);
+    $[24] = t10;
+    $[25] = t12;
+    $[26] = t14;
+    $[27] = t16;
+    $[28] = t2;
+    $[29] = t4;
+    $[30] = t6;
+    $[31] = t7;
+    $[32] = t17;
+  } else {
+    t17 = $[32];
+  }
+  return t17;
+};
+const ArchiveFeed = ({
+  shardKey
+}) => {
+  const client = useLunora();
+  const t = useT();
+  const [pathPrefix, setPathPrefix] = useState("");
+  const [userIdFilter, setUserIdFilter] = useState("");
+  const [minLevel, setMinLevel] = useState("");
+  const [{
+    cursor,
+    error,
+    loading,
+    notConfigured,
+    rows
+  }, dispatch] = useReducer(archiveReducer, INITIAL_STATE);
+  const debouncedPathPrefix = useDebounced(pathPrefix.trim(), 400);
+  const debouncedUserId = useDebounced(userIdFilter.trim(), 400);
+  const baseQuery = {
+    ...debouncedPathPrefix === "" ? {} : {
+      functionPathPrefix: debouncedPathPrefix
+    },
+    ...minLevel === "" ? {} : {
+      minLevel
+    },
+    ...shardKey === "" ? {} : {
+      shardKey
+    },
+    ...debouncedUserId === "" ? {} : {
+      userId: debouncedUserId
+    }
+  };
+  const querySignature = JSON.stringify(baseQuery);
+  const activeSignatureRef = useRef(querySignature);
+  useEffect(() => {
+    const token = {
+      cancelled: false
+    };
+    activeSignatureRef.current = querySignature;
+    fireAndForget((async () => {
+      dispatch({
+        type: "loading"
+      });
+      try {
+        const page = await client.queryLogArchive(baseQuery);
+        if (!token.cancelled) {
+          dispatch({
+            cursor: page.nextCursor,
+            rows: page.rows,
+            type: "loaded"
+          });
+        }
+      } catch (error_) {
+        if (!token.cancelled) {
+          dispatch(errorCode(error_) === LOG_ARCHIVE_NOT_CONFIGURED ? {
+            type: "notConfigured"
+          } : {
+            message: errorMessage(error_),
+            type: "failed"
+          });
+        }
+      }
+    })());
+    return () => {
+      token.cancelled = true;
+    };
+  }, [client, querySignature]);
+  const loadMore = async () => {
+    if (cursor === void 0) {
+      return;
+    }
+    const signature = querySignature;
+    dispatch({
+      type: "loading"
+    });
+    try {
+      const page = await client.queryLogArchive({
+        ...baseQuery,
+        cursor
+      });
+      if (activeSignatureRef.current === signature) {
+        dispatch({
+          cursor: page.nextCursor,
+          rows: page.rows,
+          type: "append"
+        });
+      }
+    } catch (error_) {
+      if (activeSignatureRef.current === signature) {
+        dispatch({
+          message: errorMessage(error_),
+          type: "pageFailed"
+        });
+      }
+    }
+  };
+  const onPathPrefixChange = (event) => {
+    setPathPrefix(event.target.value);
+  };
+  const onUserIdChange = (event) => {
+    setUserIdFilter(event.target.value);
+  };
+  const onMinLevelChange = (event) => {
+    setMinLevel(event.target.value);
+  };
+  const onLoadMore = () => {
+    fireAndForget(loadMore());
+  };
+  if (notConfigured) {
+    return /* @__PURE__ */ jsxDEV(EmptyState, {
+      action: /* @__PURE__ */ jsxDEV("a", {
+        className: "text-sm text-primary underline-offset-4 hover:underline",
+        href: CLOUDFLARE_OBSERVABILITY_URL,
+        rel: "noreferrer",
+        target: "_blank",
+        children: t("Open in Cloudflare")
+      }, void 0, false),
+      description: t("Wire pipelineLogSink to a Cloudflare Pipeline → R2 Data Catalog table and set R2_SQL_ACCOUNT_ID, R2_SQL_TOKEN, R2_SQL_BUCKET to browse the durable log archive here."),
+      testId: "lg-archive-not-configured",
+      title: t("Log archive not configured")
+    }, void 0, false);
+  }
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: "flex flex-col gap-4",
+    "data-testid": "lg-archive",
+    children: [/* @__PURE__ */ jsxDEV("div", {
+      className: "flex flex-wrap items-center gap-2",
+      children: [/* @__PURE__ */ jsxDEV(Input, {
+        "aria-label": t("Function path prefix"),
+        className: "h-8 w-48",
+        "data-testid": "lg-archive-path",
+        onChange: onPathPrefixChange,
+        placeholder: t("function path…"),
+        value: pathPrefix
+      }, void 0, false), /* @__PURE__ */ jsxDEV(Input, {
+        "aria-label": t("User id"),
+        className: "h-8 w-40",
+        "data-testid": "lg-archive-user",
+        onChange: onUserIdChange,
+        placeholder: t("user id…"),
+        value: userIdFilter
+      }, void 0, false), /* @__PURE__ */ jsxDEV("select", {
+        "aria-label": t("Minimum level"),
+        className: "h-8 rounded-md border border-border bg-background px-2 text-sm",
+        "data-testid": "lg-archive-min-level",
+        onChange: onMinLevelChange,
+        value: minLevel,
+        children: [/* @__PURE__ */ jsxDEV("option", {
+          value: "",
+          children: t("min level")
+        }, void 0, false), LOG_LEVEL_ORDER.map((level) => /* @__PURE__ */ jsxDEV("option", {
+          value: level,
+          children: level
+        }, level, false))]
+      }, void 0, true)]
+    }, void 0, true), error !== null && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-sm text-destructive",
+      "data-testid": "lg-archive-error",
+      role: "alert",
+      children: error
+    }, void 0, false), loading && rows === null && error === null && /* @__PURE__ */ jsxDEV("p", {
+      className: "text-sm text-muted-foreground",
+      "data-testid": "lg-archive-loading",
+      children: t("Loading…")
+    }, void 0, false), rows !== null && rows.length === 0 && /* @__PURE__ */ jsxDEV(EmptyState, {
+      description: t("No archived logs match these filters. The durable archive fills as pipelineLogSink flushes records to R2."),
+      testId: "lg-archive-empty",
+      title: t("No archived logs.")
+    }, void 0, false), rows !== null && rows.length > 0 && /* @__PURE__ */ jsxDEV("div", {
+      className: "overflow-hidden rounded-xl border border-border shadow-xs",
+      children: /* @__PURE__ */ jsxDEV(Table, {
+        "data-testid": "lg-archive-table",
+        children: [/* @__PURE__ */ jsxDEV(TableHeader, {
+          children: /* @__PURE__ */ jsxDEV(TableRow, {
+            children: [/* @__PURE__ */ jsxDEV(TableHead, {
+              children: t("Time")
+            }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+              children: t("Level")
+            }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+              children: t("Function")
+            }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+              children: t("Message")
+            }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+              children: t("Trace")
+            }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+              children: t("Shard")
+            }, void 0, false), /* @__PURE__ */ jsxDEV(TableHead, {
+              children: t("User")
+            }, void 0, false)]
+          }, void 0, true)
+        }, void 0, false), /* @__PURE__ */ jsxDEV(TableBody, {
+          children: rows.map((row, index) => /* @__PURE__ */ jsxDEV(ArchiveRow, {
+            row
+          }, `${String(row.ts)}-${String(index)}`, false))
+        }, void 0, false)]
+      }, void 0, true)
+    }, void 0, false), cursor !== void 0 && /* @__PURE__ */ jsxDEV("div", {
+      children: /* @__PURE__ */ jsxDEV(Button, {
+        "data-testid": "lg-archive-more",
+        disabled: loading,
+        onClick: onLoadMore,
+        size: "sm",
+        variant: "outline",
+        children: loading ? t("Loading…") : t("Load more")
+      }, void 0, false)
+    }, void 0, false)]
+  }, void 0, true);
+};
+
 const SCROLL_HEIGHT = 400;
 const ROW_HEIGHT = 36;
 const SCROLL_STYLE = {
@@ -32,15 +473,6 @@ const ROW_BASE_STYLE = {
   top: 0,
   width: "100%"
 };
-const LEVEL_VARIANT = {
-  debug: "secondary",
-  error: "destructive",
-  fatal: "destructive",
-  info: "outline",
-  log: "outline",
-  trace: "outline",
-  warn: "secondary"
-};
 const OUTCOME_VARIANT = {
   error: "destructive",
   ok: "secondary"
@@ -640,6 +1072,10 @@ const LogsPanel = ({
     setView("errors");
     setShowSummary(false);
   };
+  const showArchive = () => {
+    setView("archive");
+    setShowSummary(false);
+  };
   return /* @__PURE__ */ jsxDEV("div", {
     className: "flex flex-col gap-4",
     "data-testid": "lunora-logs",
@@ -664,12 +1100,20 @@ const LogsPanel = ({
           role: "tab",
           type: "button",
           children: t("Errors")
+        }, void 0, false), /* @__PURE__ */ jsxDEV("button", {
+          "aria-selected": view === "archive",
+          className: cn("px-3 py-1 text-sm", view === "archive" ? "bg-muted font-medium" : "text-muted-foreground"),
+          "data-testid": "lg-view-archive",
+          onClick: showArchive,
+          role: "tab",
+          type: "button",
+          children: t("Archive")
         }, void 0, false)]
       }, void 0, true), /* @__PURE__ */ jsxDEV(ShardInput, {
         onChange: setShardKey,
         testId: "lg-shard-input",
         value: shardKey
-      }, void 0, false), /* @__PURE__ */ jsxDEV(LiveError, {
+      }, void 0, false), view !== "archive" && /* @__PURE__ */ jsxDEV(LiveError, {
         message: liveError,
         prefix: "lg"
       }, void 0, false), /* @__PURE__ */ jsxDEV("a", {
@@ -773,82 +1217,86 @@ const LogsPanel = ({
           children: t("error")
         }, void 0, false)]
       }, void 0, true)]
-    }, void 0, true), readout === "error" && /* @__PURE__ */ jsxDEV(ErrorAlert, {
-      error: errorSource,
-      testId: "lg-error"
-    }, void 0, false), readout === "empty" && /* @__PURE__ */ jsxDEV(EmptyState, {
-      description: t("Function and request logs for this shard show up here as your app handles traffic."),
-      icon: /* @__PURE__ */ jsxDEV("svg", {
-        "aria-hidden": "true",
-        fill: "none",
-        stroke: "currentColor",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        strokeWidth: 1.6,
-        viewBox: "0 0 24 24",
-        children: /* @__PURE__ */ jsxDEV("path", {
-          d: "M4 5h16M4 12h16M4 19h10"
-        }, void 0, false)
-      }, void 0, false),
-      testId: "lg-empty",
-      title: t("No logs.")
-    }, void 0, false), readout === "summary" && /* @__PURE__ */ jsxDEV("div", {
-      className: "flex flex-col gap-4 rounded-xl border border-border bg-card p-4 shadow-xs",
-      "data-testid": "logs-summary",
-      children: [/* @__PURE__ */ jsxDEV("p", {
-        className: "text-xs text-muted-foreground",
-        "data-testid": "logs-summary-total",
-        children: t("{count} entries", {
-          count: summary.total
-        })
-      }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
-        children: [/* @__PURE__ */ jsxDEV("h4", {
-          className: "mb-1 font-mono text-[11px] tracking-wide text-muted-foreground uppercase",
-          children: t("By level")
+    }, void 0, true), view === "archive" ? /* @__PURE__ */ jsxDEV(ArchiveFeed, {
+      shardKey: debouncedShard
+    }, void 0, false) : /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [readout === "error" && /* @__PURE__ */ jsxDEV(ErrorAlert, {
+        error: errorSource,
+        testId: "lg-error"
+      }, void 0, false), readout === "empty" && /* @__PURE__ */ jsxDEV(EmptyState, {
+        description: t("Function and request logs for this shard show up here as your app handles traffic."),
+        icon: /* @__PURE__ */ jsxDEV("svg", {
+          "aria-hidden": "true",
+          fill: "none",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: 1.6,
+          viewBox: "0 0 24 24",
+          children: /* @__PURE__ */ jsxDEV("path", {
+            d: "M4 5h16M4 12h16M4 19h10"
+          }, void 0, false)
+        }, void 0, false),
+        testId: "lg-empty",
+        title: t("No logs.")
+      }, void 0, false), readout === "summary" && /* @__PURE__ */ jsxDEV("div", {
+        className: "flex flex-col gap-4 rounded-xl border border-border bg-card p-4 shadow-xs",
+        "data-testid": "logs-summary",
+        children: [/* @__PURE__ */ jsxDEV("p", {
+          className: "text-xs text-muted-foreground",
+          "data-testid": "logs-summary-total",
+          children: t("{count} entries", {
+            count: summary.total
+          })
         }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
-          className: "overflow-hidden rounded-lg border border-border",
-          "data-testid": "logs-summary-levels",
+          children: [/* @__PURE__ */ jsxDEV("h4", {
+            className: "mb-1 font-mono text-[11px] tracking-wide text-muted-foreground uppercase",
+            children: t("By level")
+          }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+            className: "overflow-hidden rounded-lg border border-border",
+            "data-testid": "logs-summary-levels",
+            role: "grid",
+            children: summary.byLevel.map((bucket) => /* @__PURE__ */ jsxDEV(SummaryBucketRow, {
+              bucket
+            }, bucket.key, false))
+          }, void 0, false)]
+        }, void 0, true), /* @__PURE__ */ jsxDEV("div", {
+          children: [/* @__PURE__ */ jsxDEV("h4", {
+            className: "mb-1 font-mono text-[11px] tracking-wide text-muted-foreground uppercase",
+            children: t("By function")
+          }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+            className: "overflow-hidden rounded-lg border border-border",
+            "data-testid": "logs-summary-paths",
+            role: "grid",
+            children: summary.byPath.map((bucket_0) => /* @__PURE__ */ jsxDEV(SummaryBucketRow, {
+              bucket: bucket_0
+            }, bucket_0.key, false))
+          }, void 0, false)]
+        }, void 0, true)]
+      }, void 0, true), readout === "list" && /* @__PURE__ */ jsxDEV("div", {
+        className: "rounded-xl border border-border shadow-xs",
+        "data-testid": "lg-scroll",
+        ref: scrollRef,
+        style: SCROLL_STYLE,
+        children: /* @__PURE__ */ jsxDEV("div", {
+          "aria-label": t("Recent logs"),
+          "data-testid": "lg-table",
           role: "grid",
-          children: summary.byLevel.map((bucket) => /* @__PURE__ */ jsxDEV(SummaryBucketRow, {
-            bucket
-          }, bucket.key, false))
-        }, void 0, false)]
-      }, void 0, true), /* @__PURE__ */ jsxDEV("div", {
-        children: [/* @__PURE__ */ jsxDEV("h4", {
-          className: "mb-1 font-mono text-[11px] tracking-wide text-muted-foreground uppercase",
-          children: t("By function")
-        }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
-          className: "overflow-hidden rounded-lg border border-border",
-          "data-testid": "logs-summary-paths",
-          role: "grid",
-          children: summary.byPath.map((bucket_0) => /* @__PURE__ */ jsxDEV(SummaryBucketRow, {
-            bucket: bucket_0
-          }, bucket_0.key, false))
-        }, void 0, false)]
-      }, void 0, true)]
-    }, void 0, true), readout === "list" && /* @__PURE__ */ jsxDEV("div", {
-      className: "rounded-xl border border-border shadow-xs",
-      "data-testid": "lg-scroll",
-      ref: scrollRef,
-      style: SCROLL_STYLE,
-      children: /* @__PURE__ */ jsxDEV("div", {
-        "aria-label": t("Recent logs"),
-        "data-testid": "lg-table",
-        role: "grid",
-        style: gridStyle,
-        children: virtualRows.map((virtualRow) => view === "requests" ? /* @__PURE__ */ jsxDEV(RequestRow, {
-          entry: requests[virtualRow.index],
-          index: virtualRow.index,
-          measureRef: virtualizer.measureElement,
-          start: virtualRow.start
-        }, virtualRow.key, false) : /* @__PURE__ */ jsxDEV(LogRow, {
-          entry: filtered[virtualRow.index],
-          index: virtualRow.index,
-          measureRef: virtualizer.measureElement,
-          start: virtualRow.start
-        }, virtualRow.key, false))
-      }, void 0, false)
-    }, void 0, false)]
+          style: gridStyle,
+          children: virtualRows.map((virtualRow) => view === "requests" ? /* @__PURE__ */ jsxDEV(RequestRow, {
+            entry: requests[virtualRow.index],
+            index: virtualRow.index,
+            measureRef: virtualizer.measureElement,
+            start: virtualRow.start
+          }, virtualRow.key, false) : /* @__PURE__ */ jsxDEV(LogRow, {
+            entry: filtered[virtualRow.index],
+            index: virtualRow.index,
+            measureRef: virtualizer.measureElement,
+            start: virtualRow.start
+          }, virtualRow.key, false))
+        }, void 0, false)
+      }, void 0, false)]
+    }, void 0, true)]
   }, void 0, true);
 };