canopy-ui 0.15.3 → 0.16.1

package/LICENSE

@@ -0,0 +1,29 @@
+BSD 3-Clause License
+
+Copyright (c) 2026, Dimagi Inc., and individual contributors.
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+3. Neither the name of the copyright holder nor the names of its
+   contributors may be used to endorse or promote products derived from
+   this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "canopy-ui",
-  "version": "0.15.3",
+  "version": "0.16.1",
+  "license": "BSD-3-Clause",
   "type": "module",
   "repository": {
     "type": "git",

package/src/chat/ToolCallPair.tsx

@@ -50,7 +50,7 @@ export function ToolCallPair({ use, result, forceOpen }: Props) {
           {name}
         </span>
         {preview && (
-          <span className="truncate text-xs italic text-muted-foreground">
+          <span className="truncate font-mono text-xs text-muted-foreground">
             · {preview}
           </span>
         )}

package/src/chat/useSessionSocket.ticket.test.tsx

@@ -0,0 +1,75 @@
+// @vitest-environment jsdom
+import { act, renderHook } from '@testing-library/react'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { useSessionSocket } from './useSessionSocket'
+
+/**
+ * An async URL builder: a fresh one-time ticket per connection, so a token
+ * never rides the socket URL (URLs land in access logs). A ticket works once,
+ * so a reconnect must ask again rather than reuse the first URL.
+ */
+
+class FakeSocket {
+  static opened: FakeSocket[] = []
+  onopen: (() => void) | null = null
+  onmessage: ((e: { data: string }) => void) | null = null
+  onclose: (() => void) | null = null
+  onerror: (() => void) | null = null
+  readyState = 0
+  constructor(public url: string) {
+    FakeSocket.opened.push(this)
+  }
+  send() {}
+  close() {}
+}
+
+beforeEach(() => {
+  FakeSocket.opened = []
+  vi.stubGlobal('WebSocket', FakeSocket)
+  vi.useFakeTimers()
+})
+afterEach(() => {
+  vi.useRealTimers()
+  vi.unstubAllGlobals()
+})
+
+describe('an async socket URL', () => {
+  it('opens the socket once the ticket arrives, and asks again on reconnect', async () => {
+    let n = 0
+    const wsUrl = vi.fn(async () => `wss://h/ws/canopy-sessions/s1/?ticket=t${++n}`)
+    renderHook(() => useSessionSocket({ sessionId: 's1', wsUrl }))
+    await act(async () => { await Promise.resolve() })
+    expect(FakeSocket.opened.map((s) => s.url)).toEqual(['wss://h/ws/canopy-sessions/s1/?ticket=t1'])
+
+    await act(async () => {
+      FakeSocket.opened[0].onclose?.()
+      await vi.runAllTimersAsync()
+    })
+    expect(FakeSocket.opened.map((s) => s.url)).toEqual([
+      'wss://h/ws/canopy-sessions/s1/?ticket=t1',
+      'wss://h/ws/canopy-sessions/s1/?ticket=t2',
+    ])
+  })
+
+  it('opens nothing for a session it has already left', async () => {
+    let release: (url: string) => void = () => {}
+    const wsUrl = () => new Promise<string>((resolve) => { release = resolve })
+    const { unmount } = renderHook(() => useSessionSocket({ sessionId: 's1', wsUrl }))
+    unmount()
+    await act(async () => { release('wss://h/late'); await Promise.resolve() })
+    expect(FakeSocket.opened).toHaveLength(0)
+  })
+
+  it('retries when fetching the ticket fails', async () => {
+    let calls = 0
+    const wsUrl = async () => {
+      calls += 1
+      if (calls === 1) throw new Error('network')
+      return 'wss://h/ok'
+    }
+    renderHook(() => useSessionSocket({ sessionId: 's1', wsUrl }))
+    await act(async () => { await vi.runAllTimersAsync() })
+    expect(FakeSocket.opened.map((s) => s.url)).toEqual(['wss://h/ok'])
+  })
+})

package/src/chat/useSessionSocket.ts

@@ -69,8 +69,13 @@ export interface UseSessionSocketOptions {
    * App-injected WebSocket URL builder. The kit never imports app routing/base
    * helpers; the container passes one (e.g. canopy's `wsUrl`). Called with the
    * relative path `ws/canopy-sessions/${sessionId}/`.
+   *
+   * May return a Promise: it is called before EVERY connection, reconnects
+   * included, so a container can fetch a one-time ticket each time and keep
+   * its token off the URL (canopy-client's `sessionSocketTicketUrl`). A
+   * rejected promise is treated like a dropped connection and retried.
    */
-  wsUrl: (path: string) => string;
+  wsUrl: (path: string) => string | Promise<string>;
   /**
    * Optional side-effect callback fired when the server broadcasts a
    * `session.title_updated` (replaces ace's `notifySessionsUpdated`). The kit
@@ -238,6 +243,7 @@ export function useSessionSocket({
   const draftDebounceRef = useRef<number | null>(null);
   const pendingDraftBodyRef = useRef<string | null>(null);
   const closedByUserRef = useRef(false);
+  const generationRef = useRef(0);
   const onTitleUpdatedRef = useRef(onTitleUpdated);
   const onUnknownEventRef = useRef(onUnknownEvent);
   // A ref, like the callbacks above: `connect` is a stable callback with empty
@@ -426,11 +432,36 @@ export function useSessionSocket({
 
   const connect = useCallback(() => {
     if (closedByUserRef.current) return;
+    // Which mount this attempt belongs to. An async URL may resolve after the
+    // hook re-mounted for another session; it must not open a socket then.
+    const generation = generationRef.current;
     // A half-read tool call from the previous connection must not be completed
     // by an ARGS event from this one — the ids are per-stream.
     resetAguiState();
     const path = `ws/canopy-sessions/${sessionId}/`;
     const built = wsUrl(path);
+    if (typeof built !== "string") {
+      // An async builder (a fresh one-time ticket per connection). If it fails,
+      // retry on the same backoff a dropped socket uses; if the hook was torn
+      // down meanwhile, open nothing.
+      built.then(
+        (url) => {
+          if (!closedByUserRef.current && generation === generationRef.current) openSocket(url);
+        },
+        () => {
+          if (closedByUserRef.current || generation !== generationRef.current) return;
+          const attempt = reconnectAttemptRef.current;
+          reconnectAttemptRef.current = attempt + 1;
+          window.setTimeout(connect,
+            RECONNECT_DELAYS_MS[Math.min(attempt, RECONNECT_DELAYS_MS.length - 1)]);
+        },
+      );
+      return;
+    }
+    openSocket(built);
+
+    // Declared inside `connect` so it shares exactly this render's handlers.
+    function openSocket(built: string) {
     const ws = new WebSocket(
       protocolRef.current === "ag-ui" ? withAguiProtocol(built) : built,
     );
@@ -506,6 +537,7 @@ export function useSessionSocket({
     ws.onerror = () => {
       // onclose will fire next; nothing to do here.
     };
+    }
   }, [applyEvent, rescueSend, send, sessionId, wsUrl]);
 
   useEffect(() => {
@@ -513,6 +545,7 @@ export function useSessionSocket({
     reconnectAttemptRef.current = 0;
     connect();
     return () => {
+      generationRef.current += 1;
       closedByUserRef.current = true;
       if (heartbeatTimerRef.current != null) {
         window.clearInterval(heartbeatTimerRef.current);