@64mb/freelens-power 2.0.0 → 2.1.0

package/out/renderer/power-logs.js

@@ -11,15 +11,18 @@ const require_diagnostic_explain_button = require("./diagnostic-explain-button.j
 const require_power_log_field_filters = require("./src/common/power-log-field-filters.js");
 const require_power_log_json_filter_sql = require("./src/common/power-log-json-filter-sql.js");
 const require_power_log_json_preset = require("./src/common/power-log-json-preset.js");
+const require_power_log_sql_level = require("./src/common/power-log-sql-level.js");
 const require_power_logs_ai = require("./src/common/power-logs-ai.js");
 const require_power_log_json_fields = require("./power-log-json-fields.js");
 const require_power_log_json = require("./power-log-json.js");
 const require_power_log_message = require("./power-log-message.js");
 const require_power_log_json_cell = require("./power-log-json-cell.js");
+const require_power_log_sql_editor = require("./power-log-sql-editor.js");
 const require_power_logs_css = require("./power-logs.css.js");
 const require_power_logs_client = require("./power-logs-client.js");
 const require_power_logs_collector = require("./power-logs-collector.js");
 const require_power_logs_entrypoints = require("./power-logs-entrypoints.js");
+const require_power_logs_sql_drafts = require("./power-logs-sql-drafts.js");
 const require_power_logs_sql_row = require("./power-logs-sql-row.js");
 const require_resource_search_client = require("./resource-search-client.js");
 const require_power_logs_transport = require("./power-logs-transport.js");
@@ -44,7 +47,7 @@ var levels = [
 var examples = [
 	["Recent", "SELECT message, level, container, pod, timestamp FROM logs ORDER BY timestamp DESC NULLS LAST LIMIT 200"],
 	["Errors", "SELECT pod, container, count(*) AS errors FROM logs WHERE level IN ('error','fatal') GROUP BY pod, container ORDER BY errors DESC"],
-	["Timeline", "SELECT strftime('%Y-%m-%d %H:%M', timestamp / 1000, 'unixepoch') AS minute, level, count(*) AS lines FROM logs GROUP BY minute, level ORDER BY minute"],
+	["Timeline", "SELECT strftime('%Y-%m-%d %H:%M', timestamp / 1000, 'unixepoch') AS minute, UPPER(level) AS level, count(*) AS lines FROM logs GROUP BY minute, level ORDER BY minute"],
 	["JSON", "SELECT fieldsJson FROM logs WHERE fieldsJson IS NOT NULL LIMIT 100"]
 ];
 var sqlColumnWidth = (column) => column === "message" || column === "fieldsJson" ? 360 : column === "level" ? 90 : 200;
@@ -133,7 +136,10 @@ var SourcePicker = require__global_external_mobx_react.observer(() => {
 	return /* @__PURE__ */ require_jsx_runtime.jsxs("div", {
 		className: "power-logs-source",
 		children: [
-			/* @__PURE__ */ require_jsx_runtime.jsx("span", { children: "Resource" }),
+			/* @__PURE__ */ require_jsx_runtime.jsx("span", {
+				className: "power-logs-control-label",
+				children: "Resource"
+			}),
 			/* @__PURE__ */ require_jsx_runtime.jsx(LogSelect, {
 				label: "Resource",
 				value,
@@ -182,6 +188,7 @@ function LogRows({ records, loading, selected, onSelect, follow, setFollow, comp
 		follow,
 		compact
 	]);
+	const levelCharacters = require__global_external_react.useMemo(() => records.reduce((width, record) => Math.max(width, record.level.length), 4), [records]);
 	const rowHeight = compact ? 20 : 34;
 	const start = Math.max(0, Math.floor(top / rowHeight) - 5);
 	const visible = records.slice(start, start + Math.ceil(height / rowHeight) + 10);
@@ -190,6 +197,7 @@ function LogRows({ records, loading, selected, onSelect, follow, setFollow, comp
 		children: /* @__PURE__ */ require_jsx_runtime.jsx("div", {
 			className: "power-logs-stream",
 			ref: viewport,
+			style: { "--power-log-level-ch": levelCharacters },
 			"aria-label": "Log lines",
 			"aria-busy": loading,
 			onScroll: (event) => {
@@ -226,12 +234,14 @@ function LogRows({ records, loading, selected, onSelect, follow, setFollow, comp
 						}),
 						/* @__PURE__ */ require_jsx_runtime.jsxs("span", {
 							className: "power-log-origin",
-							title: sourceKey(record),
+							id: `power-log-source-${record.key}`,
 							children: [
-								record.container,
+								record.pod,
 								record.previous ? " (previous)" : "",
-								" · ",
-								record.pod
+								/* @__PURE__ */ require_jsx_runtime.jsx(require_extensions.Renderer.Component.Tooltip, {
+									targetId: `power-log-source-${record.key}`,
+									children: sourceKey(record)
+								})
 							]
 						}),
 						/* @__PURE__ */ require_jsx_runtime.jsx(require_power_log_message.LogMessage, { text: record.message })
@@ -265,7 +275,7 @@ function LogDetails({ record, jsonColumn, onClose, onFilter }) {
 			})] }),
 			/* @__PURE__ */ require_jsx_runtime.jsx("p", {
 				className: "power-logs-muted",
-				children: [record.pod && sourceKey(record), record.level].filter(Boolean).join(" · ")
+				children: [record.pod && sourceKey(record), record.level.toUpperCase()].filter(Boolean).join(" · ")
 			}),
 			record.message && /* @__PURE__ */ require_jsx_runtime.jsx("pre", { children: /* @__PURE__ */ require_jsx_runtime.jsx(require_power_log_message.LogMessage, { text: record.message }) }),
 			record.fieldsJson && /* @__PURE__ */ require_jsx_runtime.jsxs(require_jsx_runtime.Fragment, { children: [/* @__PURE__ */ require_jsx_runtime.jsxs("div", {
@@ -336,12 +346,17 @@ function Workspace({ clusterId, contextId }) {
 		clusterId,
 		contextId
 	}), [clusterId, contextId]);
+	const drafts = require__global_external_react.useMemo(() => new require_power_logs_sql_drafts.CaptureSqlDrafts((id, query) => client.saveSql(id, query), () => setError("Could not save the SQL draft. Your edits remain available in this workspace.")), [client]);
+	require__global_external_react.useEffect(() => () => {
+		drafts.dispose();
+	}, [drafts]);
 	const [target, setTarget] = require__global_external_react.useState(initialTarget);
 	const [records, setRecords] = require__global_external_react.useState([]);
 	const [sources, setSources] = require__global_external_react.useState([]);
 	const [notes, setNotes] = require__global_external_react.useState([]);
 	const [status, setStatus] = require__global_external_react.useState("Choose a resource to read its logs");
 	const [error, setError] = require__global_external_react.useState("");
+	const [sqlError, setSqlError] = require__global_external_react.useState("");
 	const [tab, setTab] = require__global_external_react.useState("live");
 	const [text, setText] = require__global_external_react.useState("");
 	const [level, setLevel] = require__global_external_react.useState("");
@@ -356,6 +371,7 @@ function Workspace({ clusterId, contextId }) {
 		require_power_logs_limits.applyPowerLogsLimits(preferences.limits);
 	}, [preferences.limits]);
 	const [compact, setCompact] = require__global_external_react.useState(preferences.compactRows === true);
+	const [hideResourceName, setHideResourceName] = require__global_external_react.useState(preferences.hideResourceNameColumn === true);
 	const [selected, setSelected] = require__global_external_react.useState();
 	const [selectedSqlRow, setSelectedSqlRow] = require__global_external_react.useState();
 	const [liveCoverage, setLiveCoverage] = require__global_external_react.useState();
@@ -366,8 +382,12 @@ function Workspace({ clusterId, contextId }) {
 	const [captureId, updateCaptureId] = require__global_external_react.useState("");
 	const captureSelection = require__global_external_react.useRef(captureId);
 	captureSelection.current = captureId;
-	const setCaptureId = (id) => {
+	const setCaptureId = (id, snapshot = captures.find((item) => item.id === id)) => {
+		if (id !== captureSelection.current) drafts.flush();
 		captureSelection.current = id;
+		const query = snapshot ? drafts.read(snapshot, examples[0][1]) : examples[0][1];
+		sqlDraft.current = query;
+		updateSql(query);
 		updateCaptureId(id);
 	};
 	const deleting = require__global_external_react.useRef(/* @__PURE__ */ new Set());
@@ -382,6 +402,7 @@ function Workspace({ clusterId, contextId }) {
 	const setSql = (query) => {
 		sqlDraft.current = query;
 		updateSql(query);
+		if (captureSelection.current) drafts.set(captureSelection.current, query);
 	};
 	const captureKeys = require__global_external_react.useRef(/* @__PURE__ */ new Map());
 	require__global_external_react.useEffect(() => {
@@ -662,7 +683,7 @@ function Workspace({ clusterId, contextId }) {
 			if (current) try {
 				const saved = await client.finish(current.id, partial || controller.signal.aborted, [...new Set(captureNotes)].slice(0, 20));
 				if (alive.current) {
-					setCaptureId(saved.id);
+					setCaptureId(saved.id, saved);
 					setCaptures((items) => [saved, ...items.filter((item) => item.id !== saved.id)]);
 					setTab("captures");
 					setSql(examples[0][1]);
@@ -690,6 +711,7 @@ function Workspace({ clusterId, contextId }) {
 		setError("");
 		setResult(void 0);
 		setSelectedSqlRow(void 0);
+		setSqlError("");
 		setResultEvidence({
 			capture: captured,
 			sql: query
@@ -697,10 +719,24 @@ function Workspace({ clusterId, contextId }) {
 		setResultPage(0);
 		try {
 			const value = await client.query(captured.id, id, query);
-			if (alive.current && queryRef.current === id) if (value.error) setError(value.error);
-			else setResult(value);
+			if (alive.current && queryRef.current === id) if (value.error) {
+				setSqlError(value.error);
+				setResultEvidence({
+					capture: captured,
+					sql: query,
+					error: value.error
+				});
+			} else setResult(value);
 		} catch {
-			if (alive.current && queryRef.current === id) setError("Query stopped or failed. Use one read-only SELECT or EXPLAIN; external files, networking and extensions are disabled.");
+			if (alive.current && queryRef.current === id) {
+				const message = "Query stopped or failed. Use one read-only SELECT or EXPLAIN; external files, networking and extensions are disabled.";
+				setSqlError(message);
+				setResultEvidence({
+					capture: captured,
+					sql: query,
+					error: message
+				});
+			}
 		} finally {
 			if (queryRef.current === id) {
 				if (alive.current) setQueryId("");
@@ -710,12 +746,20 @@ function Workspace({ clusterId, contextId }) {
 	};
 	const applyPreset = async (title, selectedCapture, execute = false) => {
 		const captured = selectedCapture ?? captures.find((item) => item.id === captureId);
+		if (queryRef.current || !selectedCapture && captureController.current) return;
+		if (title === "Recent") {
+			const query = examples[0][1];
+			setSql(query);
+			setSelectedSqlRow(void 0);
+			if (execute && captured) runQuery(captured, query);
+			return;
+		}
 		if (queryRef.current || !selectedCapture && captureController.current || !captured || captured.state === "collecting" || deleting.current.has(captured.id)) return;
 		const draft = execute ? examples[0][1] : sqlDraft.current;
 		const id = (0, node_crypto.randomUUID)();
 		queryRef.current = id;
 		setQueryId(id);
-		setError("");
+		setSqlError("");
 		let prepared;
 		try {
 			let keys = captureKeys.current.get(captured.id);
@@ -729,14 +773,14 @@ function Workspace({ clusterId, contextId }) {
 			}
 			if (!alive.current || queryRef.current !== id || captureSelection.current !== captured.id) return;
 			if (sqlDraft.current !== draft) {
-				setError("SQL draft changed while detecting JSON fields. Select the preset again to replace it.");
+				setSqlError("SQL draft changed while detecting JSON fields. Select the preset again to replace it.");
 				return;
 			}
-			prepared = require_power_log_json_preset.buildJsonProjectionSql(keys, { recent: title === "Recent" });
+			prepared = require_power_log_json_preset.buildJsonProjectionSql(keys);
 			setSql(prepared);
 			setSelectedSqlRow(void 0);
 		} catch {
-			if (alive.current) setError("Could not detect JSON fields for this snapshot. Try the preset again.");
+			if (alive.current) setSqlError("Could not detect JSON fields for this snapshot. Try the preset again.");
 		} finally {
 			if (queryRef.current === id) {
 				queryRef.current = "";
@@ -762,7 +806,7 @@ function Workspace({ clusterId, contextId }) {
 	const applySqlFilters = (filters) => {
 		if (queryRef.current || captureController.current || sqlFilteringDisabled) return;
 		if (!resultEvidence || resultEvidence.sql !== sql) {
-			setError("Run the edited SQL query before filtering its results");
+			setSqlError("Run the edited SQL query before filtering its results");
 			return;
 		}
 		try {
@@ -777,19 +821,19 @@ function Workspace({ clusterId, contextId }) {
 			setSql(query);
 			runQuery(void 0, query);
 		} catch {
-			setError("This JSON filter cannot be added to the query. Check the field path and value size.");
+			setSqlError("This JSON filter cannot be added to the query. Check the field path and value size.");
 		}
 	};
 	const addSqlFilter = (column, filter) => {
 		const columnNames = result?.columns.map((name) => name.replace(/[A-Z]/g, (letter) => letter.toLowerCase())) ?? [];
 		if (!result?.columns.includes(column) || new Set(columnNames).size !== columnNames.length) {
-			setError("JSON filters require unique result column names, ignoring case");
+			setSqlError("JSON filters require unique result column names, ignoring case");
 			return;
 		}
 		const filters = activeSqlFilters?.filters ?? [];
 		if (filters.some((current) => current.column === column && sameFieldFilter(current, filter))) return;
 		if (filters.length >= 32) {
-			setError("Up to 32 JSON filters can be combined");
+			setSqlError("Up to 32 JSON filters can be combined");
 			return;
 		}
 		applySqlFilters([...filters, {
@@ -831,12 +875,12 @@ function Workspace({ clusterId, contextId }) {
 			const sql = event.detail?.sql;
 			if (typeof sql !== "string" || !sql.trim() || sql.length > 65536) return;
 			setTab("captures");
-			setSql(sql);
 			setSelectedSqlRow(void 0);
 			if (!captureId) {
 				const latest = captures.find((item) => item.state !== "collecting" && item.target.uid === target?.uid);
 				if (latest) setCaptureId(latest.id);
 			}
+			setSql(sql);
 			requestAnimationFrame(() => document.getElementById("power-logs-sql")?.focus());
 		};
 		window.addEventListener("power-logs-sql-draft", insert);
@@ -847,12 +891,19 @@ function Workspace({ clusterId, contextId }) {
 		target?.uid
 	]);
 	const attachAi = () => {
-		const resource = tab === "captures" ? result && resultEvidence ? resultEvidence.capture.target : chosenCapture?.target ?? target : target;
-		const summary = tab === "captures" && result && resultEvidence ? require_power_logs_ai.powerLogQueryEvidence(resultEvidence.capture, resultEvidence.sql, selectedSqlRow ? {
-			...result,
+		const queryEvidence = result ?? (resultEvidence?.error ? {
+			columns: [],
+			rows: [],
+			truncated: false,
+			elapsedMs: 0,
+			error: resultEvidence.error
+		} : void 0);
+		const resource = tab === "captures" ? queryEvidence && resultEvidence ? resultEvidence.capture.target : chosenCapture?.target ?? target : target;
+		const summary = tab === "captures" && queryEvidence && resultEvidence ? require_power_logs_ai.powerLogQueryEvidence(resultEvidence.capture, resultEvidence.sql, selectedSqlRow ? {
+			...queryEvidence,
 			rows: [selectedSqlRow.row],
 			truncated: false
-		} : result) : tab === "live" && selected ? require_power_logs_ai.powerLogLineEvidence(resource, selected) : JSON.stringify({
+		} : queryEvidence) : tab === "live" && selected ? require_power_logs_ai.powerLogLineEvidence(resource, selected) : JSON.stringify({
 			target: resource,
 			...tab === "captures" ? {
 				sql,
@@ -865,6 +916,7 @@ function Workspace({ clusterId, contextId }) {
 		});
 		if (!require_ai_diagnostic_handoff.explainDiagnosticFinding({
 			clusterId,
+			source: "logs",
 			title: tab === "captures" ? selectedSqlRow ? "SQL row" : "SQL query" : selected ? "Log line" : "Power Logs",
 			summary: summary.slice(0, 6e3),
 			...resource ? { resource: {
@@ -879,7 +931,9 @@ function Workspace({ clusterId, contextId }) {
 		deleting.current.add(id);
 		setDeletingCount(deleting.current.size);
 		try {
+			await drafts.flush();
 			await client.delete(id);
+			drafts.forget(id);
 			if (id === captureSelection.current) {
 				setCaptureId("");
 				setResult(void 0);
@@ -910,6 +964,7 @@ function Workspace({ clusterId, contextId }) {
 		className: "power-logs",
 		"data-testid": "power-logs-page",
 		"data-compact": compact || void 0,
+		"data-hide-resource-name": hideResourceName || void 0,
 		children: [
 			/* @__PURE__ */ require_jsx_runtime.jsx("style", { children: require_power_logs_css.powerLogsStyles }),
 			/* @__PURE__ */ require_jsx_runtime.jsxs("header", { children: [
@@ -950,11 +1005,7 @@ function Workspace({ clusterId, contextId }) {
 						onClick: () => {
 							setTab("captures");
 							const latest = captures.find((item) => item.state !== "collecting" && (!target || item.target.uid === target.uid));
-							if (!captureId && latest && !capturePending) {
-								setCaptureId(latest.id);
-								setSql(examples[0][1]);
-								applyPreset("Recent", latest, true);
-							}
+							if (!captureId && latest && !capturePending) setCaptureId(latest.id);
 							refreshCaptures();
 						},
 						children: [/* @__PURE__ */ require_jsx_runtime.jsx(Icon, {
@@ -1011,6 +1062,14 @@ function Workspace({ clusterId, contextId }) {
 												preferences.compactRows = value;
 											},
 											children: "Compact density"
+										}),
+										/* @__PURE__ */ require_jsx_runtime.jsx(require_extensions.Renderer.Component.Switch, {
+											checked: hideResourceName,
+											onChange: (value) => {
+												setHideResourceName(value);
+												preferences.hideResourceNameColumn = value;
+											},
+											children: "Hide resource name column"
 										})
 									] })]
 								}),
@@ -1232,91 +1291,94 @@ function Workspace({ clusterId, contextId }) {
 			] }) : /* @__PURE__ */ require_jsx_runtime.jsxs(require_jsx_runtime.Fragment, { children: [
 				/* @__PURE__ */ require_jsx_runtime.jsxs("div", {
 					className: "power-logs-toolbar power-logs-snapshot-bar",
-					children: [/* @__PURE__ */ require_jsx_runtime.jsx(LogSelect, {
-						label: "Capture snapshot",
-						onKeyDown: (event) => {
-							if (event.key !== "Delete" || !event.altKey || (event.target.value ?? "").length > 0) return;
-							const button = document.querySelector(".Select__menu .Select__option--is-focused [data-capture-delete]");
-							if (button && !button.disabled) {
-								event.preventDefault();
-								event.stopPropagation();
-								deleteCapture(button.dataset.captureDelete);
-							}
-						},
-						renderOption: (option, context) => {
-							const item = captures.find((item) => item.id === option.value);
-							if (context !== "menu" || !item) return option.label;
-							return /* @__PURE__ */ require_jsx_runtime.jsxs("span", {
-								className: "power-logs-snapshot-option",
-								title: option.label,
-								children: [/* @__PURE__ */ require_jsx_runtime.jsxs("span", {
-									className: "power-logs-option-text",
-									children: [/* @__PURE__ */ require_jsx_runtime.jsx("strong", { children: item.target.name }), /* @__PURE__ */ require_jsx_runtime.jsxs("small", { children: [
-										require_date_time.formatDateTime(item.createdAt),
-										" · ",
-										item.rows.toLocaleString(),
-										" lines ·",
-										" ",
-										item.state[0].toUpperCase(),
-										item.state.slice(1)
-									] })]
-								}), /* @__PURE__ */ require_jsx_runtime.jsx("button", {
-									type: "button",
-									"aria-label": `Delete snapshot ${item.target.name}`,
-									title: "Delete snapshot (Alt+Delete)",
-									"data-capture-delete": item.id,
-									onKeyDown: (event) => event.stopPropagation(),
-									disabled: !!queryId || capturePending || deletingCount > 0 || item.state === "collecting",
-									onMouseDown: (event) => {
-										event.preventDefault();
-										event.stopPropagation();
-									},
-									onClick: (event) => {
-										event.preventDefault();
-										event.stopPropagation();
-										deleteCapture(item.id);
-									},
-									children: /* @__PURE__ */ require_jsx_runtime.jsx(require_extensions.Renderer.Component.Icon, {
-										material: "delete_outline",
-										size: 16,
-										tooltip: "Delete snapshot",
-										tooltipOverrideDisabled: true
-									})
-								})]
-							});
-						},
-						value: captureId,
-						disabled: !!queryId || capturePending || deletingCount > 0,
-						onChange: (value) => {
-							setCaptureId(value);
-							setResult(void 0);
-							setResultEvidence(void 0);
-							setSelectedSqlRow(void 0);
-							const snapshot = captures.find((item) => item.id === value);
-							if (snapshot) {
-								setSql(examples[0][1]);
-								applyPreset("Recent", snapshot, true);
-							}
-						},
-						options: [{
-							value: "",
-							label: "Choose a snapshot"
-						}, ...captures.map((item) => ({
-							value: item.id,
-							label: `${item.target.name} · ${require_date_time.formatDateTime(item.createdAt)} · ${item.rows.toLocaleString()} lines · ${item.state[0].toUpperCase()}${item.state.slice(1)}`
-						}))]
-					}), /* @__PURE__ */ require_jsx_runtime.jsxs("button", {
-						type: "button",
-						disabled: !captureId || !!queryId || deleting.current.has(captureId),
-						title: "Export JSON Lines (NDJSON)",
-						onClick: () => {
-							client.export(captureId).catch(() => setError("Could not export capture"));
-						},
-						children: [/* @__PURE__ */ require_jsx_runtime.jsx(Icon, {
-							material: "download",
-							size: 16
-						}), " Export JSON"]
-					})]
+					children: [
+						/* @__PURE__ */ require_jsx_runtime.jsx("span", {
+							className: "power-logs-control-label",
+							children: "Snapshot"
+						}),
+						/* @__PURE__ */ require_jsx_runtime.jsx(LogSelect, {
+							label: "Capture snapshot",
+							onKeyDown: (event) => {
+								if (event.key !== "Delete" || !event.altKey || (event.target.value ?? "").length > 0) return;
+								const button = document.querySelector(".Select__menu .Select__option--is-focused [data-capture-delete]");
+								if (button && !button.disabled) {
+									event.preventDefault();
+									event.stopPropagation();
+									deleteCapture(button.dataset.captureDelete);
+								}
+							},
+							renderOption: (option, context) => {
+								const item = captures.find((item) => item.id === option.value);
+								if (context !== "menu" || !item) return option.label;
+								return /* @__PURE__ */ require_jsx_runtime.jsxs("span", {
+									className: "power-logs-snapshot-option",
+									title: option.label,
+									children: [/* @__PURE__ */ require_jsx_runtime.jsxs("span", {
+										className: "power-logs-option-text",
+										children: [/* @__PURE__ */ require_jsx_runtime.jsx("strong", { children: item.target.name }), /* @__PURE__ */ require_jsx_runtime.jsxs("small", { children: [
+											require_date_time.formatDateTime(item.createdAt),
+											" · ",
+											item.rows.toLocaleString(),
+											" lines ·",
+											" ",
+											item.state[0].toUpperCase(),
+											item.state.slice(1)
+										] })]
+									}), /* @__PURE__ */ require_jsx_runtime.jsx("button", {
+										type: "button",
+										"aria-label": `Delete snapshot ${item.target.name}`,
+										title: "Delete snapshot (Alt+Delete)",
+										"data-capture-delete": item.id,
+										onKeyDown: (event) => event.stopPropagation(),
+										disabled: !!queryId || capturePending || deletingCount > 0 || item.state === "collecting",
+										onMouseDown: (event) => {
+											event.preventDefault();
+											event.stopPropagation();
+										},
+										onClick: (event) => {
+											event.preventDefault();
+											event.stopPropagation();
+											deleteCapture(item.id);
+										},
+										children: /* @__PURE__ */ require_jsx_runtime.jsx(require_extensions.Renderer.Component.Icon, {
+											material: "delete_outline",
+											size: 16,
+											tooltip: "Delete snapshot",
+											tooltipOverrideDisabled: true
+										})
+									})]
+								});
+							},
+							value: captureId,
+							disabled: !!queryId || capturePending || deletingCount > 0,
+							onChange: (value) => {
+								setCaptureId(value);
+								setResult(void 0);
+								setResultEvidence(void 0);
+								setSelectedSqlRow(void 0);
+								setSqlError("");
+							},
+							options: [{
+								value: "",
+								label: "Choose a snapshot"
+							}, ...captures.map((item) => ({
+								value: item.id,
+								label: `${item.target.name} · ${require_date_time.formatDateTime(item.createdAt)} · ${item.rows.toLocaleString()} lines · ${item.state[0].toUpperCase()}${item.state.slice(1)}`
+							}))]
+						}),
+						/* @__PURE__ */ require_jsx_runtime.jsxs("button", {
+							type: "button",
+							disabled: !captureId || !!queryId || deleting.current.has(captureId),
+							title: "Export JSON Lines (NDJSON)",
+							onClick: () => {
+								client.export(captureId).catch(() => setError("Could not export capture"));
+							},
+							children: [/* @__PURE__ */ require_jsx_runtime.jsx(Icon, {
+								material: "download",
+								size: 16
+							}), " Export JSON"]
+						})
+					]
 				}),
 				!!chosenCapture?.notes.length && /* @__PURE__ */ require_jsx_runtime.jsxs("details", {
 					className: "power-logs-snapshot-notes power-logs-muted",
@@ -1331,6 +1393,7 @@ function Workspace({ clusterId, contextId }) {
 					children: [
 						/* @__PURE__ */ require_jsx_runtime.jsx("label", {
 							htmlFor: "power-logs-sql",
+							className: "power-logs-control-label",
 							title: `Read-only SELECT · ${limits.queryMs / 1e3} s · ${limits.resultRows.toLocaleString()} rows · Schema: logs(timestamp INTEGER in milliseconds, pod, podUid, container, level, message, fieldsJson, previous INTEGER 0 or 1)`,
 							children: "SQL query"
 						}),
@@ -1363,7 +1426,7 @@ function Workspace({ clusterId, contextId }) {
 									size: 16
 								}),
 								" ",
-								"SQL: ",
+								"SQL · ",
 								title
 							]
 						}, title))
@@ -1375,30 +1438,15 @@ function Workspace({ clusterId, contextId }) {
 					disabled: sqlFilteringDisabled,
 					onRemove: (index) => applySqlFilters((activeSqlFilters?.filters ?? []).filter((_, item) => item !== index))
 				}),
-				/* @__PURE__ */ require_jsx_runtime.jsx("textarea", {
-					rows: 2,
+				/* @__PURE__ */ require_jsx_runtime.jsx(require_power_log_sql_editor.SqlEditor, {
 					id: "power-logs-sql",
 					value: sql,
-					maxLength: 65536,
-					onChange: (event) => setSql(event.target.value),
-					spellCheck: false,
-					onClick: (event) => {
-						event.stopPropagation();
-						if (event.detail >= 3) {
-							event.preventDefault();
-							window.getSelection()?.removeAllRanges();
-							event.currentTarget.select();
-						}
-					},
-					onMouseDown: (event) => {
-						event.stopPropagation();
-						if (event.detail >= 3) {
-							event.preventDefault();
-							window.getSelection()?.removeAllRanges();
-							event.currentTarget.focus();
-							event.currentTarget.select();
-						}
-					}
+					onChange: setSql
+				}),
+				sqlError && /* @__PURE__ */ require_jsx_runtime.jsx("div", {
+					role: "alert",
+					className: "power-logs-notice power-logs-error power-logs-query-error",
+					children: sqlError
 				}),
 				result ? /* @__PURE__ */ require_jsx_runtime.jsxs(require_jsx_runtime.Fragment, { children: [
 					/* @__PURE__ */ require_jsx_runtime.jsx("div", {
@@ -1445,10 +1493,11 @@ function Workspace({ clusterId, contextId }) {
 										},
 										children: row.map((cell, j) => /* @__PURE__ */ require_jsx_runtime.jsx("td", {
 											"data-column": result.columns[j],
-											"data-level": result.columns[j] === "level" ? String(cell) : void 0,
+											"data-level": require_power_log_sql_level.sqlCellLevel(result.columns[j], cell),
 											children: /* @__PURE__ */ require_jsx_runtime.jsx(require_power_log_json_cell.LogJsonCell, {
 												value: cell === null ? null : String(cell),
-												message: result.columns[j] === "message",
+												column: result.columns[j],
+												rawValue: cell,
 												Icon,
 												onFilter: sqlFilteringDisabled ? void 0 : (filter) => addSqlFilter(result.columns[j], filter)
 											})
@@ -1457,7 +1506,7 @@ function Workspace({ clusterId, contextId }) {
 								]
 							}), result.rows.length === 0 && /* @__PURE__ */ require_jsx_runtime.jsx("div", {
 								className: "power-logs-empty",
-								children: chosenCapture?.rows === 0 ? "This snapshot contains no log lines. Try a longer capture window." : "This query returned no rows. Adjust the query or choose SQL: Recent."
+								children: chosenCapture?.rows === 0 ? "This snapshot contains no log lines. Try a longer capture window." : "This query returned no rows. Adjust the query or choose SQL · Recent."
 							})]
 						}), selectedSqlRow && /* @__PURE__ */ require_jsx_runtime.jsx(LogDetails, {
 							record: selectedSqlRow.record,