@camstack/ui-library 1.2.304 → 1.2.305

package/dist/composites/log-history-paging.d.ts

@@ -0,0 +1,62 @@
+/**
+* Pure paging logic for the server-served log history (D898).
+*
+* The server answers one TIME-BOUNDED slice per call: `done: false` with fewer
+* than `limit` entries means "the budget ran out, still searching". The client
+* keeps calling with `before: nextBefore` until it holds a full page, the
+* source says `done`, or the operator cancels. Kept free of React and tRPC so
+* the loop is unit-testable.
+*/
+export interface LogWireEntry {
+	readonly id?: string;
+	readonly timestamp: string;
+	readonly level: string;
+	readonly message: string;
+	readonly scope?: string;
+	readonly tags?: Record<string, string | undefined>;
+	readonly meta?: Record<string, unknown>;
+}
+export interface LogWirePage {
+	/** NEWEST FIRST. */
+	readonly entries: readonly LogWireEntry[];
+	readonly nextBefore: string | null;
+	readonly nextAfter: string | null;
+	readonly scannedBytes: number;
+	readonly done: boolean;
+	readonly cancelled?: boolean;
+	readonly source: string;
+}
+/** Fetches one slice older than `before` (undefined = the first page). */
+export type FetchLogSlice = (before: string | undefined, remaining: number, signal: AbortSignal) => Promise<LogWirePage>;
+export interface CollectedPage {
+	/** NEWEST FIRST, across every slice the loop made. */
+	readonly entries: readonly LogWireEntry[];
+	/** Cursor for the next older page; null when nothing older exists. */
+	readonly nextBefore: string | null;
+	readonly done: boolean;
+	readonly cancelled: boolean;
+	readonly scannedBytes: number;
+	readonly source: string | undefined;
+}
+export interface CollectPageOptions {
+	readonly fetchSlice: FetchLogSlice;
+	readonly limit: number;
+	readonly before?: string;
+	readonly signal: AbortSignal;
+	/** Called after every slice with the bytes scanned so far. */
+	readonly onProgress?: (scannedBytes: number) => void;
+}
+/**
+* Accumulate slices until `limit` entries, `done`, or an abort. An abort keeps
+* what was already collected and the cursor reached, so "Load older" resumes
+* where the scan stopped instead of starting again.
+*/
+export declare function collectPage(options: CollectPageOptions): Promise<CollectedPage>;
+/** Stable identity of an entry: the server id, else the legacy composite key. */
+export declare function logEntryKey(entry: LogWireEntry): string;
+/**
+* History (newest first, as paged) merged with live entries (arrival order),
+* deduped by key — a live entry wins (richer tags/meta) — and returned
+* chronologically, newest LAST. Ties keep insertion order.
+*/
+export declare function mergeLogEntries(history: readonly LogWireEntry[], live: readonly LogWireEntry[]): LogWireEntry[];

package/dist/composites/log-stream.d.ts

@@ -10,14 +10,8 @@
 */
 import { type JSX } from "react";
 import { type LiveBuffer } from "../hooks/use-live-buffer";
