Refactor Call Fabric SDK (#983)

* Refactor Call Fabric SDK

* member instance of call.joined event

* fix member instance storing

* fix call.mute api call

* introduce call segments

* remove member instance creation from room subscribed worker

* build fix

* include changeset

* call fabric types file renamed

* fix run worker

* consistent member id

* consistent self member event

* removed wrong member types

* call fabric worker refactor

* emit layout changed event

* video mute and unmute API integration with call fabric

* emit call.joined

* ts typings for call.left event

* vide member worker types update

* refactor member action calling

* more methods include

* fix conversation unit tests

* remove undefined var

* fix e2e tests

.changeset/slimy-seas-serve.md

@@ -0,0 +1,7 @@
+---
+'@signalwire/webrtc': patch
+'@signalwire/core': patch
+'@signalwire/js': patch
+---
+
+Introduce CallSegment and CallFabric worker

internal/e2e-js/playwright.config.ts

@@ -32,6 +32,8 @@ const reattachTests = [
   'roomSessionReattachWrongProtocol.spec.ts',
 ]
 const callfabricTests = [
+  'address.spec.ts',
+  'conversation.spec.ts',
   'relayApp.spec.ts',
   'swml.spec.ts',
   'videoRoom.spec.ts',

internal/e2e-js/tests/callfabric/addresses.spec.ts → internal/e2e-js/tests/callfabric/address.spec.ts

@@ -3,9 +3,9 @@ import { SERVER_URL, createCFClient } from '../../utils'
 
 test.describe('Addresses', () => {
   test('query multiple addresses and single address', async ({
-    createCustomVanillaPage,
+    createCustomPage,
   }) => {
-    const page = await createCustomVanillaPage({ name: '[page]' })
+    const page = await createCustomPage({ name: '[page]' })
     await page.goto(SERVER_URL)
 
     await createCFClient(page)
@@ -17,7 +17,9 @@ test.describe('Addresses', () => {
       const response = await client.address.getAddresses()
       const addressToCompare = response.data[0]
 
-      const address = await client.address.getAddress({ id: addressToCompare.id })
+      const address = await client.address.getAddress({
+        id: addressToCompare.id,
+      })
       return { address, addressToCompare }
     })
 

internal/e2e-js/tests/callfabric/conversation.spec.ts

@@ -0,0 +1,121 @@
+import { SignalWireContract } from '@signalwire/js'
+import { test, expect } from '../../fixtures'
+import { SERVER_URL, createVideoRoom, createCFClient } from '../../utils'
+import { uuid } from '@signalwire/core'
+
+test.describe('Conversation Room', () => {
+  test('send message in a room conversation', async ({ createCustomPage }) => {
+    const page = await createCustomPage({ name: '[page]' })
+    const page2 = await createCustomPage({
+      name: '[page2]',
+    })
+    await page.goto(SERVER_URL)
+    await page2.goto(SERVER_URL)
+
+    await createCFClient(page)
+    await createCFClient(page2)
+
+    const roomName = `e2e-js-convo-room_${uuid()}`
+    await createVideoRoom(roomName)
+
+    const firstMsgEvent = await page.evaluate(
+      ({ roomName }) => {
+        return new Promise(async (resolve) => {
+          // @ts-expect-error
+          const client = window._client as SignalWireContract
+          const addresses = await client.address.getAddresses({
+            displayName: roomName,
+          })
+          const roomAddress = addresses.data[0]
+          const addressId = roomAddress.id
+          client.conversation.subscribe(resolve)
+          client.conversation.sendMessage({
+            text: '1st message from 1st subscriber',
+            addressId,
+          })
+        })
+      },
+      { roomName }
+    )
+
+    // @ts-expect-error
+    expect(firstMsgEvent.type).toBe('message')
+
+    // @ts-expect-error
+    const addressId = firstMsgEvent.address_id
+
+    const secondMsgEventPromiseFromPage1 = page.evaluate(() => {
+      return new Promise((resolve) => {
+        // @ts-expect-error
+        const client = window._client
+        client.conversation.subscribe(resolve)
+      })
+    })
+
+    const firstMsgEventFromPage2 = await page2.evaluate(
+      ({ addressId }) => {
+        return new Promise(async (resolve) => {
+          // @ts-expect-error
+          const client = window._client as SignalWireContract
+          await client.connect()
+          client.conversation.subscribe(resolve)
+          const result = await client.conversation.getConversations()
+          const convo = result.data.filter((c) => c.id == addressId)[0]
+          convo.sendMessage({
+            text: '1st message from 2nd subscriber',
+          })
+        })
+      },
+      { addressId }
+    )
+
+    const secondMsgEventFromPage1 = await secondMsgEventPromiseFromPage1
+    expect(secondMsgEventFromPage1).not.toBeUndefined()
+
+    // @ts-expect-error
+    expect(secondMsgEventFromPage1.type).toBe('message')
+
+    expect(firstMsgEventFromPage2).not.toBeUndefined()
+
+    // @ts-expect-error
+    expect(firstMsgEventFromPage2.type).toBe('message')
+
+    const messages = await page.evaluate(
+      async ({ addressId }) => {
+        // @ts-expect-error
+        const client = window._client as SignalWireContract
+        const result = await client.conversation.getConversations()
+        const convo = result.data.filter((c) => c.id == addressId)[0]
+        return await convo.getMessages({})
+      },
+      { addressId }
+    )
+
+    expect(messages).not.toBeUndefined()
+
+    expect(messages.data.length).toEqual(2)
+    expect(messages.data[0]).toMatchObject({
+      conversation_id: addressId,
+      details: {},
+      id: expect.anything(),
+      kind: null,
+      subtype: 'chat',
+      text: '1st message from 2nd subscriber',
+      ts: expect.anything(),
+      type: 'message',
+      user_id: expect.anything(),
+    })
+
+    expect(messages.data[1]).toMatchObject({
+      conversation_id: addressId,
+      details: {},
+      id: expect.anything(),
+      kind: null,
+      subtype: 'chat',
+      text: '1st message from 1st subscriber',
+      ts: expect.anything(),
+      type: 'message',
+      user_id: expect.anything(),
+    })
+  })
+})

internal/e2e-js/utils.ts

@@ -180,8 +180,8 @@ export const createTestRoomSessionWithJWT = async (
   )
 }
 
-export const createCFClient = async (page: Page, sat?: string) => {
-  if (!sat) sat = await createTestSATToken()
+export const createCFClient = async (page: Page) => {
+  const sat = await createTestSATToken()
   if (!sat) {
     console.error('Invalid SAT. Exiting..')
     process.exit(4)
@@ -279,13 +279,11 @@ export const createTestSATToken = async () => {
       }),
     }
   )
-  console.log(response.body.read().toString())
   const data = await response.json()
   return data.token
 }
 
-
-export const createVideoRoom= async (name?: string) => {
+export const createVideoRoom = async (name?: string) => {
   const response = await fetch(
     `https://${process.env.API_HOST}/api/fabric/resources/video_rooms`,
     {