npm - @paramms/chat-widget - Versions diffs - 0.1.0 - Mend

@paramms/chat-widget 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (32) hide show

package/README.md +23 -0
package/build-preview.js +136 -0
package/index.html +37 -0
package/package.json +44 -0
package/src/__tests__/chatlist.test.ts +133 -0
package/src/__tests__/connection.test.ts +163 -0
package/src/__tests__/crypto.test.ts +28 -0
package/src/__tests__/history.test.ts +91 -0
package/src/__tests__/ime.test.ts +93 -0
package/src/__tests__/render.test.ts +58 -0
package/src/__tests__/render_new.test.ts +441 -0
package/src/__tests__/store.test.ts +86 -0
package/src/__tests__/x3dh.test.ts +204 -0
package/src/connection.ts +133 -0
package/src/crypto.ts +252 -0
package/src/e2e.ts +161 -0
package/src/history.ts +43 -0
package/src/index.ts +380 -0
package/src/outbox.ts +58 -0
package/src/protocol/actions.ts +114 -0
package/src/protocol/codec.ts +35 -0
package/src/protocol/entities.ts +104 -0
package/src/protocol/frames.ts +86 -0
package/src/protocol/ids.ts +27 -0
package/src/protocol/index.ts +5 -0
package/src/react.tsx +37 -0
package/src/renderer.ts +906 -0
package/src/store.ts +207 -0
package/tsconfig.json +33 -0
package/vercel.json +22 -0
package/vite.config.ts +26 -0
package/vitest.config.ts +2 -0

package/README.md ADDED Viewed

@@ -0,0 +1,23 @@
+# @paramms/chat-widget
+Embeddable guest chat client. Pure `ChatStore` (state) + `ConnectionManager`
+(ws/reconnect/outbox/cursor) + thin `Renderer`, wired by `mount()`.
+`src/protocol/` is a vendored copy of the wire contract (only what the widget uses).
+## Run
+```bash
+npm install
+npm run dev           # Vite demo at http://localhost:5173/ (expects the server on ws://localhost:3000)
+npm run build         # tsc → dist/ (library: importable by the dashboard)
+npm run build:bundle  # vite → standalone browser bundle
+npm test              # vitest (store, connection, jsdom render)
+```
+## Embed
+```html
+<script type="module">
+  import { mount } from '@paramms/chat-widget'
+  mount({ el: document.getElementById('chat'), url: 'wss://your-host', profileId: 'p_hotel', subjectId: 'room-101' })
+</script>
+```

package/build-preview.js ADDED Viewed

