@64mb/freelens-power 1.6.1 → 2.1.0

package/out/renderer/power-logs.js

@@ -8,12 +8,21 @@ const require_jsx_runtime = require("./_virtual/_global-external_react/jsx-runti
 const require_ai_diagnostic_handoff = require("./ai-diagnostic-handoff.js");
 const require_date_time = require("./src/common/date-time.js");
 const require_diagnostic_explain_button = require("./diagnostic-explain-button.js");
+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");
@@ -38,8 +47,8 @@ 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"],
-	["JSON", "SELECT pod, json_extract(fieldsJson, '$.message') AS message FROM logs WHERE fieldsJson IS NOT NULL LIMIT 100"]
+	["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;
 function initialTarget() {
@@ -127,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,
@@ -176,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);
@@ -184,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) => {
@@ -220,30 +234,29 @@ 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("span", { children: record.message })
+						/* @__PURE__ */ require_jsx_runtime.jsx(require_power_log_message.LogMessage, { text: record.message })
 					]
 				}, record.key))
 			})
 		})
 	});
 }
-function LogDetails({ record, jsonColumn, onClose }) {
+function LogDetails({ record, jsonColumn, onClose, onFilter }) {
 	const structuredFields = require__global_external_react.useMemo(() => {
 		if (!record?.fieldsJson) return "";
-		try {
-			return JSON.stringify(JSON.parse(record.fieldsJson), null, 2);
-		} catch {
-			return record.fieldsJson;
-		}
+		return require_power_log_json_fields.formatJsonLiteral(record.fieldsJson);
 	}, [record?.fieldsJson]);
+	const fieldsEnabled = require__global_external_react.useMemo(() => !require_power_log_json_fields.jsonHasDuplicateKeys(record.fieldsJson ?? ""), [record.fieldsJson]);
 	const [copyFeedback, setCopyFeedback] = require__global_external_react.useState("");
 	require__global_external_react.useEffect(() => setCopyFeedback(""), [structuredFields]);
 	return /* @__PURE__ */ require_jsx_runtime.jsxs("aside", {
@@ -262,9 +275,9 @@ function LogDetails({ record, jsonColumn, onClose }) {
 			})] }),
 			/* @__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: record.message }),
+			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", {
 				className: "power-logs-structured-heading",
 				children: [
@@ -293,31 +306,72 @@ function LogDetails({ record, jsonColumn, onClose }) {
 						children: copyFeedback
 					})
 				]
-			}), /* @__PURE__ */ require_jsx_runtime.jsx(require_power_log_json.LogJson, { text: structuredFields })] })
+			}), /* @__PURE__ */ require_jsx_runtime.jsx(require_power_log_json.LogJson, {
+				text: structuredFields,
+				fieldsEnabled,
+				Icon,
+				onFilter
+			})] })
 		]
 	});
 }