-interface LogEntry {
-	readonly timestamp: string;
-	readonly level: string;
-	readonly message: string;
-	readonly scope?: string;
-	readonly tags?: Record<string, string | undefined>;
-	readonly meta?: Record<string, unknown>;
-}
+import { type LogWireEntry } from "./log-history-paging";
+type LogEntry = LogWireEntry;
 export interface LogStreamProps {
 	/** Lock to a specific agent. When set, the agent selector is hidden. */
 	readonly agentId?: string;
@@ -65,7 +59,9 @@ export interface LogStreamProps {
 	readonly showDeviceChip?: boolean;
 	/** Show the filter bar with selectors. Set false for compact inline use. */
 	readonly showFilters?: boolean;
-	/** Initial number of historical entries to fetch (default: 100). */
+	/** Show the history source selector (default: follows `showFilters`). */
+	readonly showSourceSelect?: boolean;
+	/** Entries per history page (default: 100). */
 	readonly limit?: number;
 	/**
 	* Optional controlled live buffer. When provided, the stream reads
@@ -79,7 +75,7 @@ export interface LogStreamProps {
 	readonly onClose?: () => void;
 	readonly className?: string;
 }
-export declare function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: propsDeviceId, containerDeviceId: propsContainerDeviceId, integrationId: propsIntegrationId, requestId: propsRequestId, level: initialLevel, maxHeight, showScope, showDeviceChip, showFilters, limit, liveBuffer: externalBuffer, onClose, className }: LogStreamProps): JSX.Element;
+export declare function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: propsDeviceId, containerDeviceId: propsContainerDeviceId, integrationId: propsIntegrationId, requestId: propsRequestId, level: initialLevel, maxHeight, showScope, showDeviceChip, showFilters, showSourceSelect, limit, liveBuffer: externalBuffer, onClose, className }: LogStreamProps): JSX.Element;
 export interface FloatingLogStreamProps extends LogStreamProps {
 	/** Position: 'bottom' anchors to parent bottom, 'overlay' is absolute positioned. */
 	readonly position?: "bottom" | "overlay";

package/dist/generated/system-hooks.d.ts

@@ -487,6 +487,8 @@ export declare const useDeviceHistoryListNodeSeries: typeof trpc.deviceHistory.l
 export declare const useDeviceHistoryQuery: typeof trpc.deviceHistory.query.useQuery;
 /** Generated alias around `trpc.deviceHistory.queryNode.useQuery`. */
 export declare const useDeviceHistoryQueryNode: typeof trpc.deviceHistory.queryNode.useQuery;
+/** Generated alias around `trpc.deviceHistory.queryMany.useQuery`. */
+export declare const useDeviceHistoryQueryMany: typeof trpc.deviceHistory.queryMany.useQuery;
 /** Generated alias around `trpc.deviceHistory.declareSeries.useMutation`. */
 export declare const useDeviceHistoryDeclareSeries: typeof trpc.deviceHistory.declareSeries.useMutation;
 /** Generated alias around `trpc.deviceHistory.record.useMutation`. */

package/dist/hooks/use-log-history.d.ts

@@ -0,0 +1,26 @@
+import { type LogWireEntry } from "../composites/log-history-paging";
+export type LogHistoryLevel = "debug" | "info" | "warn" | "error";
+/** The filters the SERVER applies; everything but paging. */
+export interface LogHistoryQuery {
+	/** A log-destination addonId or `ring`; undefined = the server default. */
+	readonly source?: string;
+	readonly level: LogHistoryLevel;
+	readonly text?: string;
+	readonly tags?: Record<string, string | number>;
+}
+export type LogHistoryStatus = "idle" | "loading";
+export interface LogHistory {
+	/** Newest first, as paged. */
+	readonly entries: readonly LogWireEntry[];
+	readonly status: LogHistoryStatus;
+	/** True when nothing older exists ("Beginning of logs"). */
+	readonly done: boolean;
+	/** Bytes scanned by the scan in flight (0 until its first slice answers). */
+	readonly scannedBytes: number;
+	/** The source that answered (the server may fall back to `ring`). */
+	readonly source: string | undefined;
+	readonly error: string | null;
+	readonly loadOlder: () => void;
+	readonly cancel: () => void;
+}
+export declare function useLogHistory(query: LogHistoryQuery, limit: number): LogHistory;

package/dist/index.cjs

@@ -10754,6 +10754,8 @@ var useDeviceHistoryListNodeSeries = trpc.deviceHistory.listNodeSeries.useQuery;
 var useDeviceHistoryQuery = trpc.deviceHistory.query.useQuery;
 /** Generated alias around `trpc.deviceHistory.queryNode.useQuery`. */
 var useDeviceHistoryQueryNode = trpc.deviceHistory.queryNode.useQuery;
+/** Generated alias around `trpc.deviceHistory.queryMany.useQuery`. */
+var useDeviceHistoryQueryMany = trpc.deviceHistory.queryMany.useQuery;
 /** Generated alias around `trpc.deviceHistory.declareSeries.useMutation`. */
 var useDeviceHistoryDeclareSeries = trpc.deviceHistory.declareSeries.useMutation;
 /** Generated alias around `trpc.deviceHistory.record.useMutation`. */
@@ -39832,6 +39834,202 @@ function useLiveBuffer(max) {
 		reset
 	]);
 }