@@ -0,0 +1,136 @@
+// build-preview.js — generates dist/index.html after vite library build.
+//
+// Two modes, chosen by URL at load time (not build time):
+//   - relay.paramms.com               → marketing/install-guide landing page
+//   - relay.paramms.com/?profileId=x  → just the widget, in a contained card
+//     (this is the URL the dashboard's "Preview" link and shared test links
+//     use — should look exactly like the widget would look embedded on a
+//     real page, not a full-bleed app)
+import { writeFileSync, mkdirSync } from 'node:fs'
+mkdirSync('dist', { recursive: true })
+const html = `<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Relay Chat Widget</title>
+  <style>
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+    html, body { height: 100%; }
+    body {
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding: 24px;
+    }
+    /* Marketing mode (no profileId in URL): purple gradient + info column */
+    body.marketing {
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    }
+    .container {
+      max-width: 900px;
+      width: 100%;
+      display: flex;
+      gap: 48px;
+      align-items: flex-start;
+    }
+    .info { flex: 1; color: #fff; }
+    .info h1 { font-size: 36px; font-weight: 800; margin-bottom: 12px; }
+    .info p { font-size: 16px; opacity: .85; line-height: 1.6; margin-bottom: 24px; }
+    .snippet {
+      background: rgba(0,0,0,.3);
+      border-radius: 12px;
+      padding: 20px;
+      font-family: 'SF Mono', 'Fira Code', monospace;
+      font-size: 13px;
+      color: #e2e8f0;
+      line-height: 1.6;
+      white-space: pre;
+    }
+    /* Widget-only mode (?profileId=... present): bare contained card on a
+       neutral backdrop — what the widget actually looks like embedded on a
+       real page, just centered for easy viewing/sharing as a test link. */
+    body.widget-only { background: #e9eaee; }
+    /* Both modes use the same card shape for the widget itself */
+    .preview {
+      width: 390px;
+      height: 680px;
+      max-width: calc(100vw - 48px);
+      max-height: calc(100vh - 48px);
+      border-radius: 22px;
+      overflow: hidden;
+      box-shadow: 0 24px 60px rgba(0,0,0,.25);
+      background: #fff;
+      flex-shrink: 0;
+    }
+    #app { width: 100%; height: 100%; }
+  </style>
+</head>
+<body>
+  <div id="marketing-info" class="info" style="display:none">
+    <h1>Relay Chat Widget</h1>
+    <p>Add a real-time chat widget to any website in two lines of code.</p>
+    <div class="snippet">&lt;div id="chat"&gt;&lt;/div&gt;
+&lt;script type="module"&gt;
+  import { mount } from 'https://relay.paramms.com/index.js'
+  mount({
+    el: document.getElementById('chat'),
+    url: 'wss://api.paramms.com/ws',
+    profileId: 'YOUR_PROFILE_ID',
+  })
+&lt;/script&gt;</div>
+  </div>
+  <div id="layout"></div>
+  <script type="module">
+    import { mount } from './index.js'
+    const q = new URLSearchParams(location.search)
+    const profileId = q.get('profileId')
+    const isWidgetOnly = !!profileId
+    document.body.className = isWidgetOnly ? 'widget-only' : 'marketing'
+    const layout = document.getElementById('layout')
+    const preview = document.createElement('div')
+    preview.className = 'preview'
+    const app = document.createElement('div')
+    app.id = 'app'
+    preview.append(app)
+    if (isWidgetOnly) {
+      // Just the contained card, centered on a neutral backdrop.
+      layout.append(preview)
+    } else {
+      // Marketing landing page: info column + card preview, side by side.
+      const container = document.createElement('div')
+      container.className = 'container'
+      const info = document.getElementById('marketing-info')
+      info.style.display = ''
+      container.append(info, preview)
+      layout.append(container)
+    }
+    const wsUrl = q.get('url') || 'wss://api.paramms.com/ws'
+    const subjectId = q.get('subjectId') || undefined
+    mount({
+      el: app,
+      url: wsUrl,
+      profileId: profileId || 'p_hotel',
+      ...(subjectId ? { subjectId } : {}),
+      accent: q.get('accent') || '#4F63F5',
+      showChatList: q.get('chatList') !== 'off',
+    })
+  </script>
+</body>
+</html>`
+writeFileSync('dist/index.html', html)
+console.log('✓ dist/index.html written')

package/index.html ADDED Viewed