+var sameFieldFilter = (a, b) => a.operator === b.operator && a.path.length === b.path.length && a.path.every((part, index) => part === b.path[index]) && require_power_log_field_filters.jsonValuesEqual(a.value, b.value);
+var fieldFilterLabel = (filter) => `${filter.path.reduce((path, part) => `${path}[${typeof part === "number" ? part : JSON.stringify(part)}]`, "$")} ${filter.operator === "eq" ? "=" : "!="} ${JSON.stringify(filter.value)}`;
+function FieldFilters({ filters, sql = false, disabled = false, onRemove }) {
+	if (!filters.length) return null;
+	return /* @__PURE__ */ require_jsx_runtime.jsxs("div", {
+		className: "power-logs-field-filters",
+		"aria-label": sql ? "SQL JSON filters" : "Live JSON filters",
+		children: [/* @__PURE__ */ require_jsx_runtime.jsxs("span", {
+			className: "power-logs-muted",
+			children: [sql ? "Result filters" : "JSON filters", " · AND"]
+		}), filters.map((filter, index) => {
+			const label = `${filter.column ? `${filter.column} ` : ""}${fieldFilterLabel(filter)}`;
+			return /* @__PURE__ */ require_jsx_runtime.jsxs("button", {
+				type: "button",
+				disabled,
+				title: label,
+				"aria-label": `Remove JSON filter ${label}`,
+				onClick: () => onRemove(index),
+				children: [/* @__PURE__ */ require_jsx_runtime.jsx("span", { children: label }), /* @__PURE__ */ require_jsx_runtime.jsx(Icon, {
+					material: "close",
+					size: 14
+				})]
+			}, index);
+		})]
+	});
+}
 function Workspace({ clusterId, contextId }) {
 	const client = require__global_external_react.useMemo(() => require_power_logs_client.createPowerLogsClient({
 		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("");
 	const [source, setSource] = require__global_external_react.useState(initialSource);
+	const [fieldFilters, setFieldFilters] = require__global_external_react.useState([]);
+	const matchFields = require__global_external_react.useMemo(() => require_power_log_field_filters.compileJsonFilters(fieldFilters), [fieldFilters]);
+	const parsedFields = require__global_external_react.useRef(/* @__PURE__ */ new WeakMap());
+	const [sqlFieldFilters, setSqlFieldFilters] = require__global_external_react.useState();
 	const preferences = require_logs_preferences_store.LogsPreferencesStore.getInstanceOrCreate();
 	const limits = require_power_logs_limits.normalizePowerLogsLimits(preferences.limits);
 	require__global_external_react.useEffect(() => {
 		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();
@@ -325,16 +379,35 @@ function Workspace({ clusterId, contextId }) {
 	const [follow, setFollow] = require__global_external_react.useState(true);
 	const [busy, setBusy] = require__global_external_react.useState(() => Boolean(initialTarget()));
 	const [captures, setCaptures] = require__global_external_react.useState([]);
-	const [captureId, setCaptureId] = require__global_external_react.useState("");
+	const [captureId, updateCaptureId] = require__global_external_react.useState("");
 	const captureSelection = require__global_external_react.useRef(captureId);
 	captureSelection.current = captureId;
+	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());
 	const [deletingCount, setDeletingCount] = require__global_external_react.useState(0);
 	const [capturing, setCapturing] = require__global_external_react.useState();
 	const [capturePending, setCapturePending] = require__global_external_react.useState(false);
 	const [captureMinutes, setCaptureMinutes] = require__global_external_react.useState(15);
 	const [previous, setPrevious] = require__global_external_react.useState(false);
-	const [sql, setSql] = require__global_external_react.useState(examples[0][1]);
+	const [sql, updateSql] = require__global_external_react.useState(examples[0][1]);
+	const sqlDraft = require__global_external_react.useRef(sql);
+	sqlDraft.current = sql;
+	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(() => {
+		setSqlFieldFilters((current) => current && (current.rendered !== sql || current.captureId !== captureId) ? void 0 : current);
+	}, [sql, captureId]);
 	const [result, setResult] = require__global_external_react.useState();
 	const [resultEvidence, setResultEvidence] = require__global_external_react.useState();
 	const [resultPage, setResultPage] = require__global_external_react.useState(0);
@@ -479,6 +552,7 @@ function Workspace({ clusterId, contextId }) {
 	};
 	require__global_external_react.useEffect(() => {
 		setText("");
+		setFieldFilters([]);
 		setSources([]);
 		setTab("live");
 		readHistory();
@@ -609,11 +683,11 @@ 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]);
-					runQuery(saved, examples[0][1]);
+					applyPreset("Recent", saved, true);
 				}
 			} catch {
 				if (alive.current) setError("The temporary capture could not be finalized");
@@ -637,6 +711,7 @@ function Workspace({ clusterId, contextId }) {
 		setError("");
 		setResult(void 0);
 		setSelectedSqlRow(void 0);
+		setSqlError("");
 		setResultEvidence({
 			capture: captured,
 			sql: query
@@ -644,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("");
@@ -655,11 +744,123 @@ function Workspace({ clusterId, contextId }) {
 			}
 		}
 	};
-	const filtered = require__global_external_react.useMemo(() => records.filter((record) => (!text || record.message.toLocaleLowerCase().includes(text.toLocaleLowerCase())) && (!level || record.level === level) && (!source || (source.startsWith("container:") ? record.container === source.slice(10) : sourceKey(record) === source))), [
+	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);
+		setSqlError("");
+		let prepared;
+		try {
+			let keys = captureKeys.current.get(captured.id);
+			if (!keys) {
+				const schema = await client.query(captured.id, id, require_power_log_json_preset.JSON_KEY_DISCOVERY_SQL);
+				if (schema.error) throw new Error(schema.error);
+				const keyColumn = schema.columns.indexOf("key");
+				keys = schema.truncated ? ["\0"] : keyColumn < 0 ? [] : schema.rows.map((row) => row[keyColumn]).filter((key) => typeof key === "string");
+				captureKeys.current.set(captured.id, keys);
+				if (captureKeys.current.size > 10) captureKeys.current.delete(captureKeys.current.keys().next().value);
+			}
+			if (!alive.current || queryRef.current !== id || captureSelection.current !== captured.id) return;
+			if (sqlDraft.current !== draft) {
+				setSqlError("SQL draft changed while detecting JSON fields. Select the preset again to replace it.");
+				return;
+			}
+			prepared = require_power_log_json_preset.buildJsonProjectionSql(keys);
+			setSql(prepared);
+			setSelectedSqlRow(void 0);
+		} catch {
+			if (alive.current) setSqlError("Could not detect JSON fields for this snapshot. Try the preset again.");
+		} finally {
+			if (queryRef.current === id) {
+				queryRef.current = "";
+				if (alive.current) setQueryId("");
+			}
+		}
+		if (prepared && execute && alive.current) runQuery(captured, prepared);
+	};
+	const addLiveFilter = (filter) => {
+		if (!require_power_log_field_filters.jsonValuesEqual(filter.value, filter.value)) {
+			setError("This JSON value is too large or unsupported for filtering");
+			return;
+		}
+		if (fieldFilters.some((current) => sameFieldFilter(current, filter))) return;
+		if (fieldFilters.length >= 32) {
+			setError("Up to 32 JSON filters can be combined");
+			return;
+		}
+		setFieldFilters([...fieldFilters, filter]);
+	};
+	const activeSqlFilters = sqlFieldFilters?.rendered === sql && sqlFieldFilters.captureId === captureId ? sqlFieldFilters : void 0;
+	const sqlFilteringDisabled = Boolean(queryId || capturePending || deleting.current.has(captureId) || !captures.some((capture) => capture.id === captureId && capture.state !== "collecting"));
+	const applySqlFilters = (filters) => {
+		if (queryRef.current || captureController.current || sqlFilteringDisabled) return;
+		if (!resultEvidence || resultEvidence.sql !== sql) {
+			setSqlError("Run the edited SQL query before filtering its results");
+			return;
+		}
+		try {
+			const base = activeSqlFilters?.base ?? sql;
+			const query = require_power_log_json_filter_sql.buildJsonFilterSql(base, filters);
+			setSqlFieldFilters({
+				base,
+				rendered: query,
+				captureId,
+				filters
+			});
+			setSql(query);
+			runQuery(void 0, query);
+		} catch {
+			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) {
+			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) {
+			setSqlError("Up to 32 JSON filters can be combined");
+			return;
+		}
+		applySqlFilters([...filters, {
+			...filter,
+			column
+		}]);
+	};
+	const matchesRecordFields = (record) => {
+		if (!fieldFilters.length) return true;
+		if (!parsedFields.current.has(record)) {
+			let fields;
+			try {
+				fields = JSON.parse(record.fieldsJson ?? "null");
+			} catch {
+				fields = void 0;
+			}
+			parsedFields.current.set(record, fields);
+		}
+		return matchFields(parsedFields.current.get(record));
+	};
+	const filtered = require__global_external_react.useMemo(() => records.filter((record) => (!text || record.message.toLocaleLowerCase().includes(text.toLocaleLowerCase())) && (!level || record.level === level) && (!source || (source.startsWith("container:") ? record.container === source.slice(10) : sourceKey(record) === source)) && matchesRecordFields(record)), [
 		records,
 		text,
 		level,
-		source
+		source,
+		fieldFilters,
+		matchFields
 	]);
 	const chosenCapture = captures.find((item) => item.id === captureId);
 	const collectionNotes = tab === "live" ? [.../* @__PURE__ */ new Set([...notes, ...live ? liveCoverage?.notes ?? [] : []])] : [];
@@ -674,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);
@@ -690,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,
@@ -708,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: {
@@ -722,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);
@@ -753,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: [
@@ -793,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]);
-								runQuery(latest, examples[0][1]);
-							}
+							if (!captureId && latest && !capturePending) setCaptureId(latest.id);
 							refreshCaptures();
 						},
 						children: [/* @__PURE__ */ require_jsx_runtime.jsx(Icon, {
@@ -854,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"
 										})
 									] })]
 								}),
