@linxin666/dsh-remote-web-ui 0.1.12 → 0.1.14

package/lib/mobile.js

@@ -7570,6 +7570,10 @@ async function listWorkspaces() {
 	const { items } = await callUnary("workspace.list", {});
 	return items;
 }
+/** Read-only mobile display preferences (answered by the plugin, not the host proxy). */
+async function fetchMobilePreferences() {
+	return await callUnary("mobile.preferences", {});
+}
 /** One session.list page; omit the cursor for the first page. */
 async function listSessions(cursor) {
 	return await callUnary("session.list", cursor === void 0 ? {} : { cursor });
@@ -7581,13 +7585,13 @@ async function listSessions(cursor) {
 async function createSession(options = {}) {
 	return await callUnary("session.create", options);
 }
-/** One history window; omit beforeSeq for the tail page. */
-async function history(sessionId, beforeSeq, maxMessages = 30) {
+/** One history window; omit beforeSeq for the tail page, pass a signal to abort. */
+async function history(sessionId, beforeSeq, maxMessages = 30, signal) {
 	return await callUnary("session.history", {
 		sessionId,
 		maxMessages,
 		...beforeSeq !== void 0 ? { beforeSeq } : {}
-	});
+	}, signal);
 }
 /** Send one text prompt (queued: the agent picks it up in order). */
 async function prompt(sessionId, text) {
@@ -13526,20 +13530,6 @@ function ThemeToggle() {
 		children: dark ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SunIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MoonIcon, {})
 	});
 }