@@ -0,0 +1,37 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Relay widget</title>
+  <style>
+    body { margin:0; background:#e9ebef; font-family:system-ui,sans-serif; }
+    #app { width:390px; height:720px; margin:24px auto; border-radius:22px; overflow:hidden;
+           box-shadow:0 18px 50px rgba(0,0,0,.18); background:#fff; }
+  </style>
+</head>
+<body>
+  <div id="app"></div>
+  <script type="module">
+    import { mount } from './src/index.ts'
+    const q = new URLSearchParams(location.search)
+    const subjectId = q.get('subjectId') || undefined
+    const title = q.get('title')
+    mount({
+      el: document.getElementById('app'),
+      url: q.get('url') || import.meta.env.VITE_SERVER_URL || 'ws://localhost:3000/ws',
+      profileId: q.get('profileId') || import.meta.env.VITE_PROFILE_ID || 'p_hotel',
+      ...(subjectId ? { subjectId } : {}),
+      accent: q.get('accent') || '#4F63F5',
+      ...(title ? { subject: {
+        ownerLabel: q.get('owner') || undefined,
+        title,
+        subtitle: q.get('subtitle') || '',
+        status: q.get('status') || '',
+        tags: (q.get('tags') || '').split(',').filter(Boolean),
+      } } : {}),
+      quickReplies: (q.get('quick') || '').split(',').filter(Boolean),
+    })
+  </script>
+</body>
+</html>

package/package.json ADDED Viewed

@@ -0,0 +1,44 @@
+{
+  "name": "@paramms/chat-widget",
+  "version": "0.1.0",
+  "type": "module",
+  "scripts": {
+    "build": "vite build && tsc -p tsconfig.json --emitDeclarationOnly && node build-preview.js",
+    "typecheck": "tsc -p tsconfig.json --noEmit",
+    "test": "vitest run",
+    "dev": "vite",
+    "build:bundle": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@msgpack/msgpack": "^3.0.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.5.0",
+    "vite": "^5.4.0",
+    "vitest": "^2.1.0",
+    "jsdom": "^25.0.0",
+    "react": "^18.3.0",
+    "@types/react": "^18.3.0"
+  },
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./react": {
+      "types": "./dist/react.d.ts",
+      "default": "./dist/react.js"
+    }
+  },
+  "peerDependencies": {
+    "react": ">=18"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    }
+  }
+}

package/src/__tests__/chatlist.test.ts ADDED Viewed