@@ -1036,6 +1252,10 @@ function Workspace({ clusterId, contextId }) {
 						})
 					]
 				}),
+				/* @__PURE__ */ require_jsx_runtime.jsx(FieldFilters, {
+					filters: fieldFilters,
+					onRemove: (index) => setFieldFilters(fieldFilters.filter((_, item) => item !== index))
+				}),
 				/* @__PURE__ */ require_jsx_runtime.jsxs("div", {
 					className: "power-logs-muted power-logs-status",
 					role: "status",
@@ -1064,97 +1284,101 @@ function Workspace({ clusterId, contextId }) {
 						compact
 					}), selected && /* @__PURE__ */ require_jsx_runtime.jsx(LogDetails, {
 						record: selected,
-						onClose: () => setSelected(void 0)
+						onClose: () => setSelected(void 0),
+						onFilter: addLiveFilter
 					})]
 				})
 			] }) : /* @__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]);
-								runQuery(snapshot, examples[0][1]);
-							}
-						},
-						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",
@@ -1169,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"
 						}),
@@ -1193,26 +1418,35 @@ function Workspace({ clusterId, contextId }) {
 						}),
 						examples.map(([title, query]) => /* @__PURE__ */ require_jsx_runtime.jsxs("button", {
 							type: "button",
-							onClick: () => setSql(query),
+							disabled: !!queryId || capturePending,
+							onClick: () => title === "JSON" || title === "Recent" ? void applyPreset(title) : setSql(query),
 							children: [
 								/* @__PURE__ */ require_jsx_runtime.jsx(Icon, {
 									material: title === "Recent" ? "history" : title === "Errors" ? "error_outline" : title === "Timeline" ? "timeline" : "data_object",
 									size: 16
 								}),
 								" ",
-								"SQL: ",
+								"SQL · ",
 								title
 							]
 						}, title))
 					]
 				}),