+//#endregion
+//#region src/hooks/use-debounced-string.ts
+/**
+* useDebouncedString — return `value` after `delay` ms have passed
+* without further changes. Resets the timer on every change.
+*
+* Useful for search inputs that should NOT push to URL state on every
+* keystroke. The DOM input stays controlled by an external `value`
+* (caller's `useState`); this hook produces a debounced derivation.
+*/
+function useDebouncedString(value, delayMs) {
+	const [debounced, setDebounced] = (0, react$1.useState)(value);
+	(0, react$1.useEffect)(() => {
+		const t = setTimeout(() => setDebounced(value), delayMs);
+		return () => clearTimeout(t);
+	}, [value, delayMs]);
+	return debounced;
+}
+//#endregion
+//#region src/composites/log-history-paging.ts
+/**
+* Accumulate slices until `limit` entries, `done`, or an abort. An abort keeps
+* what was already collected and the cursor reached, so "Load older" resumes
+* where the scan stopped instead of starting again.
+*/
+async function collectPage(options) {
+	const { fetchSlice, limit, signal, onProgress } = options;
+	const entries = [];
+	let cursor = options.before;
+	let scannedBytes = 0;
+	let source;
+	for (;;) {
+		if (signal.aborted) return {
+			entries,
+			nextBefore: cursor ?? null,
+			done: false,
+			cancelled: true,
+			scannedBytes,
+			source
+		};
+		let page;
+		try {
+			page = await fetchSlice(cursor, Math.max(1, limit - entries.length), signal);
+		} catch (error) {
+			if (signal.aborted) return {
+				entries,
+				nextBefore: cursor ?? null,
+				done: false,
+				cancelled: true,
+				scannedBytes,
+				source
+			};
+			throw error;
+		}
+		entries.push(...page.entries);
+		scannedBytes += page.scannedBytes;
+		source = page.source;
+		onProgress?.(scannedBytes);
+		const exhausted = page.done || page.nextBefore === null;
+		if (page.cancelled === true) return {
+			entries,
+			nextBefore: page.nextBefore,
+			done: exhausted,
+			cancelled: true,
+			scannedBytes,
+			source
+		};
+		if (exhausted || entries.length >= limit) return {
+			entries,
+			nextBefore: page.nextBefore,
+			done: exhausted,
+			cancelled: false,
+			scannedBytes,
+			source
+		};
+		cursor = page.nextBefore ?? void 0;
+	}
+}
+/** Stable identity of an entry: the server id, else the legacy composite key. */
+function logEntryKey(entry) {
+	if (entry.id !== void 0 && entry.id !== "") return `id:${entry.id}`;
+	return `${entry.timestamp}|${entry.level}|${entry.scope ?? ""}|${entry.message}`;
+}
+/**
+* History (newest first, as paged) merged with live entries (arrival order),
+* deduped by key — a live entry wins (richer tags/meta) — and returned
+* chronologically, newest LAST. Ties keep insertion order.
+*/
+function mergeLogEntries(history, live) {
+	const byKey = /* @__PURE__ */ new Map();
+	for (const entry of history) byKey.set(logEntryKey(entry), entry);
+	for (const entry of live) byKey.set(logEntryKey(entry), entry);
+	return [...byKey.values()].toSorted((a, b) => new Date(a.timestamp).getTime() - new Date(b.timestamp).getTime());
+}
+//#endregion
+//#region src/hooks/use-log-history.ts
+/**
+* useLogHistory — pages the server-served log history (D898).
+*
+* The first page and every older page go through `collectPage`, which keeps
+* calling `logs.query` with `before: nextBefore` while the server answers a
+* short, not-done slice. Changing the filters aborts whatever is in flight and
+* restarts from the first page; `cancel()` aborts the scan but keeps what was
+* found and the cursor reached, so "Load older" resumes from there.
+*/
+var INITIAL = {
+	entries: [],
+	nextBefore: null,
+	done: false,
+	status: "loading",
+	scannedBytes: 0,
+	source: void 0,
+	error: null
+};
+function useLogHistory(query, limit) {
+	const utils = trpc.useUtils();
+	const [state, setState] = (0, react$1.useState)(INITIAL);
+	const stateRef = (0, react$1.useRef)(state);
+	stateRef.current = state;
+	const queryRef = (0, react$1.useRef)(query);
+	queryRef.current = query;
+	const abortRef = (0, react$1.useRef)(null);
+	const queryKey = JSON.stringify(query);
+	const run = (0, react$1.useCallback)(async (before, reset) => {
+		abortRef.current?.abort();
+		const controller = new AbortController();
+		abortRef.current = controller;
+		setState((prev) => ({
+			...reset ? INITIAL : prev,
+			status: "loading",
+			scannedBytes: 0,
+			error: null
+		}));
+		const fetchSlice = (cursor, remaining, signal) => utils.client.logs.query.query({
+			...queryRef.current,
+			limit: remaining,
+			...cursor !== void 0 ? { before: cursor } : {}
+		}, { signal });
+		try {
+			const out = await collectPage({
+				fetchSlice,
+				limit,
+				...before !== void 0 ? { before } : {},
+				signal: controller.signal,
+				onProgress: (scannedBytes) => {
+					if (abortRef.current === controller) setState((prev) => ({
+						...prev,
+						scannedBytes
+					}));
+				}
+			});
+			if (abortRef.current !== controller) return;
+			setState((prev) => ({
+				entries: reset ? out.entries : [...prev.entries, ...out.entries],
+				nextBefore: out.nextBefore,
+				done: out.done,
+				status: "idle",
+				scannedBytes: out.scannedBytes,
+				source: out.source ?? prev.source,
+				error: null
+			}));
+		} catch (error) {
+			if (abortRef.current !== controller) return;
+			setState((prev) => ({
+				...prev,
+				status: "idle",
+				error: error instanceof Error ? error.message : String(error)
+			}));
+		}
+	}, [utils, limit]);
+	(0, react$1.useEffect)(() => {
+		run(void 0, true);
+		return () => {
+			abortRef.current?.abort();
+			abortRef.current = null;
+		};
+	}, [run, queryKey]);
+	const loadOlder = (0, react$1.useCallback)(() => {
+		const current = stateRef.current;
+		if (current.status === "loading" || current.done) return;
+		run(current.nextBefore ?? void 0, false);
+	}, [run]);
+	const cancel = (0, react$1.useCallback)(() => {
+		abortRef.current?.abort();
+	}, []);
+	return {
+		entries: state.entries,
+		status: state.status,
+		done: state.done,
+		scannedBytes: state.scannedBytes,
+		source: state.source,
+		error: state.error,
+		loadOlder,
+		cancel
+	};
+}
 /**
 * True when the viewport is scrolled to (or within `threshold` px of) the
 * bottom of its content.
@@ -39888,12 +40086,6 @@ var LEVEL_STYLES = {
 		color: "text-gray-500"
 	}
 };
-var LEVEL_SEVERITY = {
-	debug: 0,
-	info: 1,
-	warn: 2,
-	error: 3
-};
 var LEVEL_OPTIONS = [
 	"debug",
 	"info",
@@ -39902,15 +40094,18 @@ var LEVEL_OPTIONS = [
 ];
 /** Max live entries kept in the ring buffer. */
 var MAX_LIVE_ENTRIES$1 = 500;