@@ -0,0 +1,133 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi } from 'vitest'
+import { asUserId, asConversationId } from '../protocol/index.js'
+import { ChatStore } from '../store.js'
+import { Renderer, type ChatListEntry } from '../renderer.js'
+const me = 'alice'
+const cid = asConversationId('c1')
+function openedConv() {
+  return {
+    type: 'opened' as const,
+    conversation: {
+      id: cid, tenantId: 't' as never, profileId: 'p' as never,
+      guestId: asUserId(me), participants: [asUserId(me)],
+      state: 'open', lastSeq: 0, createdAt: 0, updatedAt: 0,
+    },
+  }
+}
+describe('Renderer — multi-subject chat list', () => {
+  it('does not show the chat-list button when onListChats is not provided', () => {
+    const root = document.createElement('div')
+    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn() }
+    const store = new ChatStore(asUserId(me))
+    const r = new Renderer(root, me, h)
+    store.apply(openedConv())
+    r.render(store)
+    expect(root.querySelector('.ocw-chatlist-btn')).toBeNull()
+  })
+  it('shows the chat-list button when onListChats is provided', () => {
+    const root = document.createElement('div')
+    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats: vi.fn() }
+    const store = new ChatStore(asUserId(me))
+    const r = new Renderer(root, me, h)
+    store.apply(openedConv())
+    r.render(store)
+    expect(root.querySelector('.ocw-chatlist-btn')).not.toBeNull()
+  })
+  it('opens the panel and renders one item per conversation, newest first as returned by the handler', async () => {
+    const entries: ChatListEntry[] = [
+      { id: 'c_car_a', subjectId: 'car_a', subjectTitle: '2019 Toyota Camry', state: 'open', updatedAt: Date.now() },
+      { id: 'c_car_b', subjectId: 'car_b', subjectTitle: '2021 Honda Civic', state: 'resolved', updatedAt: Date.now() - 1000 },
+    ]
+    const onListChats = vi.fn().mockResolvedValue(entries)
+    const root = document.createElement('div')
+    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
+    const store = new ChatStore(asUserId(me))
+    const r = new Renderer(root, me, h)
+    store.apply(openedConv())
+    r.render(store)
+    const btn = root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement
+    btn.click()
+    expect(onListChats).toHaveBeenCalledTimes(1)
+    await Promise.resolve(); await Promise.resolve()  // flush the .then()
+    expect(root.querySelector('.ocw-chatlist-panel')?.classList.contains('open')).toBe(true)
+    const items = root.querySelectorAll('.ocw-chatlist-item')
+    expect(items.length).toBe(2)
+    expect(items[0]!.textContent).toContain('2019 Toyota Camry')
+    expect(items[1]!.textContent).toContain('2021 Honda Civic')
+  })
+  it('shows a general-enquiry label for an entry with no subjectTitle', async () => {
+    const entries: ChatListEntry[] = [
+      { id: 'c_general', state: 'open', updatedAt: Date.now() },
+    ]
+    const onListChats = vi.fn().mockResolvedValue(entries)
+    const root = document.createElement('div')
+    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
+    const store = new ChatStore(asUserId(me))
+    const r = new Renderer(root, me, h)
+    store.apply(openedConv())
+    r.render(store)
+    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
+    await Promise.resolve(); await Promise.resolve()
+    expect(root.querySelector('.ocw-chatlist-item')?.textContent).toContain('General enquiry')
+  })
+  it('shows an empty state when the guest has no conversations yet', async () => {
+    const onListChats = vi.fn().mockResolvedValue([])
+    const root = document.createElement('div')
+    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
+    const store = new ChatStore(asUserId(me))
+    const r = new Renderer(root, me, h)
+    store.apply(openedConv())
+    r.render(store)
+    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
+    await Promise.resolve(); await Promise.resolve()
+    expect(root.querySelector('.ocw-chatlist-empty')?.textContent).toMatch(/no conversations/i)
+  })
+  it('calls onSwitchChat with the clicked entry and closes the panel', async () => {
+    const entry: ChatListEntry = { id: 'c_car_a', subjectId: 'car_a', subjectTitle: '2019 Toyota Camry', state: 'open', updatedAt: Date.now() }
+    const onListChats = vi.fn().mockResolvedValue([entry])
+    const onSwitchChat = vi.fn()
+    const root = document.createElement('div')
+    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats, onSwitchChat }
+    const store = new ChatStore(asUserId(me))
+    const r = new Renderer(root, me, h)
+    store.apply(openedConv())
+    r.render(store)
+    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
+    await Promise.resolve(); await Promise.resolve()
+    ;(root.querySelector('.ocw-chatlist-item') as HTMLButtonElement).click()
+    expect(onSwitchChat).toHaveBeenCalledWith(entry)
+    expect(root.querySelector('.ocw-chatlist-panel')?.classList.contains('open')).toBe(false)
+  })
+  it('shows a friendly error state if the handler rejects', async () => {
+    const onListChats = vi.fn().mockRejectedValue(new Error('network down'))
+    const root = document.createElement('div')
+    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
+    const store = new ChatStore(asUserId(me))
+    const r = new Renderer(root, me, h)
+    store.apply(openedConv())
+    r.render(store)
+    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
+    await Promise.resolve(); await Promise.resolve()
+    expect(root.querySelector('.ocw-chatlist-empty')?.textContent).toMatch(/could not load/i)
+  })
+})

package/src/__tests__/connection.test.ts ADDED Viewed