-//#endregion
-//#region src/mobile/views/ChatView.tsx
-/**
-* Chat level: one session. Loads the history tail page on open, appends
-* pages upward (loadOlder), folds live mux frames in as they arrive, and
-* sends prompts through session.prompt.
-*
-* Rendering mirrors the desktop web UI's fold discipline on a small screen:
-* - reasoning text hides behind a collapsed "深度思考" disclosure,
-* - tool calls behind a collapsed tool disclosure (name + arguments),
-* - very long assistant text collapses with an explicit expand toggle,
-* - a toolbar above the composer carries the model (+ thinking effort) and
-*   permission pickers, both as bottom sheets.
-*/
 /** Extract the raw event from one history entry (the fold consumes events only). */
 function eventOf(entry) {
 	return entry.event;
@@ -13597,26 +13587,74 @@ function ChatView({ session, mux, onBack }) {
 	const [sending, setSending] = (0, import_react.useState)(false);
 	const scrollRef = (0, import_react.useRef)(void 0);
 	const pendingRef = (0, import_react.useRef)(false);
+	/**
+	* True while the initial tail page is in flight. Live events arriving in
+	* that window go to {@link liveBufferRef} instead of the message list: the
+	* tail load replaces the list wholesale, so a directly folded event would
+	* flash once, be discarded by the snapshot, and then be skipped forever by
+	* the seq watermark.
+	*/
+	const tailLoadingRef = (0, import_react.useRef)(true);
+	/** Live session events buffered while the initial tail page loads. */
+	const liveBufferRef = (0, import_react.useRef)([]);
+	/** True once the live buffer hit its cap (oldest events were dropped). */
+	const liveBufferOverflowRef = (0, import_react.useRef)(false);
 	/** The session's permission select (absent = capability not composed). */
 	const [permissions, setPermissions] = (0, import_react.useState)(void 0);
 	/** The current model selection for the toolbar chip (best-effort label). */
 	const [currentModel, setCurrentModel] = (0, import_react.useState)(void 0);
 	/** Which bottom sheet is open. */
 	const [sheet, setSheet] = (0, import_react.useState)(null);
+	/**
+	* Composer preference from the plugin's host settings (default true keeps
+	* the legacy Enter-to-send behavior until the preference loads).
+	*/
+	const [mobileEnterToSend, setMobileEnterToSend] = (0, import_react.useState)(true);
+	(0, import_react.useEffect)(() => {
+		let cancelled = false;
+		fetchMobilePreferences().then((preferences) => {
+			if (!cancelled) setMobileEnterToSend(preferences.mobileEnterToSend !== false);
+		}, () => {});
+		return () => {
+			cancelled = true;
+		};
+	}, []);
 	(0, import_react.useEffect)(() => {
 		let cancelled = false;
+		const controller = new AbortController();
+		const timeout = setTimeout(() => {
+			controller.abort(new DOMException("history load timed out", "TimeoutError"));
+		}, 15e3);
+		tailLoadingRef.current = true;
+		liveBufferRef.current = [];
+		liveBufferOverflowRef.current = false;
 		setLoading(true);
 		setError(void 0);
 		setMessages([]);
-		loadHistory(session.sessionId).then((page) => {
+		loadHistory(session.sessionId, void 0, controller.signal).then((page) => {
 			if (cancelled) return;
-			setMessages(foldEvents(page.events.map(eventOf)));
+			const buffered = liveBufferRef.current;
+			liveBufferRef.current = [];
+			tailLoadingRef.current = false;
+			setMessages(foldEvents(buffered, foldEvents(page.events.map(eventOf))));
 			setHasOlder(page.hasMore);
 			setLoading(false);
 			const projections = page.projections?.values;
 			setPermissions(parsePermissionSelect(projections?.["permissions"]));
+			if (liveBufferOverflowRef.current) loadHistory(session.sessionId, void 0, controller.signal).then((fresh) => {
+				if (cancelled) return;
+				setMessages((previous) => foldEvents(fresh.events.map(eventOf), previous));
+				liveBufferOverflowRef.current = false;
+			}, (reason) => {
+				if (cancelled) return;
+				console.warn("history tail re-pull after live buffer overflow failed", reason);
+			});
 		}, (reason) => {
 			if (cancelled) return;
+			const buffered = liveBufferRef.current;
+			liveBufferRef.current = [];
+			tailLoadingRef.current = false;
+			if (buffered.length > 0) setMessages(foldEvents(buffered));
 			setError(errorText(reason));
 			setLoading(false);
 		});
@@ -13625,6 +13663,8 @@ function ChatView({ session, mux, onBack }) {
 		}, () => {});
 		return () => {
 			cancelled = true;
+			clearTimeout(timeout);
+			controller.abort();
 		};
 	}, [session.sessionId]);
 	(0, import_react.useEffect)(() => {
@@ -13632,7 +13672,19 @@ function ChatView({ session, mux, onBack }) {
 		return mux.onFrame((frame) => {
 			if (frame.type === "session/event") {
 				if (frame.sessionId !== session.sessionId) return;
-				setMessages((previous) => foldEvents([frame.event], previous));
+				const event = frame.event;
+				if (tailLoadingRef.current) {
+					if (liveBufferRef.current.length >= 500) {
+						liveBufferRef.current.shift();
+						if (!liveBufferOverflowRef.current) {
+							console.warn(`history tail is slow: live buffer reached 500 events; oldest buffered events will be re-fetched`);
+							liveBufferOverflowRef.current = true;
+						}
+					}
+					liveBufferRef.current.push(event);
+					return;
+				}
+				setMessages((previous) => foldEvents([event], previous));
 				return;
 			}
 			if (frame.type === "session/projection" && frame.sessionId === session.sessionId && frame.key === "permissions") setPermissions(parsePermissionSelect(frame.value));
@@ -13800,13 +13852,13 @@ function ChatView({ session, mux, onBack }) {
 					className: "chat-input",
 					rows: 1,
 					value: input,
-					placeholder: "输入消息，Enter 发送…",
-					enterKeyHint: "send",
+					placeholder: mobileEnterToSend ? "输入消息，Enter 发送…" : "输入消息，Enter 换行，点按钮发送…",
+					enterKeyHint: mobileEnterToSend ? "send" : "enter",
 					onChange: (event) => {
 						setInput(event.target.value);
 					},
 					onKeyDown: (event) => {
-						if (event.key === "Enter" && !event.shiftKey) {
+						if (mobileEnterToSend && event.key === "Enter" && !event.shiftKey) {
 							event.preventDefault();
 							send();
 						}
@@ -14503,13 +14555,18 @@ function SessionListView({ workspace, onBack, onPick }) {
 * @param props - the pick action.
 * @returns the roster.
 */
-function WorkspaceView({ onPick }) {
+function WorkspaceView({ initialWorkspaceId, onPick }) {
 	const [items, setItems] = (0, import_react.useState)(void 0);
 	const [error, setError] = (0, import_react.useState)(void 0);
 	(0, import_react.useEffect)(() => {
 		let cancelled = false;
 		listWorkspaces().then((rows) => {
 			if (cancelled) return;
+			const target = initialWorkspaceId === void 0 ? void 0 : rows.find((workspace) => workspace.workspaceId === initialWorkspaceId);
+			if (target !== void 0) {
+				onPick(target);
+				return;
+			}
 			setItems(rows);
 		}, (reason) => {
 			if (cancelled) return;
@@ -14518,7 +14575,7 @@ function WorkspaceView({ onPick }) {
 		return () => {
 			cancelled = true;
 		};
-	}, []);
+	}, [initialWorkspaceId, onPick]);
 	if (error !== void 0) return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
 		className: "mobile",
 		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", {
@@ -14617,6 +14674,11 @@ function WorkspaceView({ onPick }) {
 * router, no state library: the surface is three fixed levels with a back
 * affordance, and every piece of data is fetched on demand.
 */
+/** Read the optional workspace target carried from the pairing QR flow. */
+function mobileWorkspaceTarget(search) {
+	const value = new URLSearchParams(search).get("workspace");
+	return value === null || value === "" ? void 0 : value;
+}
 /** Map a list row to the surface model; the title comes from projections when present. */
 function toSessionView(item) {
 	const titleValue = item.projections?.values?.title;
@@ -14647,6 +14709,7 @@ function formatTime(epochMs) {
 */
 function App() {
 	const [route, setRoute] = (0, import_react.useState)({ kind: "workspaces" });
+	const [initialWorkspaceId, setInitialWorkspaceId] = (0, import_react.useState)(() => mobileWorkspaceTarget(window.location.search));
 	const muxRef = (0, import_react.useRef)(void 0);
 	(0, import_react.useEffect)(() => {
 		const mux = new MuxClient();
@@ -14676,14 +14739,24 @@ function App() {
 			workspace
 		});
 	}, []);
+	const openWorkspace = (0, import_react.useCallback)((workspace) => {
+		if (initialWorkspaceId !== void 0) {
+			const url = new URL(window.location.href);
+			url.searchParams.delete("workspace");
+			window.history.replaceState(null, "", `${url.pathname}${url.search}${url.hash}`);
+			setInitialWorkspaceId(void 0);
+		}
+		setRoute({
+			kind: "sessions",
+			workspace
+		});
+	}, [initialWorkspaceId]);
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
 		className: "mobile",
-		children: route.kind === "workspaces" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WorkspaceView, { onPick: (workspace) => {
-			setRoute({
-				kind: "sessions",
-				workspace
-			});
-		} }) : route.kind === "sessions" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SessionListView, {
+		children: route.kind === "workspaces" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WorkspaceView, {
+			initialWorkspaceId,
+			onPick: openWorkspace
+		}) : route.kind === "sessions" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SessionListView, {
 			workspace: route.workspace,
 			onBack: back,
 			onPick: (session) => {
@@ -14714,8 +14787,8 @@ function staleHostHint(message) {
 	return /^HTTP 403/.test(message) ? "宿主端插件可能仍在运行旧版本：请重启 dsh web 后再试。" : void 0;
 }
 /** Fetch one history page (tail by default) — thin wrapper so views share the call shape. */
-function loadHistory(sessionId, beforeSeq) {
-	return history(sessionId, beforeSeq);
+function loadHistory(sessionId, beforeSeq, signal) {
+	return history(sessionId, beforeSeq, void 0, signal);
 }
 //#endregion
 //#region src/mobile/mobile-styles.ts
@@ -15486,6 +15559,9 @@ body {
   min-width: 0;
   min-height: 40px;
   max-height: 120px;
+  /* Grow with the content (still bounded by min/max-height); browsers
+     without field-sizing support ignore this line and keep the old size. */
+  field-sizing: content;
   padding: 9px 12px;
   border: 1px solid var(--m-border);
   border-radius: 10px;