@linktr.ee/messaging-react 1.36.0-rc-1777522205 → 1.37.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linktr.ee/messaging-react",
-  "version": "1.36.0-rc-1777522205",
+  "version": "1.37.0",
   "description": "React messaging components built on messaging-core for web applications",
   "type": "module",
   "main": "dist/index.js",
@@ -34,7 +34,7 @@
   },
   "dependencies": {
     "@linktr.ee/component-library": "11.8.6",
-    "@linktr.ee/messaging-core": "^1.7.1",
+    "@linktr.ee/messaging-core": "^1.8.0",
     "@phosphor-icons/react": "^2.1.10"
   },
   "devDependencies": {

package/src/providers/MessagingProvider.test.tsx

@@ -0,0 +1,126 @@
+import { StreamChatService } from '@linktr.ee/messaging-core'
+import { render, waitFor, act } from '@testing-library/react'
+import React from 'react'
+import type { StreamChat } from 'stream-chat'
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+import { MessagingProvider, useMessagingContext } from './MessagingProvider'
+
+// Stub stream-chat-react's <Chat /> so we don't need a real, fully-wired
+// StreamChat instance just to verify provider state.
+vi.mock('stream-chat-react', () => ({
+  Chat: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+}))
+
+const setupServiceMock = () => {
+  const connectUser = vi.fn(
+    async () => ({ userID: 'mock' }) as unknown as StreamChat
+  )
+  const disconnectUser = vi.fn(async () => undefined)
+
+  vi.spyOn(StreamChatService.prototype, 'connectUser').mockImplementation(
+    connectUser
+  )
+  vi.spyOn(StreamChatService.prototype, 'disconnectUser').mockImplementation(
+    disconnectUser
+  )
+
+  return { connectUser, disconnectUser }
+}
+
+const Probe: React.FC<{ onState: (state: unknown) => void }> = ({
+  onState,
+}) => {
+  const ctx = useMessagingContext()
+  React.useEffect(() => {
+    onState({
+      isConnected: ctx.isConnected,
+      isLoading: ctx.isLoading,
+      error: ctx.error,
+      hasClient: !!ctx.client,
+    })
+  }, [ctx, onState])
+  return null
+}
+
+describe('MessagingProvider', () => {
+  beforeEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  it('connects a guest user through the underlying service', async () => {
+    const { connectUser } = setupServiceMock()
+    const states: unknown[] = []
+
+    render(
+      <MessagingProvider
+        apiKey="mock-api-key"
+        user={{ type: 'guest', id: 'guest-1', name: 'Guest' }}
+        serviceConfig={{
+          createChannel: async () => ({ channelId: 'ch-1' }),
+        }}
+      >
+        <Probe onState={(s) => states.push(s)} />
+      </MessagingProvider>
+    )
+
+    await waitFor(() => expect(connectUser).toHaveBeenCalledTimes(1))
+    expect(connectUser).toHaveBeenCalledWith({
+      type: 'guest',
+      id: 'guest-1',
+      name: 'Guest',
+    })
+
+    await waitFor(() => {
+      const last = states[states.length - 1] as { isConnected: boolean }
+      expect(last.isConnected).toBe(true)
+    })
+  })
+
+  it('disconnects and reconnects when remounted with a new key', async () => {
+    const { connectUser, disconnectUser } = setupServiceMock()
+
+    const guestUser = {
+      type: 'guest' as const,
+      id: 'guest-1',
+      name: 'Guest',
+    }
+    const authedUser = { id: 'user-1', name: 'Authed User' }
+
+    const { rerender } = render(
+      <MessagingProvider
+        key="guest"
+        apiKey="mock-api-key"
+        user={guestUser}
+        serviceConfig={{
+          createChannel: async () => ({ channelId: 'ch-1' }),
+        }}
+      >
+        <div />
+      </MessagingProvider>
+    )
+
+    await waitFor(() => expect(connectUser).toHaveBeenCalledTimes(1))
+    expect(connectUser).toHaveBeenLastCalledWith(guestUser)
+
+    await act(async () => {
+      rerender(
+        <MessagingProvider
+          key="authed"
+          apiKey="mock-api-key"
+          user={authedUser}
+          serviceConfig={{
+            fetchToken: async () => 'token',
+            createChannel: async () => ({ channelId: 'ch-1' }),
+          }}
+        >
+          <div />
+        </MessagingProvider>
+      )
+    })
+
+    await waitFor(() => expect(disconnectUser).toHaveBeenCalled())
+    await waitFor(() => expect(connectUser).toHaveBeenCalledTimes(2))
+    expect(connectUser).toHaveBeenLastCalledWith(authedUser)
+  })
+})