@@ -0,0 +1,163 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+import { encodeFrame, decodeFrame, type ClientFrame, type ServerFrame, asConversationId } from '../protocol/index.js'
+import { ConnectionManager, type SocketLike } from '../connection.js'
+class FakeSocket implements SocketLike {
+  binaryType = 'blob'
+  sent: ClientFrame[] = []
+  onopen: (() => void) | null = null
+  onclose: (() => void) | null = null
+  onerror: (() => void) | null = null
+  onmessage: ((ev: { data: ArrayBuffer }) => void) | null = null
+  closed = false
+  send(data: Uint8Array): void { this.sent.push(decodeFrame(data) as ClientFrame) }
+  close(): void { this.closed = true; this.onclose?.() }
+  // test helpers
+  open(): void { this.onopen?.() }
+  deliver(frame: ServerFrame): void {
+    const u8 = encodeFrame(frame)
+    this.onmessage?.({ data: u8.buffer.slice(u8.byteOffset, u8.byteOffset + u8.byteLength) })
+  }
+}
+const open = { type: 'open', profileId: 'p1' as never, subjectId: 's1' as never } as Extract<ClientFrame, { type: 'open' }>
+function setup(cursor = 0) {
+  const sockets: FakeSocket[] = []
+  const received: ServerFrame[] = []
+  const cm = new ConnectionManager({
+    url: 'ws://x', token: 'guest-alice', open,
+    onFrame: (f) => received.push(f),
+    getCursor: () => cursor,
+    socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
+    backoffBaseMs: 10, backoffMaxMs: 20,
+  })
+  return { cm, sockets, received }
+}
+describe('ConnectionManager', () => {
+  beforeEach(() => vi.useFakeTimers())
+  afterEach(() => vi.useRealTimers())
+  it('authenticates first, then opens and flushes the outbox after authed', () => {
+    const { cm, sockets } = setup()
+    cm.connect()
+    const s = sockets[0]!
+    // queue a send before auth completes — it must be buffered, not sent
+    cm.send({ type: 'send', conversationId: asConversationId('c1'), clientMsgId: 'm1', content: { kind: 'text', text: 'hi' } })
+    s.open()
+    expect(s.sent[0]).toMatchObject({ type: 'auth' })
+    expect(s.sent.some(f => f.type === 'send')).toBe(false)  // not before authed
+    s.deliver({ type: 'authed', userId: 'alice' as never, connectionId: 'c' as never })
+    const types = s.sent.map(f => f.type)
+    expect(types).toContain('open')         // open sent on authed
+    expect(types).toContain('send')         // outbox flushed after
+    expect(types.indexOf('open')).toBeLessThan(types.indexOf('send'))
+  })
+  it('syncs from the cursor when a conversation is opened', () => {
+    const { cm, sockets } = setup(5)
+    cm.connect()
+    const s = sockets[0]!
+    s.open()
+    s.deliver({ type: 'authed', userId: 'alice' as never, connectionId: 'c' as never })
+    s.deliver({ type: 'opened', conversation: { id: asConversationId('c9'), tenantId: 't' as never, profileId: 'p1' as never, guestId: 'alice' as never, participants: [], state: 'open', lastSeq: 5, createdAt: 0, updatedAt: 0 } })
+    const sync = s.sent.find(f => f.type === 'sync')
+    expect(sync).toMatchObject({ type: 'sync', conversationId: 'c9', sinceSeq: 5 })
+  })
+  it('reconnects with backoff after an unexpected close', () => {
+    const { cm, sockets } = setup()
+    cm.connect()
+    sockets[0]!.open()
+    sockets[0]!.deliver({ type: 'authed', userId: 'a' as never, connectionId: 'c' as never })
+    sockets[0]!.onclose?.()                 // drop
+    expect(sockets).toHaveLength(1)
+    vi.advanceTimersByTime(50)              // past backoff
+    expect(sockets.length).toBe(2)          // reconnected with a new socket
+    sockets[1]!.open()
+    expect(sockets[1]!.sent[0]).toMatchObject({ type: 'auth' })
+  })
+  it('bounds the outbox so a long outage cannot grow memory unbounded', () => {
+    const sockets: FakeSocket[] = []
+    const cm = new ConnectionManager({
+      url: 'ws://x', token: 't', open,
+      onFrame: () => {}, getCursor: () => 0,
+      socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
+      maxOutbox: 2,
+    })
+    cm.connect()
+    const s = sockets[0]!
+    for (let i = 0; i < 5; i++) cm.send({ type: 'send', conversationId: asConversationId('c1'), clientMsgId: `m${i}`, content: { kind: 'text', text: 'x' } })
+    s.open()
+    s.deliver({ type: 'authed', userId: 'a' as never, connectionId: 'c' as never })
+    const sends = s.sent.filter(f => f.type === 'send')
+    expect(sends).toHaveLength(2)                                  // capped
+    expect((sends[1] as { clientMsgId: string }).clientMsgId).toBe('m4')  // newest kept
+  })
+  it('does not reconnect after an explicit close', () => {
+    const { cm, sockets } = setup()
+    cm.connect()
+    sockets[0]!.open()
+    cm.close()
+    vi.advanceTimersByTime(100)
+    expect(sockets).toHaveLength(1)
+  })
+})
+describe('ConnectionManager — status callbacks', () => {
+  beforeEach(() => { vi.useFakeTimers() })
+  afterEach(() => { vi.useRealTimers() })
+  it('emits "connecting" on first connect', () => {
+    const statuses: string[] = []
+    const sockets: FakeSocket[] = []
+    const cm = new ConnectionManager({
+      url: 'ws://x', token: 't', open,
+      getCursor: () => 0,
+      onFrame: () => {},
+      onStatusChange: (s) => statuses.push(s),
+      socketFactory: (url) => { const s = new FakeSocket(); sockets.push(s); return s },
+    })
+    cm.connect()
+    expect(statuses).toContain('connecting')
+  })
+  it('emits "open" after successful auth', () => {
+    const statuses: string[] = []
+    const sockets: FakeSocket[] = []
+    const cm = new ConnectionManager({
+      url: 'ws://x', token: 't', open,
+      getCursor: () => 0,
+      onFrame: () => {},
+      onStatusChange: (s) => statuses.push(s),
+      socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
+    })
+    cm.connect()
+    sockets[0]!.open()
+    sockets[0]!.deliver({ type: 'authed', userId: 'u1' as never })
+    expect(statuses).toContain('open')
+  })
+  it('emits "reconnecting" on second+ attempt', () => {
+    const statuses: string[] = []
+    const sockets: FakeSocket[] = []
+    const cm = new ConnectionManager({
+      url: 'ws://x', token: 't', open,
+      getCursor: () => 0,
+      onFrame: () => {},
+      onStatusChange: (s) => statuses.push(s),
+      backoffBaseMs: 10,
+      socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
+    })
+    cm.connect()
+    sockets[0]!.open()
+    sockets[0]!.deliver({ type: 'authed', userId: 'u1' as never })
+    sockets[0]!.close()        // triggers reconnect
+    vi.advanceTimersByTime(100)
+    expect(statuses).toContain('reconnecting')
+  })
+})

