@huanlin/dsh-plugin-ya-workspace-sidebar 0.3.2 → 0.5.0

package/lib/client.js

@@ -4,6 +4,7 @@ window.__ModuleLoader__.load({
 		var module = { exports: {} };
 		var exports = module.exports;
 		Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+		let _deepseek_ai_cordis = require("@deepseek-ai/cordis");
 		let react = require("react");
 		let _deepseek_ai_dsh_client_ui_primitives = require("@deepseek-ai/dsh-client-ui-primitives");
 		let react_jsx_runtime = require("react/jsx-runtime");
@@ -58,6 +59,7 @@ window.__ModuleLoader__.load({
 				completed: "完了",
 				collapse: "折りたたむ",
 				expand: "展開",
+				resizeRecent: "最近のセッションの高さをドラッグで調整",
 				today: "今日",
 				yesterday: "昨日",
 				date: "{m}月{d}日",
@@ -112,6 +114,7 @@ window.__ModuleLoader__.load({
 				completed: "Abgeschlossen",
 				collapse: "Einklappen",
 				expand: "Ausklappen",
+				resizeRecent: "Ziehen, um die Höhe des Bereichs „Letzte Sitzungen“ anzupassen",
 				today: "Heute",
 				yesterday: "Gestern",
 				date: "{d}.{m}.",
@@ -166,6 +169,7 @@ window.__ModuleLoader__.load({
 				completed: "Terminé",
 				collapse: "Réduire",
 				expand: "Développer",
+				resizeRecent: "Faire glisser pour redimensionner la zone des sessions récentes",
 				today: "Aujourd’hui",
 				yesterday: "Hier",
 				date: "{d}/{m}",
@@ -220,6 +224,7 @@ window.__ModuleLoader__.load({
 				completed: "Concluído",
 				collapse: "Recolher",
 				expand: "Expandir",
+				resizeRecent: "Arraste para redimensionar a área de sessões recentes",
 				today: "Hoje",
 				yesterday: "Ontem",
 				date: "{d}/{m}",
@@ -274,6 +279,7 @@ window.__ModuleLoader__.load({
 				completed: "완료됨",
 				collapse: "접기",
 				expand: "펼치기",
+				resizeRecent: "드래그하여 최근 세션 영역 높이 조절",
 				today: "오늘",
 				yesterday: "어제",
 				date: "{m}월 {d}일",
@@ -328,6 +334,7 @@ window.__ModuleLoader__.load({
 				completed: "مكتمل",
 				collapse: "طي",
 				expand: "توسيع",
+				resizeRecent: "اسحب لضبط ارتفاع منطقة الجلسات الأخيرة",
 				today: "اليوم",
 				yesterday: "أمس",
 				date: "{m}/{d}",
@@ -382,6 +389,7 @@ window.__ModuleLoader__.load({
 				completed: "पूर्ण",
 				collapse: "संक्षिप्त करें",
 				expand: "विस्तार करें",
+				resizeRecent: "हाल के सेशन क्षेत्र की ऊँचाई समायोजित करने के लिए खींचें",
 				today: "आज",
 				yesterday: "कल",
 				date: "{d}/{m}",
@@ -436,6 +444,7 @@ window.__ModuleLoader__.load({
 				completed: "Selesai",
 				collapse: "Ciutkan",
 				expand: "Bentangkan",
+				resizeRecent: "Seret untuk mengatur tinggi area sesi terbaru",
 				today: "Hari ini",
 				yesterday: "Kemarin",
 				date: "{d}/{m}",
@@ -490,6 +499,7 @@ window.__ModuleLoader__.load({
 				completed: "Tamamlandı",
 				collapse: "Daralt",
 				expand: "Genişlet",
+				resizeRecent: "Son oturumlar alanının yüksekliğini sürükleyerek ayarlayın",
 				today: "Bugün",
 				yesterday: "Dün",
 				date: "{d}.{m}",
@@ -544,6 +554,7 @@ window.__ModuleLoader__.load({
 				completed: "Hoàn tất",
 				collapse: "Thu gọn",
 				expand: "Mở rộng",
+				resizeRecent: "Kéo để điều chỉnh chiều cao vùng phiên gần đây",
 				today: "Hôm nay",
 				yesterday: "Hôm qua",
 				date: "{d}/{m}",
@@ -598,6 +609,7 @@ window.__ModuleLoader__.load({
 				completed: "เสร็จสิ้น",
 				collapse: "ย่อ",
 				expand: "ขยาย",
+				resizeRecent: "ลากเพื่อปรับความสูงของพื้นที่เซสชันล่าสุด",
 				today: "วันนี้",
 				yesterday: "เมื่อวาน",
 				date: "{d}/{m}",
@@ -652,6 +664,7 @@ window.__ModuleLoader__.load({
 				completed: "Завершён",
 				collapse: "Свернуть",
 				expand: "Развернуть",
+				resizeRecent: "Перетащите, чтобы изменить высоту области недавних сессий",
 				today: "Сегодня",
 				yesterday: "Вчера",
 				date: "{d}.{m}",
@@ -706,6 +719,7 @@ window.__ModuleLoader__.load({
 				completed: "Completata",
 				collapse: "Comprimi",
 				expand: "Espandi",
+				resizeRecent: "Trascina per ridimensionare l’area delle sessioni recenti",
 				today: "Oggi",
 				yesterday: "Ieri",
 				date: "{d}/{m}",
@@ -760,6 +774,7 @@ window.__ModuleLoader__.load({
 				completed: "Voltooid",
 				collapse: "Inklappen",
 				expand: "Uitklappen",
+				resizeRecent: "Sleep om de hoogte van het gebied met recente sessies aan te passen",
 				today: "Vandaag",
 				yesterday: "Gisteren",
 				date: "{d}-{m}",
@@ -814,6 +829,7 @@ window.__ModuleLoader__.load({
 				completed: "Slutförd",
 				collapse: "Fäll ihop",
 				expand: "Fäll ut",
+				resizeRecent: "Dra för att justera höjden på området för senaste sessioner",
 				today: "Idag",
 				yesterday: "Igår",
 				date: "{d}/{m}",
@@ -868,6 +884,7 @@ window.__ModuleLoader__.load({
 				completed: "Zakończono",
 				collapse: "Zwiń",
 				expand: "Rozwiń",
+				resizeRecent: "Przeciągnij, aby dostosować wysokość obszaru ostatnich sesji",
 				today: "Dzisiaj",
 				yesterday: "Wczoraj",
 				date: "{d}.{m}",
@@ -922,6 +939,7 @@ window.__ModuleLoader__.load({
 				completed: "已完成",
 				collapse: "摺疊",
 				expand: "展開",
+				resizeRecent: "拖動調整最近會話區域高度",
 				today: "今天",
 				yesterday: "昨天",
 				date: "{m}月{d}日",
@@ -976,6 +994,7 @@ window.__ModuleLoader__.load({
 				completed: "已完成",
 				collapse: "摺疊",
 				expand: "展開",
+				resizeRecent: "拖曳調整最近會話區域高度",
 				today: "今天",
 				yesterday: "昨天",
 				date: "{m}月{d}日",
@@ -1030,6 +1049,7 @@ window.__ModuleLoader__.load({
 				completed: "已完成",
 				collapse: "摺疊",
 				expand: "展開",
+				resizeRecent: "拖動調整最近會話區域高度",
 				today: "今天",
 				yesterday: "昨天",
 				date: "{m}月{d}日",
@@ -1088,6 +1108,7 @@ window.__ModuleLoader__.load({
 			completed: "已完成",
 			collapse: "折叠",
 			expand: "展开",
+			resizeRecent: "拖动调整最近会话区域高度",
 			today: "今天",
 			yesterday: "昨天",
 			date: "{m}月{d}日",
@@ -1142,6 +1163,7 @@ window.__ModuleLoader__.load({
 			completed: "Completed",
 			collapse: "Collapse",
 			expand: "Expand",
+			resizeRecent: "Drag to resize the recent sessions area",
 			today: "Today",
 			yesterday: "Yesterday",
 			date: "{m}/{d}",
@@ -1149,6 +1171,156 @@ window.__ModuleLoader__.load({
 		};
 		const NS = "ya-workspace-sidebar";
 		//#endregion
+		//#region src/client/navigation.ts
+		/**
+		* Stand-in for the `uiWorkspace` navigation service owned by the official
+		* ui-workspace client entry, which this bundle's patch disables.
+		*
+		* Since DSH v0.1.2-alpha.1 the ui-sidebar, ui-conversation, ui-agent-preset,
+		* and the composed directory-picker client entries all inject `uiWorkspace`;
+		* without a provider their fibers park forever and the whole WebUI boot
+		* deadlocks. This port carries the semantics that moved here from the
+		* pre-split client runtime: reuse-or-create Workspace connection, the
+		* explicit/current/recent New Session fallback, archived-current clearing,
+		* boot auto-selection, and the directory-picking wire calls.
+		*/
+		/** Implements Workspace navigation and directory UI operations. */
+		var YaWorkspaceNavigation = class extends _deepseek_ai_cordis.Service {
+			directoryPicker;
+			workspaces;
+			sessions;
+			connecting = /* @__PURE__ */ new Map();
+			/**
+			* @param ctx - Client root Context.
+			* @param directoryPicker - the directory-picking Remote namespace.
+			* @param workspaces - pure Workspace Controller.
+			* @param sessions - pure Session Controller.
+			*/
+			constructor(ctx, directoryPicker, workspaces, sessions) {
+				super(ctx, "uiWorkspace");
+				this.directoryPicker = directoryPicker;
+				this.workspaces = workspaces;
+				this.sessions = sessions;
+				ctx.effect(() => this.watchNavigation(), "ya-workspace-sidebar: Workspace navigation policy");
+			}
+			async connectWorkspace(workspaceId) {
+				const workspace = this.workspaces.list.getSnapshot().items.find((item) => item.workspaceId === workspaceId);
+				if (workspace === void 0) throw new Error(`ya-workspace-sidebar: unknown workspace "${workspaceId}"`);
+				const inflight = this.connecting.get(workspaceId);
+				if (inflight !== void 0) return inflight;
+				const archived = this.workspaces.list.getSnapshot().archivedSessionIds;
+				const sessions = this.sessions.list.getSnapshot();
+				for (const id of sessions.ids) {
+					const summary = sessions.byId[id];
+					if (summary !== void 0 && summary.blank && summary.cwd === workspace.path && workspace.sessionIds.includes(summary.id) && !archived.includes(summary.id)) return summary.id;
+				}
+				const attempt = this.sessions.create({ workspaceId }).finally(() => {
+					this.connecting.delete(workspaceId);
+				});
+				this.connecting.set(workspaceId, attempt);
+				return attempt;
+			}
+			startSession(workspaceId) {
+				const workspaces = this.workspaces.list.getSnapshot();
+				const sessions = this.sessions.list.getSnapshot();
+				const current = sessions.current;
+				const currentWorkspaceId = current === void 0 ? void 0 : workspaces.items.find((item) => item.sessionIds.includes(current))?.workspaceId;
+				const recent = workspaces.phase === "ready" && sessions.phase === "ready" ? recentWorkspace(workspaces.items, sessions.byId) : void 0;
+				const target = workspaceId ?? currentWorkspaceId ?? recent;
+				if (target === void 0) {
+					this.sessions.clear();
+					return;
+				}
+				this.connectWorkspace(target).then((sessionId) => {
+					this.sessions.open(sessionId);
+				}, (reason) => {
+					console.warn("ya-workspace-sidebar: new session failed:", reason);
+				});
+			}
+			async archiveSession(sessionId) {
+				await this.workspaces.archiveSession(sessionId);
+			}
+			async pickDirectory() {
+				const result = await this.directoryPicker.pick();
+				if (!result.ok) throw new Error(`directory picker failed: ${result.error.message}`);
+				return result.value;
+			}
+			async listDirectory(path, signal) {
+				const result = await this.directoryPicker.list(path, signal);
+				if (!result.ok) throw new Error(`directory browse failed: ${result.error.code}: ${result.error.message}`);
+				return result.value;
+			}
+			async createDirectory(path, name) {
+				const result = await this.directoryPicker.createDirectory(path, name);
+				if (!result.ok) throw new Error(`directory browse failed: ${result.error.code}: ${result.error.message}`);
+				return result.value;
+			}
+			watchNavigation() {
+				let initial = "waiting";
+				let disposed = false;
+				const reconcile = () => {
+					if (disposed) return;
+					if (this.clearArchivedCurrent()) return;
+					if (initial !== "waiting") return;
+					const workspaces = this.workspaces.list.getSnapshot();
+					const sessions = this.sessions.list.getSnapshot();
+					if (workspaces.phase !== "ready" || sessions.phase !== "ready") return;
+					if (sessions.current !== void 0) {
+						initial = "done";
+						return;
+					}
+					const target = recentWorkspace(workspaces.items, sessions.byId);
+					if (target === void 0) {
+						initial = "done";
+						return;
+					}
+					initial = "connecting";
+					this.connectWorkspace(target).then((sessionId) => {
+						if (disposed) return;
+						if (this.sessions.list.getSnapshot().current === void 0) this.sessions.open(sessionId);
+						initial = "done";
+					}, (reason) => {
+						if (disposed) return;
+						initial = "waiting";
+						console.warn("ya-workspace-sidebar: initial workspace selection failed:", reason);
+					});
+				};
+				const disposeWorkspaces = this.workspaces.list.subscribe(reconcile);
+				const disposeSessions = this.sessions.list.subscribe(reconcile);
+				reconcile();
+				return () => {
+					disposed = true;
+					disposeSessions();
+					disposeWorkspaces();
+				};
+			}
+			/** @returns true when an archived current selection was cleared. */
+			clearArchivedCurrent() {
+				const current = this.sessions.list.getSnapshot().current;
+				if (current === void 0 || !this.workspaces.list.getSnapshot().archivedSessionIds.includes(current)) return false;
+				this.sessions.clear();
+				return true;
+			}
+		};
+		/** Stable tie-breaking follows Host Workspace order. */
+		function recentWorkspace(workspaces, sessions) {
+			let selected;
+			let selectedTime = Number.NEGATIVE_INFINITY;
+			for (const workspace of workspaces) {
+				let latest = Number.NEGATIVE_INFINITY;
+				for (const sessionId of workspace.sessionIds) {
+					const session = sessions[sessionId];
+					if (session !== void 0) latest = Math.max(latest, session.updatedAt);
+				}
+				if (latest === Number.NEGATIVE_INFINITY) latest = Date.parse(workspace.createdAt);
+				if (selected === void 0 || latest > selectedTime) {
+					selected = workspace.workspaceId;
+					selectedTime = latest;
+				}
+			}
+			return selected;
+		}
+		//#endregion
 		//#region src/client/styles.ts
 		/** One scoped stylesheet injected for the lifetime of the client activation. */
 		const CSS = `
@@ -1164,11 +1336,18 @@ body[data-ds-dark-theme] .ya-search { background:var(--dsw-static-neutral-bluish
 .ya-search-input::placeholder { color:var(--dsw-alias-label-tertiary); }
 .ya-search-icon { flex:none; display:inline-flex; border:0; padding:0; color:inherit; background:transparent; }
 .ya-body { flex:1; min-height:0; display:flex; flex-direction:column; overflow:hidden; margin-right:calc(-1 * var(--dsh-sidebar-inline-padding)); padding-right:var(--dsh-sidebar-inline-padding); }
-.ya-recent { flex:none; padding-bottom:8px; border-bottom:1px solid var(--dsw-alias-border-l2); }
-.ya-recent-collapsed { padding-bottom:0; border-bottom-color:transparent; }
+.ya-recent { flex:none; }
 .ya-recent-list-wrap { display:grid; grid-template-rows:1fr; transition:grid-template-rows 220ms ease-out; }
 .ya-recent-collapsed .ya-recent-list-wrap { grid-template-rows:0fr; }
-.ya-recent-list { display:flex; flex-direction:column; overflow:hidden; min-height:0; }
+.ya-recent-list { position:relative; overflow-y:auto; overscroll-behavior:contain; min-height:0; max-height:min(280px, 40vh); }
+.ya-virtual-canvas { position:relative; width:100%; }
+.ya-virtual-slot { position:absolute; left:0; right:0; height:35px; box-sizing:border-box; padding:1px 0; display:flex; flex-direction:column; justify-content:center; }
+.ya-virtual-slot .ya-row { margin:0; min-height:33px; }
+.ya-recent-resizer { position:relative; flex:none; height:9px; margin:1px 0 3px; display:flex; align-items:center; justify-content:center; border-radius:5px; cursor:row-resize; touch-action:none; }
+.ya-recent-resizer::before { content:''; position:absolute; left:8px; right:8px; top:50%; height:1px; transform:translateY(-0.5px); background:var(--dsw-alias-border-l2); }
+.ya-recent-resizer::after { content:''; width:26px; height:3px; border-radius:2px; background:var(--dsw-alias-border-l2); transition:background 120ms ease-out; }
+.ya-recent-resizer:hover::after, .ya-recent-resizer:focus-visible::after, .ya-recent-resizer.ya-resizing::after { background:var(--dsw-alias-label-tertiary); }
+.ya-recent-resizer.ya-resizing::before { background:var(--dsw-alias-interactive-bg-selected); }
 .ya-block-label { height:26px; display:flex; align-items:center; gap:2px; padding:0 8px; color:var(--dsw-alias-label-tertiary); font-size:12px; font-weight:600; letter-spacing:.02em; text-transform:uppercase; }
 .ya-block-label-toggle { flex:none; width:20px; height:20px; margin-left:auto; border:0; border-radius:6px; padding:0; display:inline-flex; align-items:center; justify-content:center; background:transparent; color:var(--dsw-alias-label-tertiary); cursor:pointer; transition:transform 180ms ease-out; }
 .ya-block-label-toggle:hover { background:var(--dsw-alias-interactive-bg-hover); color:var(--dsw-alias-label-secondary); }
@@ -1191,7 +1370,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 .ya-row:hover .ya-row-actions, .ya-menu-open .ya-row-actions { opacity:1; pointer-events:auto; }
 .ya-status-slot { flex:none; width:16px; height:16px; display:inline-flex; align-items:center; justify-content:center; color:var(--dsw-alias-label-tertiary); }
 .ya-recent .ya-row { min-height:31px; }
-.ya-search-workspace { color:var(--dsw-alias-label-tertiary); font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
+.ya-search-workspace { color:var(--dsw-alias-label-tertiary); font-size:11px; line-height:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .ya-empty, .ya-status { padding:18px 10px; color:var(--dsw-alias-label-tertiary); text-align:center; font-size:13px; }
 .ya-warning { color:var(--dsw-alias-status-warning); }
 .ya-rename-input { width:100%; height:38px; box-sizing:border-box; border:1px solid var(--dsw-alias-border-l2); border-radius:9px; padding:0 11px; background:transparent; color:var(--dsw-alias-label-primary); outline:none; }
@@ -1349,18 +1528,24 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 		}
 		//#endregion
 		//#region src/client/model.ts
+		/** Resolve the visible status-dot kind for one session, if any. */
+		function pendingKindOf(pending, id) {
+			const kind = pending.get(id)?.kind;
+			return kind === "approval" || kind === "plan-review" || kind === "question" ? kind : void 0;
+		}
 		/** Navigation key for sessions not accounted to a real workspace. */
 		const UNGROUPED = "__ya_ungrouped__";
 		function visible(summary, current, archived) {
 			return summary.origin !== "subagent" && !archived.has(summary.id) && (!summary.blank || summary.id === current);
 		}
-		function rowOf(summary, workspaceKey, workspaceTitle) {
+		function rowOf(summary, workspaceKey, workspaceTitle, pending) {
+			const pendingInteraction = pendingKindOf(pending, summary.id);
 			return {
 				id: summary.id,
 				title: summary.blank ? "New Session" : summary.displayTitle,
 				blank: summary.blank,
 				running: summary.running,
-				...summary.pendingInteraction === void 0 ? {} : { pendingInteraction: summary.pendingInteraction },
+				...pendingInteraction === void 0 ? {} : { pendingInteraction },
 				completed: summary.completed === true,
 				updatedAt: summary.updatedAt,
 				workspaceKey,
@@ -1378,57 +1563,100 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			return ownerIndex(workspaces).get(sessionId)?.workspaceId ?? "__ya_ungrouped__";
 		}
 		/** Derive global recent sessions, newest first. */
-		function deriveRecent(list, workspaces, archivedSessionIds, limit = 5) {
+		function deriveRecent(list, workspaces, archivedSessionIds, pending, limit = 5) {
 			const archived = new Set(archivedSessionIds);
 			const owners = ownerIndex(workspaces);
 			return list.ids.map((id) => list.byId[id]).filter((summary) => summary !== void 0 && visible(summary, list.current, archived)).sort((a, b) => b.updatedAt - a.updatedAt || String(a.id).localeCompare(String(b.id))).slice(0, limit).map((summary) => {
 				const workspace = owners.get(summary.id);
-				return rowOf(summary, workspace?.workspaceId ?? "__ya_ungrouped__", workspace?.title ?? "Ungrouped");
+				return rowOf(summary, workspace?.workspaceId ?? "__ya_ungrouped__", workspace?.title ?? "Ungrouped", pending);
 			});
 		}
-		/** Derive first-level real workspaces plus the virtual Ungrouped row. */
+		/**
+		* Windowing math for the recent-sessions virtual list (fixed row stride).
+		*
+		* Clamps `scrollTop` into the valid range, then pads the visible row range
+		* with `overscan` rows on both edges. Before the viewport has been measured
+		* (`viewportHeight <= 0`) it still returns a small head window so the first
+		* paint is never blank.
+		*/
+		function virtualWindow(scrollTop, viewportHeight, count, stride = 35, overscan = 4) {
+			if (count <= 0 || stride <= 0) return {
+				start: 0,
+				end: 0
+			};
+			const height = Math.max(0, viewportHeight);
+			const top = Math.min(Math.max(0, scrollTop), Math.max(0, count * stride - height));
+			const first = Math.floor(top / stride);
+			const last = height > 0 ? Math.floor((top + height) / stride) : first;
+			return {
+				start: Math.max(0, first - overscan),
+				end: Math.min(count, last + 1 + overscan)
+			};
+		}
+		function lastUsedOf(timestamps, fallback) {
+			let newest;
+			for (const ts of timestamps) if (newest === void 0 || ts > newest) newest = ts;
+			if (newest !== void 0) return newest;
+			if (fallback === void 0) return void 0;
+			const created = Date.parse(fallback);
+			return Number.isNaN(created) ? void 0 : created;
+		}
+		/** Derive first-level workspaces plus Ungrouped, newest session activity first. */
 		function deriveWorkspaces(list, workspaces, archivedSessionIds) {
 			const archived = new Set(archivedSessionIds);
 			const accounted = /* @__PURE__ */ new Set();
 			const result = workspaces.map((workspace) => {
 				let count = 0;
+				const timestamps = [];
 				for (const id of workspace.sessionIds) {
 					accounted.add(id);
 					const summary = list.byId[id];
-					if (summary !== void 0 && visible(summary, list.current, archived)) count++;
+					if (summary !== void 0 && visible(summary, list.current, archived)) {
+						count++;
+						timestamps.push(summary.updatedAt);
+					}
 				}
+				const lastUsedAt = lastUsedOf(timestamps, workspace.createdAt);
 				return {
 					key: workspace.workspaceId,
 					title: workspace.title,
 					path: workspace.path,
 					createdAt: workspace.createdAt,
+					...lastUsedAt === void 0 ? {} : { lastUsedAt },
 					count,
 					real: true
 				};
 			});
 			let ungrouped = 0;
+			const ungroupedTimestamps = [];
 			for (const id of list.ids) {
 				const summary = list.byId[id];
-				if (summary !== void 0 && !accounted.has(id) && visible(summary, list.current, archived)) ungrouped++;
+				if (summary !== void 0 && !accounted.has(id) && visible(summary, list.current, archived)) {
+					ungrouped++;
+					ungroupedTimestamps.push(summary.updatedAt);
+				}
 			}
+			const ungroupedLastUsed = lastUsedOf(ungroupedTimestamps);
 			result.push({
 				key: UNGROUPED,
 				title: "Ungrouped",
 				count: ungrouped,
-				real: false
+				real: false,
+				...ungroupedLastUsed === void 0 ? {} : { lastUsedAt: ungroupedLastUsed }
 			});
+			result.sort((a, b) => (b.lastUsedAt ?? 0) - (a.lastUsedAt ?? 0) || String(a.key).localeCompare(String(b.key)));
 			return result;
 		}
 		/** Derive the selected workspace's sessions in its canonical order. */
-		function deriveWorkspaceSessions(key, list, workspaces, archivedSessionIds) {
+		function deriveWorkspaceSessions(key, list, workspaces, archivedSessionIds, pending) {
 			const archived = new Set(archivedSessionIds);
 			if (key === "__ya_ungrouped__") {
 				const accounted = new Set(workspaces.flatMap((workspace) => workspace.sessionIds));
-				return list.ids.map((id) => list.byId[id]).filter((summary) => summary !== void 0 && !accounted.has(summary.id) && visible(summary, list.current, archived)).sort((a, b) => b.updatedAt - a.updatedAt || String(a.id).localeCompare(String(b.id))).map((summary) => rowOf(summary, UNGROUPED, "Ungrouped"));
+				return list.ids.map((id) => list.byId[id]).filter((summary) => summary !== void 0 && !accounted.has(summary.id) && visible(summary, list.current, archived)).sort((a, b) => b.updatedAt - a.updatedAt || String(a.id).localeCompare(String(b.id))).map((summary) => rowOf(summary, UNGROUPED, "Ungrouped", pending));
 			}
 			const workspace = workspaces.find((item) => item.workspaceId === key);
 			if (workspace === void 0) return [];
-			return workspace.sessionIds.map((id) => list.byId[id]).filter((summary) => summary !== void 0 && visible(summary, list.current, archived)).map((summary) => rowOf(summary, workspace.workspaceId, workspace.title));
+			return workspace.sessionIds.map((id) => list.byId[id]).filter((summary) => summary !== void 0 && visible(summary, list.current, archived)).map((summary) => rowOf(summary, workspace.workspaceId, workspace.title, pending));
 		}
 		/** Format a local calendar date as `YYYY-MM-DD` (locale-agnostic, no padding surprises). */
 		function localDateKey(year, month, day) {
@@ -1440,21 +1668,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			const msB = Date.UTC(b.year, b.month, b.day);
 			return Math.round((msA - msB) / 864e5);
 		}
-		/**
-		* Derive the selected real workspace's sessions grouped by local calendar date.
-		*
-		* - Only real workspaces: `Ungrouped` falls back to {@link deriveWorkspaceSessions}.
-		* - Groups are ordered by date descending; rows within a group by `updatedAt` descending.
-		* - {@link visible} filter is reused (archived / subagent / blank visibility).
-		* - Future timestamps clamp to today's bucket (`dayOffset` 0).
-		* - `now` is the reference timestamp for "today"; pass `Date.now()` in production.
-		*/
-		function deriveWorkspaceSessionGroups(key, list, workspaces, archivedSessionIds, now) {
-			if (key === "__ya_ungrouped__") return [];
-			const workspace = workspaces.find((item) => item.workspaceId === key);
-			if (workspace === void 0) return [];
-			const archived = new Set(archivedSessionIds);
-			const rows = workspace.sessionIds.map((id) => list.byId[id]).filter((summary) => summary !== void 0 && visible(summary, list.current, archived)).map((summary) => rowOf(summary, workspace.workspaceId, workspace.title));
+		function groupByLocalDate(rows, timestampOf, compare, now) {
 			if (rows.length === 0) return [];
 			const nowDate = new Date(now);
 			const today = {
@@ -1464,7 +1678,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			};
 			const buckets = /* @__PURE__ */ new Map();
 			for (const row of rows) {
-				const ts = Math.min(row.updatedAt, now);
+				const ts = Math.min(timestampOf(row), now);
 				const d = new Date(ts);
 				const date = {
 					year: d.getFullYear(),
@@ -1484,7 +1698,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			}
 			const groups = [];
 			for (const [dateKey, bucket] of buckets) {
-				bucket.rows.sort((a, b) => b.updatedAt - a.updatedAt || String(a.id).localeCompare(String(b.id)));
+				bucket.rows.sort(compare);
 				groups.push({
 					dateKey,
 					dayOffset: bucket.dayOffset,
@@ -1494,6 +1708,36 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			groups.sort((a, b) => a.dayOffset - b.dayOffset || a.dateKey.localeCompare(b.dateKey));
 			return groups;
 		}
+		/**
+		* Derive the selected real workspace's sessions grouped by local calendar date.
+		*
+		* - Only real workspaces: `Ungrouped` falls back to {@link deriveWorkspaceSessions}.
+		* - Groups are ordered by date descending; rows within a group by `updatedAt` descending.
+		* - {@link visible} filter is reused (archived / subagent / blank visibility).
+		* - Future timestamps clamp to today's bucket (`dayOffset` 0).
+		* - `now` is the reference timestamp for "today"; pass `Date.now()` in production.
+		*/
+		function deriveWorkspaceSessionGroups(key, list, workspaces, archivedSessionIds, pending, now) {
+			if (key === "__ya_ungrouped__") return [];
+			const workspace = workspaces.find((item) => item.workspaceId === key);
+			if (workspace === void 0) return [];
+			const archived = new Set(archivedSessionIds);
+			return groupByLocalDate(workspace.sessionIds.map((id) => list.byId[id]).filter((summary) => summary !== void 0 && visible(summary, list.current, archived)).map((summary) => rowOf(summary, workspace.workspaceId, workspace.title, pending)), (row) => row.updatedAt, (a, b) => b.updatedAt - a.updatedAt || String(a.id).localeCompare(String(b.id)), now);
+		}
+		/** Group root workspace rows by local calendar date of `lastUsedAt`; undated rows trail with empty `dateKey`. */
+		function deriveWorkspaceGroups(rows, now) {
+			const dated = [];
+			const undated = [];
+			for (const row of rows) if (row.lastUsedAt === void 0) undated.push(row);
+			else dated.push(row);
+			const groups = groupByLocalDate(dated, (row) => row.lastUsedAt ?? 0, (a, b) => (b.lastUsedAt ?? 0) - (a.lastUsedAt ?? 0) || String(a.key).localeCompare(String(b.key)), now);
+			if (undated.length > 0) groups.push({
+				dateKey: "",
+				dayOffset: Number.POSITIVE_INFINITY,
+				rows: [...undated]
+			});
+			return groups;
+		}
 		/** Case-insensitive local title/workspace matching used beside Host content search. */
 		function localMatches(rows, query) {
 			const normalized = query.trim().toLocaleLowerCase();
@@ -1537,11 +1781,121 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 				listeners.delete(listener);
 			};
 		}
+		const RECENT_HEIGHT_KEY = "ya-workspace-sidebar:recent-height";
+		const recentHeightListeners = /* @__PURE__ */ new Set();
+		let currentRecentHeight = loadRecentHeight();
+		function clampRecentHeight(height) {
+			return Math.min(640, Math.max(70, Math.round(height)));
+		}
+		/** Read the stored height, falling back to `undefined` on any failure. */
+		function loadRecentHeight() {
+			try {
+				const raw = window.localStorage.getItem(RECENT_HEIGHT_KEY);
+				if (raw === null) return void 0;
+				const parsed = Number(raw);
+				return Number.isFinite(parsed) ? clampRecentHeight(parsed) : void 0;
+			} catch {
+				return;
+			}
+		}
+		/** Persist the height (or clear the entry for `undefined`); failures ignored. */
+		function persistRecentHeight(height) {
+			try {
+				if (height === void 0) window.localStorage.removeItem(RECENT_HEIGHT_KEY);
+				else window.localStorage.setItem(RECENT_HEIGHT_KEY, String(height));
+			} catch {}
+		}
+		/** Current recent-sessions viewport height preference, if the user set one. */
+		function getRecentViewportHeight() {
+			return currentRecentHeight;
+		}
+		/** Store (or clear with `undefined`) the height preference and notify subscribers. */
+		function setRecentViewportHeight(height) {
+			const next = height === void 0 ? void 0 : clampRecentHeight(height);
+			if (next === currentRecentHeight) return;
+			currentRecentHeight = next;
+			persistRecentHeight(next);
+			for (const listener of [...recentHeightListeners]) listener();
+		}
+		/** Subscribe to recent height changes; returns an unsubscribe disposer. */
+		function subscribeRecentViewportHeight(listener) {
+			recentHeightListeners.add(listener);
+			return () => {
+				recentHeightListeners.delete(listener);
+			};
+		}
+		//#endregion
+		//#region src/client/VirtualRecentList.tsx
+		/** Fixed-stride virtual scroller for the global recent-sessions block. */
+		/**
+		* Renders `rows` inside a bounded, scrollable viewport while mounting only
+		* the visible slice (plus overscan). The row stride is fixed
+		* ({@link RECENT_ROW_STRIDE}), so windowing is pure arithmetic — no per-row
+		* measurement — and the scroll position survives session-list updates.
+		*/
+		function VirtualRecentList({ rows, renderItem, ariaLabel, viewportRef, maxHeight }) {
+			const viewportRefInternal = (0, react.useRef)(null);
+			const frameRef = (0, react.useRef)(0);
+			const [scrollTop, setScrollTop] = (0, react.useState)(0);
+			const [viewportHeight, setViewportHeight] = (0, react.useState)(0);
+			(0, react.useLayoutEffect)(() => {
+				const el = viewportRefInternal.current;
+				if (el === null) return;
+				const observer = new ResizeObserver((entries) => {
+					const entry = entries[0];
+					if (entry !== void 0) setViewportHeight(entry.contentRect.height);
+				});
+				observer.observe(el);
+				return () => {
+					observer.disconnect();
+				};
+			}, []);
+			(0, react.useEffect)(() => () => {
+				if (frameRef.current !== 0) window.cancelAnimationFrame(frameRef.current);
+			}, []);
+			const handleScroll = () => {
+				if (frameRef.current !== 0) return;
+				frameRef.current = window.requestAnimationFrame(() => {
+					frameRef.current = 0;
+					const el = viewportRefInternal.current;
+					if (el !== null) setScrollTop(el.scrollTop);
+				});
+			};
+			const { start, end } = virtualWindow(scrollTop, viewportHeight, rows.length);
+			const slice = [];
+			for (let index = start; index < end; index += 1) {
+				const row = rows[index];
+				if (row !== void 0) slice.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "ya-virtual-slot",
+					style: { top: index * 35 },
+					children: renderItem(row)
+				}, row.id));
+			}
+			const attachViewport = (node) => {
+				viewportRefInternal.current = node;
+				viewportRef?.(node);
+			};
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				ref: attachViewport,
+				className: "ya-recent-list ya-virtual-viewport",
+				role: "tree",
+				"aria-label": ariaLabel,
+				style: maxHeight === void 0 ? void 0 : { maxHeight: `${maxHeight}px` },
+				onScroll: handleScroll,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "ya-virtual-canvas",
+					style: { height: rows.length * 35 },
+					children: slice
+				})
+			});
+		}
 		//#endregion
 		//#region src/client/WorkspaceSidebar.tsx
 		/** Two-level workspace/session browser with a persistent global recent block. */
 		const SEARCH_DEBOUNCE_MS = 250;
 		const SEARCH_MAX = 500;
+		/** Minimum height kept for the workspace browser below the recent block. */
+		const MIN_WORKSPACE = 120;
 		function sanitized(value) {
 			return value.replaceAll("\0", "").slice(0, SEARCH_MAX);
 		}
@@ -1661,7 +2015,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 				]
 			});
 		}
-		function WorkspaceItem({ row, enter, create, rename, remove, t }) {
+		function WorkspaceItem({ row, enter, create, rename, remove, now, t }) {
 			const [menuOpen, setMenuOpen] = (0, react.useState)(false);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: `ya-row ya-workspace-row${menuOpen ? " ya-menu-open" : ""}`,
@@ -1680,9 +2034,9 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: "ya-row-title",
 								children: row.real ? row.title : t("ungrouped")
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-								className: "ya-row-meta",
-								children: t("count", { n: row.count })
+							}), row.lastUsedAt !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "ya-row-meta ya-row-time",
+								children: relativeTime(row.lastUsedAt, now, t)
 							})]
 						}), row.path !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: "ya-workspace-path",
@@ -1738,23 +2092,27 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 		}
 		/** Fill `sidebar.workspaces` with the replacement browser. */
 		function WorkspaceSidebar(props) {
-			const { wide, expandSidebar, useSessions, useWorkspaces, startSession, open, searchSessions, searchResultLimit, renameSession, forkSession, renameWorkspace, deleteWorkspace, archiveSession, createWorkspace, useDirectoryFlow, renderSlot, t } = props;
+			const { wide, expandSidebar, useSessions, useSessionPendingInteraction, useWorkspaces, startSession, open, searchSessions, searchResultLimit, renameSession, forkSession, renameWorkspace, deleteWorkspace, archiveSession, createWorkspace, useDirectoryFlow, renderSlot, t } = props;
 			const sessions = useSessions((state) => state);
 			const workspaceState = useWorkspaces((state) => state);
 			const workspaces = workspaceState.items;
 			const archived = workspaceState.archivedSessionIds;
+			const pendingInteractions = useSessionPendingInteraction((state) => state);
 			const directoryFlowAvailable = useDirectoryFlow((value) => value);
-			const allRows = (0, react.useMemo)(() => deriveRecent(sessions, workspaces, archived, Number.MAX_SAFE_INTEGER), [
+			const allRows = (0, react.useMemo)(() => deriveRecent(sessions, workspaces, archived, pendingInteractions, Number.MAX_SAFE_INTEGER), [
 				archived,
+				pendingInteractions,
 				sessions,
 				workspaces
 			]);
-			const recent = allRows.slice(0, 5);
+			const recent = allRows;
 			const workspaceRows = (0, react.useMemo)(() => deriveWorkspaces(sessions, workspaces, archived), [
 				archived,
 				sessions,
 				workspaces
 			]);
+			const now = Date.now();
+			const workspaceGroups = (0, react.useMemo)(() => deriveWorkspaceGroups(workspaceRows, now), [workspaceRows, now]);
 			const [selectedKey, setSelectedKey] = (0, react.useState)(null);
 			const [direction, setDirection] = (0, react.useState)("forward");
 			const [hasMounted, setHasMounted] = (0, react.useState)(false);
@@ -1776,15 +2134,15 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 				if (selectedKey !== null && selectedKey !== "__ya_ungrouped__" && !workspaces.some((workspace) => workspace.workspaceId === selectedKey)) setSelectedKey(UNGROUPED);
 			}, [selectedKey, workspaces]);
 			const selectedWorkspace = selectedKey === null || selectedKey === "__ya_ungrouped__" ? void 0 : workspaces.find((workspace) => workspace.workspaceId === selectedKey);
-			const now = Date.now();
-			const levelGroups = (0, react.useMemo)(() => selectedKey !== null && selectedKey !== "__ya_ungrouped__" ? deriveWorkspaceSessionGroups(selectedKey, sessions, workspaces, archived, now) : [], [
+			const levelGroups = (0, react.useMemo)(() => selectedKey !== null && selectedKey !== "__ya_ungrouped__" ? deriveWorkspaceSessionGroups(selectedKey, sessions, workspaces, archived, pendingInteractions, now) : [], [
 				archived,
+				pendingInteractions,
 				sessions,
 				workspaces,
 				selectedKey,
 				now
 			]);
-			const levelRows = selectedKey === "__ya_ungrouped__" ? deriveWorkspaceSessions(UNGROUPED, sessions, workspaces, archived) : [];
+			const levelRows = selectedKey === "__ya_ungrouped__" ? deriveWorkspaceSessions(UNGROUPED, sessions, workspaces, archived, pendingInteractions) : [];
 			const levelEmpty = selectedKey === "__ya_ungrouped__" ? levelRows.length === 0 : levelGroups.every((g) => g.rows.length === 0);
 			const [query, setQuery] = (0, react.useState)("");
 			const normalizedQuery = sanitized(query).trim();
@@ -1859,6 +2217,92 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			const [actionMode, setActionModeState] = (0, react.useState)(() => getActionMode());
 			const [sessionDeleteTarget, setSessionDeleteTarget] = (0, react.useState)(null);
 			(0, react.useEffect)(() => subscribeActionMode(() => setActionModeState(getActionMode())), []);
+			const [recentHeight, setRecentHeight] = (0, react.useState)(() => getRecentViewportHeight());
+			const [recentResizing, setRecentResizing] = (0, react.useState)(false);
+			(0, react.useEffect)(() => subscribeRecentViewportHeight(() => {
+				setRecentHeight(getRecentViewportHeight());
+			}), []);
+			const bodyRef = (0, react.useRef)(null);
+			const recentBlockRef = (0, react.useRef)(null);
+			const breadcrumbRef = (0, react.useRef)(null);
+			const resizerRef = (0, react.useRef)(null);
+			const recentViewportRef = (0, react.useRef)(null);
+			const recentDrag = (0, react.useRef)(null);
+			/** Effective max-height base and the largest height that keeps MIN_WORKSPACE visible. */
+			const measureRecentBounds = () => {
+				const viewport = recentViewportRef.current;
+				const body = bodyRef.current;
+				const resizer = resizerRef.current;
+				if (viewport === null || body === null || resizer === null) return null;
+				const computed = Number.parseFloat(window.getComputedStyle(viewport).maxHeight);
+				const base = Number.isFinite(computed) ? computed : viewport.clientHeight;
+				const breadcrumb = breadcrumbRef.current;
+				const block = recentBlockRef.current;
+				const chrome = (block !== null ? block.offsetHeight : 0) - viewport.clientHeight + (breadcrumb !== null ? breadcrumb.offsetHeight : 0) + resizer.offsetHeight;
+				return {
+					base,
+					max: Math.max(70, Math.round(body.clientHeight - chrome - MIN_WORKSPACE))
+				};
+			};
+			const beginRecentResize = (event) => {
+				if (event.button !== 0 || !event.isPrimary) return;
+				const bounds = measureRecentBounds();
+				if (bounds === null) return;
+				event.preventDefault();
+				recentDrag.current = {
+					pointerId: event.pointerId,
+					startY: event.clientY,
+					startHeight: bounds.base,
+					max: bounds.max,
+					moved: false
+				};
+				resizerRef.current?.setPointerCapture(event.pointerId);
+				document.body.style.cursor = "row-resize";
+				document.body.style.userSelect = "none";
+				setRecentResizing(true);
+			};
+			const moveRecentResize = (event) => {
+				const drag = recentDrag.current;
+				const viewport = recentViewportRef.current;
+				if (drag === null || viewport === null || event.pointerId !== drag.pointerId) return;
+				drag.moved = true;
+				const next = Math.round(Math.min(drag.max, Math.max(70, drag.startHeight + event.clientY - drag.startY)));
+				viewport.style.maxHeight = `${next}px`;
+			};
+			const endRecentResize = (event) => {
+				const drag = recentDrag.current;
+				if (drag === null) return;
+				recentDrag.current = null;
+				const resizer = resizerRef.current;
+				if (resizer !== null && resizer.hasPointerCapture(event.pointerId)) resizer.releasePointerCapture(event.pointerId);
+				document.body.style.cursor = "";
+				document.body.style.userSelect = "";
+				setRecentResizing(false);
+				if (!drag.moved) return;
+				const viewport = recentViewportRef.current;
+				if (viewport === null) return;
+				const written = Number.parseFloat(viewport.style.maxHeight);
+				if (!Number.isFinite(written)) return;
+				const height = Math.round(written);
+				setRecentHeight(height);
+				setRecentViewportHeight(height);
+			};
+			const keyRecentResize = (event) => {
+				if (event.key !== "ArrowUp" && event.key !== "ArrowDown") return;
+				event.preventDefault();
+				const bounds = measureRecentBounds();
+				if (bounds === null) return;
+				const delta = event.key === "ArrowUp" ? -35 : 35;
+				const next = Math.round(Math.min(bounds.max, Math.max(70, (recentHeight ?? bounds.base) + delta)));
+				setRecentHeight(next);
+				setRecentViewportHeight(next);
+			};
+			const resetRecentHeight = () => {
+				const viewport = recentViewportRef.current;
+				if (viewport !== null) viewport.style.maxHeight = "";
+				setRecentHeight(void 0);
+				setRecentViewportHeight(void 0);
+			};
 			const beginWorkspaceRename = (row) => {
 				setWorkspaceRename(row);
 				setRenameDraft(row.title);
@@ -2035,6 +2479,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 						]
 					}),
 					wide && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						ref: bodyRef,
 						className: "ya-body",
 						children: normalizedQuery !== "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: "ya-scroll",
@@ -2057,6 +2502,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 							]
 						}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
 							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								ref: recentBlockRef,
 								className: `ya-recent${recentCollapsed ? " ya-recent-collapsed" : ""}`,
 								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 									className: "ya-block-label",
@@ -2076,13 +2522,34 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 									children: recent.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 										className: "ya-empty",
 										children: t("noSessions")
-									}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-										className: "ya-recent-list",
-										children: recent.map((row) => sessionItem(row, true))
+									}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VirtualRecentList, {
+										rows: recent,
+										ariaLabel: t("recent"),
+										renderItem: (row) => sessionItem(row, true),
+										viewportRef: (node) => {
+											recentViewportRef.current = node;
+										},
+										maxHeight: recentHeight
 									})
 								})]
 							}),
+							!recentCollapsed && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								ref: resizerRef,
+								className: `ya-recent-resizer${recentResizing ? " ya-resizing" : ""}`,
+								role: "separator",
+								"aria-orientation": "horizontal",
+								"aria-label": t("resizeRecent"),
+								"aria-valuenow": recentHeight,
+								tabIndex: 0,
+								onPointerDown: beginRecentResize,
+								onPointerMove: moveRecentResize,
+								onPointerUp: endRecentResize,
+								onPointerCancel: endRecentResize,
+								onDoubleClick: resetRecentHeight,
+								onKeyDown: keyRecentResize
+							}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								ref: breadcrumbRef,
 								className: "ya-breadcrumb",
 								children: selectedKey === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: "ya-crumb",
@@ -2120,7 +2587,11 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 								children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 									className: hasMounted ? `ya-level-enter-${direction}` : void 0,
 									children: [
-										selectedKey === null ? workspaceRows.map((row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceItem, {
+										selectedKey === null ? workspaceGroups.flatMap((group) => [...group.dateKey === "" ? [] : [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+											className: "ya-date-group-label",
+											role: "separator",
+											children: dateGroupLabel(group, now, t)
+										}, `ws-group-${group.dateKey}`)], ...group.rows.map((row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceItem, {
 											row,
 											enter: () => {
 												setDirection("forward");
@@ -2136,8 +2607,9 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 												setDeleteTarget(row);
 												setRenameError(null);
 											},
+											now,
 											t
-										}, row.key)) : selectedKey === "__ya_ungrouped__" ? levelRows.map((row) => sessionItem(row, false)) : levelGroups.flatMap((group) => [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										}, row.key))]) : selectedKey === "__ya_ungrouped__" ? levelRows.map((row) => sessionItem(row, false)) : levelGroups.flatMap((group) => [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 											className: "ya-date-group-label",
 											role: "separator",
 											children: dateGroupLabel(group, now, t)
@@ -2246,12 +2718,17 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 		}
 		//#endregion
 		//#region src/client/index.ts
-		/** Services required by both replacement client entries. */
+		/**
+		* Services required by the replacement client entries. `remote` and
+		* `remote.directoryPicker` feed the uiWorkspace stand-in's directory picking.
+		*/
 		const inject = [
 			"slots",
 			"sessions",
 			"workspaces",
-			"locale"
+			"locale",
+			"remote",
+			"remote.directoryPicker"
 		];
 		/** Register the sidebar browser and conversation hero picker. */
 		function apply(ctx) {
@@ -2259,8 +2736,21 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 				zh,
 				en
 			}), "ya-workspace-sidebar: dictionaries");
-			const betterLocale = ctx.get("betterLocale");
-			if (betterLocale) ctx.effect(() => betterLocale.register(NS, dicts), "ya-workspace-sidebar: better-locale override dicts");
+			ctx.effect(() => {
+				let dispose;
+				const sync = () => {
+					dispose?.();
+					dispose = void 0;
+					const store = ctx.get("betterLocale");
+					if (store !== void 0) dispose = store.register(NS, dicts);
+				};
+				sync();
+				const unsubscribe = ctx.locale.subscribe(sync);
+				return () => {
+					unsubscribe();
+					dispose?.();
+				};
+			}, "ya-workspace-sidebar: better-locale override dicts");
 			ctx.effect(installStyles, "ya-workspace-sidebar: styles");
 			const flowSource = (name) => ({
 				getSnapshot: () => ctx.slots.entries(name).length > 0,
@@ -2269,6 +2759,8 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			const sidebarFlow = flowSource("sidebar.workspaces.directoryFlow");
 			const pickerFlow = flowSource("conversation.hero.workspace.directoryFlow");
 			const createWorkspace = (input) => ctx.workspaces.create(input);
+			const navigation = new YaWorkspaceNavigation(ctx, ctx.remote.directoryPicker, ctx.workspaces, ctx.sessions);
+			ctx.slots.provideRoot({ hooks: { workspaces: ctx.workspaces.list } });
 			const searchSessions = async (query, signal) => {
 				const result = await ctx.sessions.search(query, signal);
 				if (!result.ok) throw new Error(result.error.message);
@@ -2276,7 +2768,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 			};
 			const sidebarInjected = () => ({
 				startSession: (workspaceId) => {
-					ctx.workspaces.startSession(workspaceId);
+					navigation.startSession(workspaceId);
 				},
 				open: (sessionId) => {
 					ctx.sessions.open(sessionId);
@@ -2304,7 +2796,7 @@ button.ya-crumb:hover { background:var(--dsw-alias-interactive-bg-hover); color:
 					await ctx.workspaces.delete(workspaceId);
 				},
 				archiveSession: async (sessionId) => {
-					await ctx.workspaces.archiveSession(sessionId);
+					await navigation.archiveSession(sessionId);
 				},
 				insertSessionBefore: async (workspaceId, sessionId, beforeSessionId) => {
 					await ctx.workspaces.insertSessionBefore(workspaceId, sessionId, beforeSessionId);