-function passesLevel(logLevel, filterLevel) {
-	if (!filterLevel) return true;
-	return (LEVEL_SEVERITY[logLevel] ?? 0) >= (LEVEL_SEVERITY[filterLevel] ?? 0);
-}
-function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: propsDeviceId, containerDeviceId: propsContainerDeviceId, integrationId: propsIntegrationId, requestId: propsRequestId, level: initialLevel, maxHeight = "max-h-96", showScope = false, showDeviceChip = false, showFilters = true, limit = 100, liveBuffer: externalBuffer, onClose, className }) {
+/** Text filter debounce before it goes to the server. */
+var TEXT_DEBOUNCE_MS = 300;
+/** Distance from the top (px) that asks for the next older page. */
+var TOP_LOAD_THRESHOLD_PX = 24;
+var BYTES_PER_MB = 1024 * 1024;
+function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: propsDeviceId, containerDeviceId: propsContainerDeviceId, integrationId: propsIntegrationId, requestId: propsRequestId, level: initialLevel, maxHeight = "max-h-96", showScope = false, showDeviceChip = false, showFilters = true, showSourceSelect, limit = 100, liveBuffer: externalBuffer, onClose, className }) {
 	const t = useUiText();
+	const sourceSelectOn = showSourceSelect ?? showFilters;
 	const [localAddonId, setLocalAddonId] = (0, react$1.useState)("");
 	const [localDeviceId, setLocalDeviceId] = (0, react$1.useState)("");
 	const [levelFilter, setLevelFilter] = (0, react$1.useState)(initialLevel ?? "info");
+	const [sourceChoice, setSourceChoice] = (0, react$1.useState)(void 0);
 	const agentId = propsAgentId;
 	const addonId = propsAddonId ?? (localAddonId || void 0);
 	const deviceId = propsDeviceId ?? (localDeviceId ? Number(localDeviceId) : void 0);
@@ -39955,48 +40150,63 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 			setExpandAll(false);
 		}
 	}, [scopeKey, buffer]);
