botschat 0.1.13 → 0.1.14

package/packages/web/src/App.tsx

@@ -13,7 +13,7 @@ import {
 import { getToken, setToken, setRefreshToken, agentsApi, channelsApi, tasksApi, jobsApi, authApi, messagesApi, modelsApi, meApi, sessionsApi, type ModelInfo } from "./api";
 import { ModelSelect } from "./components/ModelSelect";
 import { BotsChatWSClient, type WSMessage } from "./ws";
-import { initPushNotifications } from "./push";
+import { initPushNotifications, getPendingPushNav, clearPendingPushNav } from "./push";
 import { setupForegroundDetection } from "./foreground";
 import { IconRail } from "./components/IconRail";
 import { Sidebar } from "./components/Sidebar";
@@ -51,6 +51,7 @@ export default function App() {
   const wsClientRef = useRef<BotsChatWSClient | null>(null);
   const handleWSMessageRef = useRef<(msg: WSMessage) => void>(() => {});
   const creatingGeneralRef = useRef(false);
+  const pushNavTargetRef = useRef<string | null>(null);
 
   const [showSettings, setShowSettings] = useState(false);
   const [settingsTab, setSettingsTab] = useState<"general" | "connection" | "security">("general");
@@ -64,6 +65,9 @@ export default function App() {
     return E2eService.subscribe(() => setE2eReady(E2eService.hasKey()));
   }, []);
 
+  // Foreground resume counter — triggers message reload when app returns from background
+  const [foregroundResumeCount, setForegroundResumeCount] = useState(0);
+
   // Responsive layout hooks (must be called unconditionally)
   const isMobile = useIsMobile();
   const mainLayout = useDefaultLayout({ id: "botschat-main" });
@@ -259,6 +263,20 @@ export default function App() {
         dlog.info("Agents", `Loaded ${agents.length} agents`, agents.map((a) => ({ id: a.id, name: a.name, channelId: a.channelId })));
         dispatch({ type: "SET_AGENTS", agents });
         if (agents.length > 0 && !state.selectedAgentId) {
+          // Push notification deep-link takes priority over localStorage
+          const pushNav = pushNavTargetRef.current;
+          if (pushNav) {
+            const m = pushNav.match(/^agent:([^:]+):/);
+            if (m) {
+              const ta = agents.find((a) => a.sessionKey.startsWith(`agent:${m[1]}:`));
+              if (ta) {
+                dlog.info("Push", `Agent select from push nav: ${ta.name} (${ta.id})`);
+                dispatch({ type: "SET_ACTIVE_VIEW", view: "messages" });
+                dispatch({ type: "SELECT_AGENT", agentId: ta.id, sessionKey: ta.sessionKey });
+                return;
+              }
+            }
+          }
           // Restore last selected channel from localStorage if available
           let target = agents[0];
           try {
@@ -371,6 +389,18 @@ export default function App() {
         dlog.info("Sessions", `Loaded ${sessions.length} sessions for channel ${agent.channelId}`);
         dispatch({ type: "SET_SESSIONS", sessions });
         if (sessions.length > 0) {
+          // Push notification deep-link takes priority
+          const pushNav = pushNavTargetRef.current;
+          if (pushNav) {
+            const ts = sessions.find((s) => s.sessionKey === pushNav);
+            if (ts) {
+              dlog.info("Push", `Session select from push nav: ${ts.name} (${ts.id})`);
+              pushNavTargetRef.current = null;
+              clearPendingPushNav();
+              dispatch({ type: "SELECT_SESSION", sessionId: ts.id, sessionKey: ts.sessionKey });
+              return;
+            }
+          }
           // Restore last selected session from localStorage if available
           let target = sessions[0];
           try {
@@ -498,7 +528,7 @@ export default function App() {
         console.error("Failed to load message history:", err);
       });
     return () => { stale = true; };
-  }, [state.user, state.selectedSessionKey, e2eReady]);
+  }, [state.user, state.selectedSessionKey, e2eReady, foregroundResumeCount]);
 
   // Keep a ref to state for use in WS handler (avoids stale closures)
   const stateRef = useRef(state);
@@ -506,6 +536,56 @@ export default function App() {
     stateRef.current = state;
   }, [state]);
 
+  // ---- Push notification deep-link navigation ----
+  const navigateToPushTarget = useCallback((sessionKey: string) => {
+    dlog.info("Push", `Navigating to session: ${sessionKey}`);
+    const baseKey = sessionKey.replace(/:thread:.+$/, "");
+    pushNavTargetRef.current = baseKey;
+
+    const match = baseKey.match(/^agent:([^:]+):/);
+    if (!match) return;
+    const openclawAgentId = match[1];
+
+    const st = stateRef.current;
+    const targetAgent = st.agents.find((a) =>
+      a.sessionKey.startsWith(`agent:${openclawAgentId}:`),
+    );
+    if (!targetAgent) return;
+
+    if (st.activeView !== "messages") {
+      dispatch({ type: "SET_ACTIVE_VIEW", view: "messages" });
+    }
+    if (st.selectedAgentId !== targetAgent.id) {
+      dispatch({
+        type: "SELECT_AGENT",
+        agentId: targetAgent.id,
+        sessionKey: targetAgent.sessionKey,
+      });
+    } else {
+      const targetSession = st.sessions.find((s) => s.sessionKey === baseKey);
+      if (targetSession) {
+        pushNavTargetRef.current = null;
+        clearPendingPushNav();
+        dispatch({
+          type: "SELECT_SESSION",
+          sessionId: targetSession.id,
+          sessionKey: targetSession.sessionKey,
+        });
+      }
+    }
+  }, [dispatch]);
+
+  useEffect(() => {
+    function onPushNav(e: Event) {
+      const sk = (e as CustomEvent).detail?.sessionKey;
+      if (sk) navigateToPushTarget(sk);
+    }
+    window.addEventListener("botschat:push-nav", onPushNav);
+    const pending = getPendingPushNav();
+    if (pending) navigateToPushTarget(pending);
+    return () => window.removeEventListener("botschat:push-nav", onPushNav);
+  }, [navigateToPushTarget]);
+
   // ---- WS message handler ----
   const handleWSMessage = useCallback(
     (msg: WSMessage) => {
@@ -815,10 +895,17 @@ export default function App() {
     wsClientRef.current = client;
 
     // Initialize push notifications and foreground detection
-    initPushNotifications().catch((err) => {
-      dlog.warn("Push", `Push init failed: ${err}`);
+    initPushNotifications()
+      .then(() => {
+        const pending = getPendingPushNav();
+        if (pending) navigateToPushTarget(pending);
+      })
+      .catch((err) => {
+        dlog.warn("Push", `Push init failed: ${err}`);
+      });
+    const cleanupForeground = setupForegroundDetection(client, () => {
+      setForegroundResumeCount((c) => c + 1);
     });
-    const cleanupForeground = setupForegroundDetection(client);
 
     return () => {
       cleanupForeground();

package/packages/web/src/api.ts

@@ -122,7 +122,7 @@ async function request<T>(
 // ---- Auth ----
 export type AuthResponse = { id: string; email: string; token: string; refreshToken?: string; displayName?: string };
 
-export type UserSettings = { defaultModel?: string };
+export type UserSettings = { defaultModel?: string; notifyPreview?: boolean };
 
 export type AuthConfig = {
   emailEnabled: boolean;
@@ -147,7 +147,7 @@ export const authApi = {
 
 // ---- User settings ----
 export const meApi = {
-  updateSettings: (data: { defaultModel?: string }) =>
+  updateSettings: (data: { defaultModel?: string; notifyPreview?: boolean }) =>
     request<{ ok: boolean; settings: UserSettings }>("PATCH", "/me", data),
 };
 

package/packages/web/src/components/ChatWindow.tsx

@@ -650,8 +650,26 @@ export function ChatWindow({ sendMessage }: ChatWindowProps) {
         </div>
       )}
 
-      {/* Session tabs — shown for all agents (including default/General) */}
-      {showSessionTabs && <SessionTabs channelId={channelId} />}
+      {/* Session tabs + model selector (mobile: inline with tabs) */}
+      {showSessionTabs && (
+        <div className="flex items-center flex-shrink-0">
+          <div className="flex-1 min-w-0">
+            <SessionTabs channelId={channelId} />
+          </div>
+          {isMobile && (
+            <div className="flex-shrink-0 pr-2" style={{ borderBottom: "1px solid var(--border)" }}>
+              <ModelSelect
+                value={currentModel ?? ""}
+                onChange={handleModelChange}
+                models={state.models}
+                disabled={!state.openclawConnected}
+                placeholder="No model"
+                compact
+              />
+            </div>
+          )}
+        </div>
+      )}
 
       {/* Messages – flat-row layout (overflow-x-hidden prevents horizontal scroll from long URLs/code) */}
       <div className="flex-1 min-h-0 overflow-y-auto overflow-x-hidden">

package/packages/web/src/components/E2ESettings.tsx

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { E2eService } from "../e2e";
+import { meApi, authApi } from "../api";
 import { AppStateContext } from "../store";
 
 export function E2ESettings() {
@@ -10,6 +11,8 @@ export function E2ESettings() {
   const [busy, setBusy] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [showPassword, setShowPassword] = useState(false);
+  const [notifyPreview, setNotifyPreview] = useState(false);
+  const [notifyPreviewLoading, setNotifyPreviewLoading] = useState(false);
 
   // Subscribe to E2eService changes
   useEffect(() => {
@@ -18,6 +21,28 @@ export function E2ESettings() {
     });
   }, []);
 
+  // Load notifyPreview preference from server
+  useEffect(() => {
+    authApi.me().then((data) => {
+      if (data?.settings?.notifyPreview) {
+        setNotifyPreview(true);
+      }
+    }).catch(() => {});
+  }, []);
+
+  const handleNotifyPreviewToggle = async (enabled: boolean) => {
+    setNotifyPreview(enabled);
+    setNotifyPreviewLoading(true);
+    try {
+      await meApi.updateSettings({ notifyPreview: enabled });
+    } catch (err) {
+      console.error("Failed to update notification preview setting:", err);
+      setNotifyPreview(!enabled);
+    } finally {
+      setNotifyPreviewLoading(false);
+    }
+  };
+
   const handleUnlock = async () => {
     if (!password || !user) return;
     setBusy(true);
@@ -133,9 +158,53 @@ export function E2ESettings() {
         )}
       </div>
 
+      {/* Notification Preview Toggle */}
+      <div className="p-4 rounded-md border" style={{ borderColor: "var(--border)", background: "var(--bg-surface)" }}>
+        <div className="flex items-center justify-between mb-3">
+          <div className="flex items-center gap-2">
+            <svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" style={{ color: "var(--text-secondary)" }}>
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" />
+            </svg>
+            <span className="text-caption font-bold" style={{ color: "var(--text-primary)" }}>
+              Notification Preview
+            </span>
+          </div>
+          <button
+            role="switch"
+            aria-checked={notifyPreview}
+            onClick={() => handleNotifyPreviewToggle(!notifyPreview)}
+            disabled={notifyPreviewLoading}
+            className="relative inline-flex h-6 w-11 items-center rounded-full transition-colors"
+            style={{
+              background: notifyPreview ? "var(--bg-active, #6366f1)" : "var(--border)",
+              opacity: notifyPreviewLoading ? 0.5 : 1,
+            }}
+          >
+            <span
+              className="inline-block h-4 w-4 rounded-full bg-white transition-transform"
+              style={{ transform: notifyPreview ? "translateX(1.375rem)" : "translateX(0.25rem)" }}
+            />
+          </button>
+        </div>
+        <p className="text-caption mb-2" style={{ color: "var(--text-muted)" }}>
+          Show message text in push notifications on iOS and Android.
+        </p>
+        {notifyPreview && (
+          <div className="p-3 rounded border text-caption" style={{ borderColor: "var(--accent-yellow, #d69e2e)", background: "rgba(214, 158, 46, 0.08)", color: "var(--text-secondary)" }}>
+            <p className="font-bold mb-1" style={{ color: "var(--accent-yellow, #d69e2e)" }}>Security trade-off</p>
+            <ul className="list-disc ml-4 space-y-0.5">
+              <li>Message previews will briefly pass through our server to deliver notifications.</li>
+              <li>Previews are <strong>never stored</strong> — they exist only in memory during delivery.</li>
+              <li>Your full message history remains end-to-end encrypted.</li>
+              <li>Web browser notifications are not affected (they decrypt locally).</li>
+            </ul>
+          </div>
+        )}
+      </div>
+
       <div className="text-caption" style={{ color: "var(--text-muted)" }}>
           <p className="font-bold text-red-400 mb-1">Warning:</p>
-          <ul className="list-disc ml-5 space-y-1">
+          <ul className="list-disc ml-4 space-y-1">
               <li>If you lose this password, your encrypted history is lost forever.</li>
               <li>We do not store this password on our servers.</li>
               <li>You must use the same password on all devices to access your history.</li>

package/packages/web/src/components/MobileLayout.tsx

@@ -60,6 +60,13 @@ export function MobileLayout({
   // App.tsx auto-selects an agent on mount — that would navigate to an empty
   // chat screen before sessions have loaded (issue #4a / #4b).
 
+  // Push notification tap → navigate to chat
+  React.useEffect(() => {
+    function onPushNav() { setScreen("chat"); }
+    window.addEventListener("botschat:push-nav", onPushNav);
+    return () => window.removeEventListener("botschat:push-nav", onPushNav);
+  }, []);
+
   // Navigate to thread when thread opens
   React.useEffect(() => {
     if (state.activeThreadId && screen === "chat") {

package/packages/web/src/foreground.ts

@@ -7,9 +7,13 @@ import { Capacitor } from "@capacitor/core";
 import type { BotsChatWSClient } from "./ws";
 import { dlog } from "./debug-log";
 
-export function setupForegroundDetection(wsClient: BotsChatWSClient): () => void {
+export function setupForegroundDetection(
+  wsClient: BotsChatWSClient,
+  onResume?: () => void,
+): () => void {
   const notifyForeground = () => {
     wsClient.send({ type: "foreground.enter" });
+    onResume?.();
     dlog.info("Foreground", "Entered foreground");
   };
 

package/packages/web/src/push.ts

@@ -15,6 +15,25 @@ import { E2eService } from "./e2e";
 
 let initialized = false;
 
+// ---- Push navigation (deep-link on notification tap) ----
+
+let pendingNavSessionKey: string | null = null;
+
+export function getPendingPushNav(): string | null {
+  return pendingNavSessionKey;
+}
+
+export function clearPendingPushNav(): void {
+  pendingNavSessionKey = null;
+}
+
+function firePushNav(sessionKey: string): void {
+  pendingNavSessionKey = sessionKey;
+  window.dispatchEvent(
+    new CustomEvent("botschat:push-nav", { detail: { sessionKey } }),
+  );
+}
+
 // ---- IndexedDB helpers for SW E2E key sync ----
 
 const IDB_NAME = "botschat-sw";
@@ -183,15 +202,20 @@ async function initNativePush(): Promise<void> {
       dlog.error("Push", "Native push registration failed", error);
     });
 
-    // Data-only messages arrive here in foreground — suppress (WS handles it)
     PushNotifications.addListener("pushNotificationReceived", (_notification) => {
       dlog.info("Push", "Foreground native notification (suppressed)");
     });
 
-    // User tapped a notification (app was in background)
     PushNotifications.addListener("pushNotificationActionPerformed", (action) => {
       dlog.info("Push", "Notification tapped", action);
-      // TODO: navigate to specific session from action.notification.data
+      // iOS: custom data nested under "custom" key; Android: at root level
+      const data = action.notification?.data;
+      const sessionKey: string | undefined =
+        data?.custom?.sessionKey || data?.sessionKey;
+      if (sessionKey) {
+        dlog.info("Push", `Push nav target: ${sessionKey}`);
+        firePushNav(sessionKey);
+      }
     });
   } catch (err) {
     dlog.error("Push", "Native push init failed", err);

package/scripts/mock-openclaw.mjs

@@ -99,6 +99,7 @@ let ws = null;
 let pingTimer = null;
 let intentionalClose = false;
 let userId = null;
+let notifyPreview = false;
 
 function buildWsUrl() {
   let host = SERVER_URL.replace(/^https?:\/\//, "");
@@ -266,6 +267,11 @@ function handleMessage(msg) {
       logSend(`[defaultModel.updated] ${msg.defaultModel}`);
       break;
 
+    case "settings.notifyPreview":
+      notifyPreview = msg.enabled === true;
+      logRecv(`[settings.notifyPreview] enabled=${notifyPreview}`);
+      break;
+
     default:
       logWarn(`Unhandled message type: ${msg.type}`);
   }
@@ -299,13 +305,17 @@ async function handleUserMessage(msg) {
       messageId: randomUUID(),
     });
   } else {
-    send({
+    const msgPayload = {
       type: "agent.text",
       sessionKey: msg.sessionKey,
       text: replyText,
       messageId: randomUUID(),
-    });
-    logSend(`[agent.text] "${truncate(replyText, 60)}"`);
+    };
+    if (notifyPreview) {
+      msgPayload.notifyPreview = truncate(replyText, 100);
+    }
+    send(msgPayload);
+    logSend(`[agent.text] "${truncate(replyText, 60)}"${notifyPreview ? " +preview" : ""}`);
   }
 }
 

package/packages/web/dist/assets/index-B9qN5gs6.js

@@ -1 +0,0 @@
-import{r as i}from"./index-Kr85Nj_-.js";const t=i("PushNotifications",{});export{t as PushNotifications};

package/packages/web/dist/assets/index-BQNMGVyU.js

@@ -1,2 +0,0 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/web-vKLTVUul.js","assets/index-Kr85Nj_-.js","assets/index-Bd_RDcgO.css"])))=>i.map(i=>d[i]);
-import{r as p,f as r}from"./index-Kr85Nj_-.js";const o=p("App",{web:()=>r(()=>import("./web-vKLTVUul.js"),__vite__mapDeps([0,1,2])).then(e=>new e.AppWeb)});export{o as App};

package/packages/web/dist/assets/index-Dk33VSnY.js

@@ -1,2 +0,0 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/web-CUXjh_UA.js","assets/index-Kr85Nj_-.js","assets/index-Bd_RDcgO.css"])))=>i.map(i=>d[i]);
-import{r as o,f as t}from"./index-Kr85Nj_-.js";const n=o("SocialLogin",{web:()=>t(()=>import("./web-CUXjh_UA.js"),__vite__mapDeps([0,1,2])).then(e=>new e.SocialLoginWeb)});export{n as SocialLogin};