package/src/__tests__/crypto.test.ts ADDED Viewed

@@ -0,0 +1,28 @@
+import { describe, it, expect } from 'vitest'
+import { generateKeyPair, exportPublicKey, deriveSharedKey, encrypt, decrypt } from '../crypto.js'
+describe('E2E crypto (ECDH + AES-GCM)', () => {
+  it('two parties derive the same key and round-trip a message', async () => {
+    const guest = await generateKeyPair()
+    const agent = await generateKeyPair()
+    const guestPub = await exportPublicKey(guest.publicKey)
+    const agentPub = await exportPublicKey(agent.publicKey)
+    // Guest encrypts to the agent; agent decrypts. Shared secret is symmetric.
+    const kGuest = await deriveSharedKey(guest.privateKey, agentPub)
+    const kAgent = await deriveSharedKey(agent.privateKey, guestPub)
+    const { ct, iv } = await encrypt(kGuest, 'is the price negotiable?')
+    expect(ct).not.toContain('negotiable')                 // actually encrypted
+    const plain = await decrypt(kAgent, ct, iv)
+    expect(plain).toBe('is the price negotiable?')
+  })
+  it('a wrong key cannot decrypt', async () => {
+    const a = await generateKeyPair(); const b = await generateKeyPair(); const c = await generateKeyPair()
+    const kAB = await deriveSharedKey(a.privateKey, await exportPublicKey(b.publicKey))
+    const kAC = await deriveSharedKey(a.privateKey, await exportPublicKey(c.publicKey))
+    const { ct, iv } = await encrypt(kAB, 'secret')
+    await expect(decrypt(kAC, ct, iv)).rejects.toBeTruthy()
+  })
+})