-	const { data: initialLogs, isLoading } = trpc.logs.query.useQuery({
-		...tags ? { tags } : {},
-		limit
-	}, { staleTime: 3e4 });
-	trpc.logs.subscribe.useSubscription(tags ? { tags } : {}, { onData: (entry) => {
+	const debouncedText = useDebouncedString(searchText, TEXT_DEBOUNCE_MS).trim();
+	const sourcesQuery = trpc.logs.sources.useQuery(void 0, { staleTime: 6e4 });
+	const readableSources = (0, react$1.useMemo)(() => (sourcesQuery.data ?? []).filter((source) => source.readable), [sourcesQuery.data]);
+	const history = useLogHistory((0, react$1.useMemo)(() => ({
+		...sourceChoice ? { source: sourceChoice } : {},
+		level: levelFilter,
+		...debouncedText ? { text: debouncedText } : {},
+		...tags ? { tags } : {}
+	}), [
+		sourceChoice,
+		levelFilter,
+		debouncedText,
+		tags
+	]), limit);
+	trpc.logs.subscribe.useSubscription({
+		level: levelFilter,
+		...debouncedText ? { text: debouncedText } : {},
+		...tags ? { tags } : {}
+	}, { onData: (entry) => {
 		buffer.append(entry);
 	} });
+	const filterKey = `${sourceChoice ?? ""}|${levelFilter}|${debouncedText}`;
+	const prevFilterRef = (0, react$1.useRef)(filterKey);
+	(0, react$1.useEffect)(() => {
+		if (prevFilterRef.current === filterKey) return;
+		prevFilterRef.current = filterKey;
+		buffer.reset();
+		setFollow(true);
+	}, [filterKey, buffer]);
 	const allLogs = (0, react$1.useMemo)(() => {
-		const initial = (initialLogs ?? []).map((log) => ({
-			timestamp: log.timestamp,
-			level: log.level,
-			message: log.message,
-			scope: log.scope,
-			tags: log.tags,
-			meta: log.meta
-		}));
-		const byKey = /* @__PURE__ */ new Map();
-		for (const log of initial) byKey.set(`${log.timestamp}|${log.level}|${log.scope ?? ""}|${log.message}`, log);
-		for (const log of liveLogs) byKey.set(`${log.timestamp}|${log.level}|${log.scope ?? ""}|${log.message}`, log);
-		const merged = [...byKey.values()].toSorted((a, b) => new Date(a.timestamp).getTime() - new Date(b.timestamp).getTime());
-		const levelFiltered = (clearedAt > 0 ? merged.filter((log) => new Date(log.timestamp).getTime() > clearedAt) : merged).filter((log) => passesLevel(log.level, levelFilter));
-		const needle = searchText.trim().toLowerCase();
-		if (!needle) return levelFiltered;
-		return levelFiltered.filter((log) => {
-			if (log.message.toLowerCase().includes(needle)) return true;
-			if (log.scope && log.scope.toLowerCase().includes(needle)) return true;
-			if (log.tags) {
-				for (const v of Object.values(log.tags)) if (v !== void 0 && String(v).toLowerCase().includes(needle)) return true;
-			}
-			if (log.meta) for (const v of Object.values(log.meta)) {
-				if (v === void 0 || v === null) continue;
-				if (formatMetaValue(v).toLowerCase().includes(needle)) return true;
-			}
-			return false;
-		});
+		const merged = mergeLogEntries(history.entries, liveLogs);
+		return clearedAt > 0 ? merged.filter((log) => new Date(log.timestamp).getTime() > clearedAt) : merged;
 	}, [
-		initialLogs,
+		history.entries,
 		liveLogs,
-		levelFilter,
-		clearedAt,
-		searchText
+		clearedAt
 	]);
+	const prependAnchorRef = (0, react$1.useRef)(null);
+	const requestOlder = (0, react$1.useCallback)(() => {
+		if (history.status === "loading" || history.done) return;
+		const el = scrollRef.current;
+		if (el) prependAnchorRef.current = {
+			height: el.scrollHeight,
+			top: el.scrollTop
+		};
+		history.loadOlder();
+	}, [history]);
+	(0, react$1.useLayoutEffect)(() => {
+		const anchor = prependAnchorRef.current;
+		const el = scrollRef.current;
+		if (!anchor || !el || history.status !== "idle") return;
+		prependAnchorRef.current = null;
+		const next = anchor.top + (el.scrollHeight - anchor.height);
+		if (Math.abs(next - el.scrollTop) < 1) return;
+		programmaticScrollRef.current = true;
+		el.scrollTop = next;
+	}, [history.status, history.entries.length]);
 	const scrollToBottom = (0, react$1.useCallback)((behavior) => {
 		const el = scrollRef.current;
 		if (!el) return;
@@ -40007,15 +40217,16 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 		});
 	}, []);
 	const [hasNewWhilePaused, setHasNewWhilePaused] = (0, react$1.useState)(false);
-	const prevLenRef = (0, react$1.useRef)(allLogs.length);
+	const lastKey = allLogs.length > 0 ? logEntryKey(allLogs[allLogs.length - 1]) : "";
+	const prevLastKeyRef = (0, react$1.useRef)(lastKey);
 	(0, react$1.useLayoutEffect)(() => {
-		const grew = allLogs.length > prevLenRef.current;
-		prevLenRef.current = allLogs.length;
-		if (!grew) return;
+		const newestChanged = lastKey !== "" && lastKey !== prevLastKeyRef.current;
+		prevLastKeyRef.current = lastKey;
+		if (!newestChanged) return;
 		if (follow) scrollToBottom();
 		else setHasNewWhilePaused(true);
 	}, [
-		allLogs.length,
+		lastKey,
 		follow,
 		scrollToBottom
 	]);
@@ -40035,8 +40246,9 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 		if (!el) return;
 		const pinned = isPinnedToBottom(el, 40);
 		setFollow((prev) => prev === pinned ? prev : pinned);
-	}, []);
-	const expandableKeys = (0, react$1.useMemo)(() => allLogs.filter((log) => log.tags && Object.keys(log.tags).length > 0 || log.meta && Object.keys(log.meta).length > 0).map((log) => `${log.timestamp}|${log.level}|${log.scope ?? ""}|${log.message}`), [allLogs]);
+		if (el.scrollTop <= TOP_LOAD_THRESHOLD_PX) requestOlder();
+	}, [requestOlder]);
+	const expandableKeys = (0, react$1.useMemo)(() => allLogs.filter((log) => log.tags && Object.keys(log.tags).length > 0 || log.meta && Object.keys(log.meta).length > 0).map(logEntryKey), [allLogs]);
 	const toggleExpandAll = (0, react$1.useCallback)(() => {
 		setExpandAll((prev) => {
 			if (prev) setExpandedRows(/* @__PURE__ */ new Set());
@@ -40083,7 +40295,7 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 			setTimeout(() => setCopiedRowKey((prev) => prev === key ? null : prev), 1200);
 		});
 	}, []);
