@firstpick/pi-package-webui 0.2.6 → 0.2.7

package/bin/pi-webui.mjs

@@ -2147,6 +2147,22 @@ function responseWithPendingThinking(tab, response) {
   return { ...response, data: stateWithPendingThinking(tab, response.data) };
 }
 
+function eventForTabClients(tab, event) {
+  return {
+    ...responseWithPendingThinking(tab, event),
+    tabId: tab.id,
+    tabTitle: tab.title,
+    tabActivity: tabActivitySnapshot(tab),
+  };
+}
+
+function broadcastPendingThinkingState(tab, state) {
+  broadcastTabEvent(tab, {
+    ...eventForTabClients(tab, { type: "response", command: "get_state", success: true, data: stateWithPendingThinking(tab, state) }),
+    pendingExtensionUiRequestCount: pendingExtensionUiRequests(tab).length,
+  });
+}
+
 function forgetTabState(tab) {
   if (!tab) return;
   tab.lastState = null;
@@ -2508,7 +2524,7 @@ function attachRpcToTab(tab, rpc) {
   tab.rpcUnsubscribe = rpc.onEvent((event) => {
     if (resolveWebuiHelperResponse(tab, event) || resolveWebuiHelperRpcResponse(tab, event)) return;
     updateTabActivityFromEvent(tab, event);
-    let scopedEvent = { ...event, tabId: tab.id, tabTitle: tab.title, tabActivity: tabActivitySnapshot(tab) };
+    let scopedEvent = eventForTabClients(tab, event);
     if (event?.type === "pi_process_exit" || event?.type === "pi_process_error") {
       clearPendingExtensionUiRequests(tab);
       clearExtensionStatuses(tab);
@@ -3817,10 +3833,16 @@ async function setThinkingLevelForTab(tab, level, { allowPending = true } = {})
   const stateResult = allowPending ? await safeRpcData(tab, { type: "get_state" }, STATUS_RPC_TIMEOUT_MS) : { ok: false };
   if (allowPending && stateResult.ok && stateIsBusyForSettings(stateResult.data)) {
     tab.pendingThinkingLevel = level;
+    broadcastPendingThinkingState(tab, stateResult.data);
     return rpcSuccess("set_thinking_level", { level, pending: true, message: `Thinking level ${level} will apply to the next prompt.` });
   }
   const response = await tab.rpc.send({ type: "set_thinking_level", level });
-  if (response.success !== false) tab.pendingThinkingLevel = undefined;
+  if (response.success !== false) {
+    tab.pendingThinkingLevel = undefined;
+    const updatedState = await safeRpcData(tab, { type: "get_state" }, STATUS_RPC_TIMEOUT_MS);
+    const effectiveLevel = updatedState.ok ? updatedState.data?.thinkingLevel : level;
+    return { ...response, data: { ...(response.data && typeof response.data === "object" ? response.data : {}), level: effectiveLevel || level, requestedLevel: level } };
+  }
   return response;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@firstpick/pi-package-webui",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "description": "Pi Web UI companion package with a local browser UI CLI plus /webui-start and /webui-status commands.",
   "license": "MIT",
   "type": "module",

package/public/app.js

@@ -7288,10 +7288,10 @@ function resetOptionalFeatureAvailability() {
   renderOptionalFeatureControls();
 }
 
-function requestGitFooterWebuiPayload(tabContext = activeTabContext()) {
+function requestGitFooterWebuiPayload(tabContext = activeTabContext(), { force = false } = {}) {
   if (!tabContext.tabId || isOptionalFeatureDisabled("gitFooterStatus")) return;
   if (currentState?.isStreaming || currentState?.isCompacting) return;
-  if (!hasAvailableCommand("git-footer-refresh") || statusEntries.has(GIT_FOOTER_WEBUI_STATUS_KEY)) return;
+  if (!hasAvailableCommand("git-footer-refresh") || (!force && statusEntries.has(GIT_FOOTER_WEBUI_STATUS_KEY))) return;
   if (gitFooterPayloadRefreshInFlightByTab.has(tabContext.tabId)) return;
 
   gitFooterPayloadRefreshInFlightByTab.add(tabContext.tabId);
@@ -7730,7 +7730,8 @@ function openNativeSettingsDialog() {
     setNativeCommandError("");
     try {
       const requests = [];
-      if (thinking.select.value !== state.thinkingLevel) requests.push(nativeCommandApi("/api/thinking", { method: "POST", body: { level: thinking.select.value } }));
+      const thinkingLevelChanged = thinking.select.value !== state.thinkingLevel;
+      if (thinkingLevelChanged) requests.push(nativeCommandApi("/api/thinking", { method: "POST", body: { level: thinking.select.value } }));
       if (steering.select.value !== state.steeringMode) requests.push(nativeCommandApi("/api/steering-mode", { method: "POST", body: { mode: steering.select.value } }));
       if (followUp.select.value !== state.followUpMode) requests.push(nativeCommandApi("/api/follow-up-mode", { method: "POST", body: { mode: followUp.select.value } }));
       if (autoCompact.input.checked !== state.autoCompactionEnabled) requests.push(nativeCommandApi("/api/auto-compaction", { method: "POST", body: { enabled: autoCompact.input.checked } }));
@@ -7738,6 +7739,7 @@ function openNativeSettingsDialog() {
       if (thinkingOutput.input.checked !== thinkingOutputVisible) setThinkingOutputVisible(thinkingOutput.input.checked);
       if (doneNotifications.input.checked !== agentDoneNotificationsEnabled) await setAgentDoneNotificationsEnabled(doneNotifications.input.checked);
       await Promise.all(requests);
+      if (thinkingLevelChanged) requestGitFooterWebuiPayload(activeTabContext(), { force: true });
       addTransientMessage({ role: "native", title: "/settings", content: "Settings updated.", level: "info" });
       closeNativeCommandDialog();
       await refreshState();
@@ -8335,15 +8337,26 @@ function handleMessageUpdate(event) {
   }
 }
 
+function modelStateKey(model) {
+  return model ? `${model.provider || ""}/${model.id || ""}` : "";
+}
+
+function gitFooterRelevantStateChanged(previousState, nextState) {
+  if (!previousState || !nextState) return false;
+  return previousState.thinkingLevel !== nextState.thinkingLevel || modelStateKey(previousState.model) !== modelStateKey(nextState.model);
+}
+
 async function refreshState(tabContext = activeTabContext()) {
   if (!tabContext.tabId) return;
   const response = await api("/api/state", { tabId: tabContext.tabId });
   if (!isCurrentTabContext(tabContext)) return;
+  const previousState = currentState;
   currentState = response.data || null;
+  const shouldRefreshGitFooter = gitFooterRelevantStateChanged(previousState, currentState);
   syncActiveTabActivityFromState(currentState);
   syncRunIndicatorFromState(currentState);
   renderStatus();
-  requestGitFooterWebuiPayload(tabContext);
+  requestGitFooterWebuiPayload(tabContext, { force: shouldRefreshGitFooter });
 }
 
 async function refreshStats(tabContext = activeTabContext()) {
@@ -9181,6 +9194,7 @@ async function cycleThinkingFromShortcut() {
     if (response.data?.level && currentState) currentState = { ...currentState, thinkingLevel: response.data.level };
     if (isCurrentTabContext(tabContext)) {
       addTransientMessage({ role: "native", title: "thinking", content: response.data?.level ? `Thinking level: ${response.data.level}` : "Thinking level did not change.", level: "info" });
+      if (response.data?.level) requestGitFooterWebuiPayload(tabContext, { force: true });
       await Promise.allSettled([refreshState(tabContext), refreshStats(tabContext)]);
     }
   } catch (error) {
@@ -10031,7 +10045,14 @@ elements.setThinkingButton.addEventListener("click", async () => {
   try {
     const response = await api("/api/thinking", { method: "POST", body: { level: elements.thinkingSelect.value }, tabId: tabContext.tabId });
     if (isCurrentTabContext(tabContext)) {
-      if (response.data?.pending) addEvent(response.data.message || `Thinking level ${response.data.level} will apply to the next prompt.`, "info");
+      if (response.data?.pending) {
+        addEvent(response.data.message || `Thinking level ${response.data.level} will apply to the next prompt.`, "info");
+      } else if (response.data?.level) {
+        const requested = response.data.requestedLevel;
+        const effective = response.data.level;
+        addEvent(requested && requested !== effective ? `Thinking level set to ${effective} (requested ${requested}).` : `Thinking level set to ${effective}.`, "info");
+        requestGitFooterWebuiPayload(tabContext, { force: true });
+      }
       await refreshState(tabContext);
     }
   } catch (error) {

package/tests/mobile-static.test.mjs

@@ -368,6 +368,10 @@ assert.doesNotMatch(app, /Git footer status disabled/, "disabled git footer shou
 assert.doesNotMatch(app, /footerMeta\("runtime"/, "minimal Web UI footer should not render runtime metadata");
 assert.match(app, /statusEntries\.has\(GIT_FOOTER_WEBUI_STATUS_KEY\)/, "optional feature detection should recognize the git-footer-status Web UI payload");
 assert.match(app, /\/git-footer-refresh --webui-silent/, "Web UI should quietly request the extension-owned footer payload when idle and missing");
+assert.match(app, /function requestGitFooterWebuiPayload\(tabContext = activeTabContext\(\), \{ force = false \} = \{\}\)[\s\S]*?!force && statusEntries\.has\(GIT_FOOTER_WEBUI_STATUS_KEY\)/, "git footer payload refresh should support forced refresh even when a live payload already exists");
+assert.match(app, /function gitFooterRelevantStateChanged\(previousState, nextState\)[\s\S]*?previousState\.thinkingLevel !== nextState\.thinkingLevel[\s\S]*?modelStateKey\(previousState\.model\) !== modelStateKey\(nextState\.model\)/, "state refresh should detect model and thinking changes that make the git footer payload stale");
+assert.match(app, /requestGitFooterWebuiPayload\(tabContext, \{ force: shouldRefreshGitFooter \}\)/, "state refresh should force-refresh the git footer when model or thinking state changes");
+assert.match(app, /if \(response\.data\?\.level\) requestGitFooterWebuiPayload\(tabContext, \{ force: true \}\)/, "thinking shortcut should immediately force-refresh the git footer payload");
 assert.match(app, /Loading git footer status…/, "missing git footer payload should show a loading state before declaring the extension unavailable");
 assert.match(app, /GIT_FOOTER_WEBUI_PAYLOAD_CACHE_KEY/, "git footer payloads should be cached across Web UI reloads");
 assert.match(app, /function setOptionalFeatureDisabled\(featureId, disabled\)[\s\S]*clearGitFooterWebuiPayloadCache\(\)/, "changing the git footer feature toggle should invalidate the cached footer payload");

package/tests/native-parity.test.mjs

@@ -147,9 +147,12 @@ assert.match(server, /async function cycleTabModel\(tab, direction = "forward"\)
 assert.match(server, /url\.pathname === "\/api\/model-cycle" && req\.method === "POST"/, "server should expose model-cycle endpoint for shortcuts");
 assert.match(server, /case "\/api\/thinking-cycle":[\s\S]*?type: "cycle_thinking_level"/, "server should expose thinking-cycle endpoint for shortcuts");
 assert.match(server, /async function setThinkingLevelForTab\(tab, level, \{ allowPending = true \} = \{\}\)[\s\S]*?stateIsBusyForSettings\(stateResult\.data\)[\s\S]*?tab\.pendingThinkingLevel = level/, "server should queue side-panel thinking changes while a tab is running");
+assert.match(server, /function eventForTabClients\(tab, event\)[\s\S]*?responseWithPendingThinking\(tab, event\)[\s\S]*?tabId: tab\.id/, "server should decorate SSE state responses with pending thinking before broadcasting to clients");
+assert.match(server, /tab\.pendingThinkingLevel = level;\n\s+broadcastPendingThinkingState\(tab, stateResult\.data\)/, "server should broadcast queued thinking state after assigning the pending level");
 assert.match(server, /const pendingThinkingResponse = await applyPendingThinkingBeforePrompt\(tab\)/, "server should apply queued thinking level before the next prompt");
 assert.match(app, /pendingThinkingLevel[\s\S]*?next prompt/, "frontend should show queued thinking changes as applying on the next prompt");
 assert.match(app, /response\.data\?\.pending[\s\S]*?will apply to the next prompt/, "frontend should announce queued side-panel thinking changes");
+assert.match(app, /response\.data\?\.level[\s\S]*?Thinking level set to/, "frontend should announce effective side-panel thinking changes");
 assert.match(app, /function handleNativeAppShortcut\(event\)/, "frontend should centralize native app shortcut handling");
 assert.match(app, /openNativeModelSelector\(\)/, "Ctrl+L shortcut should open the native model selector");
 assert.match(app, /cycleModelFromShortcut\(event\.shiftKey \? "backward" : "forward"\)/, "Ctrl+P shortcuts should cycle models forward and backward");