package/src/__tests__/history.test.ts ADDED Viewed

@@ -0,0 +1,91 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+import { asUserId, asConversationId, asMessageId } from '../protocol/index.js'
+import { ChatStore } from '../store.js'
+import { httpBaseFromWsUrl, restoreHistory } from '../history.js'
+describe('httpBaseFromWsUrl', () => {
+  it('strips /ws and converts wss to https', () => {
+    expect(httpBaseFromWsUrl('wss://api.paramms.com/ws')).toBe('https://api.paramms.com')
+  })
+  it('strips /ws and converts ws to http', () => {
+    expect(httpBaseFromWsUrl('ws://localhost:3000/ws')).toBe('http://localhost:3000')
+  })
+  it('handles a trailing slash after /ws', () => {
+    expect(httpBaseFromWsUrl('wss://api.paramms.com/ws/')).toBe('https://api.paramms.com')
+  })
+  it('is a no-op when there is no /ws suffix', () => {
+    expect(httpBaseFromWsUrl('wss://api.paramms.com')).toBe('https://api.paramms.com')
+  })
+})
+describe('restoreHistory', () => {
+  const me = asUserId('g_test')
+  const cid = asConversationId('c1')
+  let fetchMock: ReturnType<typeof vi.fn>
+  beforeEach(() => {
+    fetchMock = vi.fn()
+    vi.stubGlobal('fetch', fetchMock)
+  })
+  afterEach(() => { vi.unstubAllGlobals() })
+  function fakeRenderer() {
+    return { render: vi.fn() } as unknown as import('../renderer.js').Renderer
+  }
+  it('fetches the right URL with the auth header and applies messages to the store', async () => {
+    fetchMock.mockResolvedValue({
+      ok: true,
+      json: async () => ({
+        messages: [
+          { id: asMessageId('m1'), conversationId: cid, seq: 1, senderId: me, senderRole: 'guest', content: { kind: 'text', text: 'hi' }, ts: 1 },
+        ],
+      }),
+    })
+    const store = new ChatStore(me)
+    const renderer = fakeRenderer()
+    await restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)
+    expect(fetchMock).toHaveBeenCalledWith(
+      'https://api.paramms.com/conversations/c1/history',
+      { headers: { authorization: 'Bearer g_test' } },
+    )
+    expect(store.messages()).toHaveLength(1)
+    expect(store.messages()[0]!.content).toEqual({ kind: 'text', text: 'hi' })
+    expect(renderer.render).toHaveBeenCalledWith(store)
+  })
+  it('does nothing (no render) when the response has no messages', async () => {
+    fetchMock.mockResolvedValue({ ok: true, json: async () => ({ messages: [] }) })
+    const store = new ChatStore(me)
+    const renderer = fakeRenderer()
+    await restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)
+    expect(store.messages()).toHaveLength(0)
+    expect(renderer.render).not.toHaveBeenCalled()
+  })
+  it('does nothing when the response is not ok (e.g. 403)', async () => {
+    fetchMock.mockResolvedValue({ ok: false, status: 403, json: async () => ({ error: 'not a participant' }) })
+    const store = new ChatStore(me)
+    const renderer = fakeRenderer()
+    await restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)
+    expect(store.messages()).toHaveLength(0)
+    expect(renderer.render).not.toHaveBeenCalled()
+  })
+  it('swallows network errors without throwing', async () => {
+    fetchMock.mockRejectedValue(new Error('network down'))
+    const store = new ChatStore(me)
+    const renderer = fakeRenderer()
+    await expect(restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)).resolves.toBeUndefined()
+    expect(renderer.render).not.toHaveBeenCalled()
+  })
+  it('swallows a malformed JSON response without throwing', async () => {
+    fetchMock.mockResolvedValue({ ok: true, json: async () => { throw new Error('bad json') } })
+    const store = new ChatStore(me)
+    const renderer = fakeRenderer()
+    await expect(restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)).resolves.toBeUndefined()
+  })
+})