-	const rowKey = (0, react$1.useCallback)((log) => `${log.timestamp}|${log.level}|${log.scope ?? ""}|${log.message}`, []);
+	const rowKey = logEntryKey;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: cn("h-full min-h-0 flex flex-col", className),
 		onClick: (e) => e.stopPropagation(),
@@ -40118,6 +40330,23 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 								children: [l, "+"]
 							}, l))
 						}),
+						sourceSelectOn && readableSources.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "w-36",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Select, {
+								"aria-label": t("uiLibrary.logStream.source", "Log source"),
+								className: "h-5 text-[10px]",
+								value: sourceChoice ?? readableSources.find((x) => x.isDefault)?.addonId ?? "",
+								onChange: (e) => setSourceChoice(e.target.value),
+								options: readableSources.map((x) => ({
+									value: x.addonId,
+									label: x.addonId
+								}))
+							})
+						}),
+						sourceSelectOn && readableSources.length <= 1 && history.source && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "text-[9px] text-foreground-subtle",
+							children: t("uiLibrary.logStream.sourceName", "Source: {{name}}", { name: history.source })
+						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarButton, {
 							icon: ArrowDownToLine,
 							label: follow ? t("uiLibrary.logStream.following", "Following") : t("uiLibrary.logStream.paused", "Paused"),
@@ -40216,11 +40445,16 @@ function LogStream({ agentId: propsAgentId, addonId: propsAddonId, deviceId: pro
 					onScroll: handleScroll,
 					className: cn("flex-1 min-h-0 overflow-auto font-mono text-[10px]", maxHeight),
 					children: [
-						isLoading && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: "flex items-center justify-center gap-2 py-6 text-foreground-subtle",
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3.5 w-3.5 animate-spin" }), t("uiLibrary.logStream.loading", "Loading logs...")]
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(HistoryEdge, {
+							status: history.status,
+							done: history.done,
+							scannedBytes: history.scannedBytes,
+							hasRows: allLogs.length > 0,
+							error: history.error,
+							onLoadOlder: requestOlder,
+							onCancel: history.cancel
 						}),
-						!isLoading && allLogs.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						history.status === "idle" && history.done && allLogs.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							className: "py-4 text-center text-foreground-subtle",
 							children: t("uiLibrary.logStream.noLogs", "No logs found")
 						}),
@@ -40344,6 +40578,49 @@ function DeviceChip({ deviceId, deviceName }) {
 		children: label
 	});
 }