-				/* @__PURE__ */ require_jsx_runtime.jsx("textarea", {
-					rows: 2,
+				/* @__PURE__ */ require_jsx_runtime.jsx(FieldFilters, {
+					sql: true,
+					filters: activeSqlFilters?.filters ?? [],
+					disabled: sqlFilteringDisabled,
+					onRemove: (index) => applySqlFilters((activeSqlFilters?.filters ?? []).filter((_, item) => item !== index))
+				}),
+				/* @__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
+					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", {
@@ -1259,22 +1493,25 @@ 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,
-											children: /* @__PURE__ */ require_jsx_runtime.jsx("span", {
-												className: "power-logs-cell",
-												title: cell === null ? "NULL" : String(cell),
-												children: cell === null ? "NULL" : String(cell)
+											"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),
+												column: result.columns[j],
+												rawValue: cell,
+												Icon,
+												onFilter: sqlFilteringDisabled ? void 0 : (filter) => addSqlFilter(result.columns[j], filter)
 											})
 										}, j))
 									}, i)) })
 								]
 							}), 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,
 							jsonColumn: selectedSqlRow.jsonColumn,
+							onFilter: !sqlFilteringDisabled && selectedSqlRow.jsonColumn ? (filter) => addSqlFilter(selectedSqlRow.jsonColumn, filter) : void 0,
 							onClose: () => setSelectedSqlRow(void 0)
 						})]
 					}),