+/**
+* The top of the list: the state of the older-history scan. A scan that is
+* still looking (short page, source not done) says how much it has read and
+* can be cancelled; the end of the source is stated quietly.
+*/
+function HistoryEdge({ status, done, scannedBytes, hasRows, error, onLoadOlder, onCancel }) {
+	const t = useUiText();
+	if (status === "loading") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex items-center justify-center gap-2 py-2 text-foreground-subtle",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3.5 w-3.5 animate-spin" }),
+			scannedBytes > 0 ? t("uiLibrary.logStream.searching", "Searching older logs… ({{mb}} MB scanned)", { mb: (scannedBytes / BYTES_PER_MB).toFixed(1) }) : t("uiLibrary.logStream.loading", "Loading logs..."),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+				variant: "outline",
+				size: "sm",
+				onClick: onCancel,
+				children: t("uiLibrary.logStream.cancel", "Cancel")
+			})
+		]
+	});
+	if (error) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex items-center justify-center gap-2 py-2 text-danger",
+		children: [error, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+			variant: "outline",
+			size: "sm",
+			onClick: onLoadOlder,
+			children: t("uiLibrary.logStream.retry", "Retry")
+		})]
+	});
+	if (done) return hasRows ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "py-2 text-center text-foreground-subtle",
+		children: t("uiLibrary.logStream.beginning", "Beginning of logs")
+	}) : null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "flex justify-center py-1.5",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+			variant: "outline",
+			size: "sm",
+			onClick: onLoadOlder,
+			children: t("uiLibrary.logStream.loadOlder", "Load older")
+		})
+	});
+}
 function ScopeBadge$2({ label, value }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 		className: "text-[9px] px-1.5 py-0.5 rounded-full bg-primary/10 text-primary font-medium",
@@ -52387,24 +52664,6 @@ function DeviceBatchActionsBar(props) {
 	})] });
 }
 //#endregion
-//#region src/hooks/use-debounced-string.ts
-/**
-* useDebouncedString — return `value` after `delay` ms have passed
-* without further changes. Resets the timer on every change.
-*
-* Useful for search inputs that should NOT push to URL state on every
-* keystroke. The DOM input stays controlled by an external `value`
-* (caller's `useState`); this hook produces a debounced derivation.
-*/
-function useDebouncedString(value, delayMs) {
-	const [debounced, setDebounced] = (0, react$1.useState)(value);
-	(0, react$1.useEffect)(() => {
-		const t = setTimeout(() => setDebounced(value), delayMs);
-		return () => clearTimeout(t);
-	}, [value, delayMs]);
-	return debounced;
-}
-//#endregion
 //#region src/hooks/use-persisted-page-size.ts
 /**
 * usePersistedPageSize — a "rows per page" choice remembered per viewer.
@@ -65703,6 +65962,7 @@ exports.useDeviceHistoryGetStatus = useDeviceHistoryGetStatus;
 exports.useDeviceHistoryListNodeSeries = useDeviceHistoryListNodeSeries;
 exports.useDeviceHistoryListSeries = useDeviceHistoryListSeries;
 exports.useDeviceHistoryQuery = useDeviceHistoryQuery;
+exports.useDeviceHistoryQueryMany = useDeviceHistoryQueryMany;
 exports.useDeviceHistoryQueryNode = useDeviceHistoryQueryNode;
 exports.useDeviceHistoryRecord = useDeviceHistoryRecord;
 exports.useDeviceHistoryRecordBuckets = useDeviceHistoryRecordBuckets;