@origonai/web-chat-sdk 0.1.0

package/src/chat.js

@@ -0,0 +1,376 @@
+/**
+ * Chat Service for Chat SDK
+ * Handles real-time chat functionality without depending on external state
+ * Uses callbacks to communicate state changes to the consumer
+ */
+
+import { fetchEventSource } from '@microsoft/fetch-event-source'
+import { getMessages, authenticate } from './http.js'
+import { getDeviceId, sleep } from './utils.js'
+import { MESSAGE_ROLES } from './constants.js'
+
+/**
+ * @typedef {Object} ChatCallbacks
+ * @property {(messages: Array) => void} [onMessagesUpdate] - Called when messages array should be updated
+ * @property {(isTyping: boolean) => void} [onTyping] - Called when typing status changes
+ * @property {(isLiveAgent: boolean) => void} [onLiveAgentMode] - Called when live agent mode status changes
+ * @property {(sessionId: string) => void} [onSessionUpdate] - Called when session ID is updated
+ */
+
+/**
+ * @typedef {Object} ChatSession
+ * @property {string} sessionId
+ * @property {string} sseUrl
+ * @property {string} [requestId]
+ * @property {boolean} liveAgent
+ * @property {AbortController} [abortController]
+ * @property {string} [lastStreamId]
+ * @property {Array} messages
+ * @property {ChatCallbacks} callbacks
+ */
+
+/**
+ * Create a new chat session
+ * @param {ChatCallbacks} [callbacks={}]
+ * @returns {ChatSession}
+ */
+function createSession(callbacks = {}) {
+  return {
+    credentials: undefined,
+    authenticated: false,
+    configData: undefined,
+    sessionId: undefined,
+    requestId: undefined,
+    sseUrl: undefined,
+    abortController: undefined,
+    liveAgent: false,
+    lastStreamId: undefined,
+    messages: [],
+    callbacks
+  }
+}
+
+/** @type {ChatSession} */
+let currentSession = createSession()
+
+/**
+ * Set callbacks for the current session
+ * @param {ChatCallbacks} callbacks
+ */
+export function setCallbacks(callbacks) {
+  currentSession.callbacks = { ...currentSession.callbacks, ...callbacks }
+}
+
+/**
+ * Initialize the chat session
+ * @param {Object} credentials - Credentials for the chat
+ */
+export function initialize(credentials) {
+  console.log('Initializing chat...', credentials)
+  currentSession.credentials = credentials
+  if (credentials.token) {
+    currentSession.authenticated = true
+  }
+}
+
+/**
+ * Get current chat session credentials
+ * @returns {{ endpoint: string, apiKey: string } | undefined}
+ */
+export function getCredentials() {
+  return currentSession.credentials
+}
+
+/**
+ * Update the session ID and notify via callback
+ * @param {string} sessionId - The new session ID
+ */
+export function updateSessionId(sessionId) {
+  if (sessionId && sessionId !== currentSession.sessionId) {
+    currentSession.sessionId = sessionId
+    currentSession.callbacks.onSessionUpdate?.(sessionId)
+  }
+}
+
+/**
+ * Initiate a new chat session or resume an existing one
+ * @param {Object} credentials - Credentials for the chat
+ * @param {Object} payload - Payload for the chat. It contains sessionId (optional)
+ * @param {string} [payload.sessionId] - Optional session ID to resume
+ * @returns {Promise<{ sessionId: string, messages: Array }>}
+ */
+export async function startChat(payload = {}) {
+  try {
+    console.log('startChat: ', payload, currentSession)
+
+    let configData = null
+    if (!currentSession.authenticated) {
+      configData = await authenticate(currentSession.credentials)
+      currentSession.authenticated = true
+      currentSession.configData = configData
+    } else {
+      configData = currentSession.configData
+    }
+
+    let messages = []
+
+    if (payload.sessionId) {
+      const messagesRes = await getMessages(payload.sessionId)
+      messages = (messagesRes?.sessionHistory ?? []).map((msg) => ({
+        id: msg.id,
+        text: msg.text,
+        role: msg.youtubeVideo
+          ? MESSAGE_ROLES.BOT // for youtube video messages, role is "system" from backend, we need to make it "assistant"
+          : msg.role,
+        timestamp: msg.timestamp,
+        video: msg.youtubeVideo,
+        channel: msg.channel,
+        done: true
+      }))
+    }
+
+    const searchParams = new URLSearchParams({
+      externalId: getExternalId()
+    })
+    currentSession.sseUrl = `${currentSession.credentials.endpoint}?${searchParams.toString()}`
+    currentSession.sessionId = payload.sessionId
+    currentSession.messages = messages
+
+    console.log('Chat initiated successfully')
+
+    return {
+      sessionId: currentSession.sessionId,
+      messages,
+      configData
+    }
+  } catch (error) {
+    console.error(`Failed to start chat: ${error.message}`)
+    cleanup()
+    throw error
+  }
+}
+
+/**
+ * Disconnect from the current chat session
+ */
+export function disconnect() {
+  cleanup()
+}
+
+/**
+ * Clean up the current session
+ */
+function cleanup() {
+  if (currentSession.abortController) {
+    currentSession.abortController.abort()
+  }
+
+  const { callbacks, credentials } = currentSession
+  currentSession = createSession(callbacks)
+  currentSession.credentials = credentials
+
+  console.log('Chat session cleaned up')
+}
+
+export function getExternalId() {
+  if (currentSession.credentials?.externalId) {
+    return currentSession.credentials.externalId
+  }
+  return getDeviceId()
+}
+
+/**
+ * Send a message in the current chat session
+ * @param {{ text: string, html?: string }} message
+ * @returns {Promise<string>}
+ */
+export function sendMessage({ text, html }) {
+  return new Promise((resolve, reject) => {
+    ;(async () => {
+      try {
+        // Add user message
+        const userMessage = {
+          role: MESSAGE_ROLES.USER,
+          text,
+          html,
+          timestamp: new Date().toISOString()
+        }
+        currentSession.messages = [...currentSession.messages, userMessage]
+        currentSession.callbacks.onMessagesUpdate?.([...currentSession.messages])
+
+        await sleep(200)
+
+        // Add loading message for bot if not in live agent mode
+        if (!currentSession.liveAgent) {
+          const loadingMessage = {
+            role: MESSAGE_ROLES.BOT,
+            text: '',
+            loading: true
+          }
+          currentSession.messages = [...currentSession.messages, loadingMessage]
+          currentSession.callbacks.onMessagesUpdate?.([...currentSession.messages])
+        } else {
+          resolve(currentSession.sessionId)
+        }
+
+        const url = new URL(currentSession.sseUrl)
+        if (currentSession.sessionId) {
+          url.searchParams.set('sessionId', currentSession.sessionId)
+        }
+        if (currentSession.requestId) {
+          url.searchParams.set('requestId', currentSession.requestId)
+        }
+
+        currentSession.lastStreamId = undefined
+
+        // Create a new abort controller for this request
+        currentSession.abortController = new AbortController()
+
+        const headers = {
+          'Content-Type': 'application/json'
+        }
+        if (currentSession.credentials?.token) {
+          headers.Authorization = `Bearer ${currentSession.credentials.token}`
+        }
+
+        await fetchEventSource(url.toString(), {
+          method: 'POST',
+          headers,
+          body: JSON.stringify({
+            message: text,
+            html
+          }),
+          signal: currentSession.abortController.signal,
+          onopen: async (response) => {
+            if (!response.ok) {
+              console.error('Failed to send message bad response: ', response)
+              throw new Error('Failed to send message')
+            }
+          },
+          onmessage: (event) => {
+            console.log('Event: ', event)
+            const data = JSON.parse(event.data)
+
+            if (data.status === 'connected') {
+              currentSession.sessionId = data.sessionId
+              currentSession.requestId = data.requestId
+              if (currentSession.liveAgent) {
+                resolve(currentSession.sessionId)
+              }
+            } else if (data.agent) {
+              currentSession.liveAgent = true
+              const { type, data: payload } = data.agent
+
+              switch (type) {
+                case 'typing':
+                  currentSession.callbacks.onTyping?.(true)
+                  currentSession.callbacks.onLiveAgentMode?.(true)
+                  break
+                case 'typingOff':
+                  currentSession.callbacks.onTyping?.(false)
+                  currentSession.callbacks.onLiveAgentMode?.(true)
+                  break
+                case 'message':
+                  if (payload.role !== MESSAGE_ROLES.USER) {
+                    // Remove loading messages and add new message
+                    currentSession.messages = currentSession.messages.filter((msg) => !msg.loading)
+                    currentSession.messages = [...currentSession.messages, payload]
+
+                    const isEnded = payload.action === 'ended' || payload.action === 'left'
+                    if (isEnded) {
+                      currentSession.liveAgent = false
+                    }
+
+                    currentSession.callbacks.onMessagesUpdate?.([...currentSession.messages])
+                    currentSession.callbacks.onLiveAgentMode?.(!isEnded)
+                  }
+                  if (payload.action === 'ended' || payload.action === 'left') {
+                    currentSession.liveAgent = false
+                  }
+                  break
+                default:
+                  break
+              }
+            } else if (data.message !== undefined) {
+              let messages = currentSession.messages
+
+              // If streamId changes, start a new assistant message
+              if (data.streamId !== undefined) {
+                if (currentSession.lastStreamId === undefined) {
+                  currentSession.lastStreamId = data.streamId
+                } else if (data.streamId !== currentSession.lastStreamId) {
+                  currentSession.lastStreamId = data.streamId
+                  messages = [
+                    ...messages,
+                    {
+                      role: MESSAGE_ROLES.BOT,
+                      text: '',
+                      loading: true
+                    }
+                  ]
+                }
+              }
+
+              // Update the last message with new content
+              currentSession.messages = messages.map((msg, index) => {
+                if (index === messages.length - 1) {
+                  return {
+                    ...msg,
+                    loading: false,
+                    text: (msg.text || '') + data.message,
+                    done: data.done ?? msg.done
+                  }
+                }
+                return msg
+              })
+
+              currentSession.callbacks.onMessagesUpdate?.([...currentSession.messages])
+
+              if (data.done) {
+                resolve(currentSession.sessionId)
+              }
+
+              // Store session info for reuse
+              currentSession.sessionId = data.session_id ?? currentSession.sessionId
+              currentSession.requestId = data.requestId ?? currentSession.requestId
+            } else if (data.error) {
+              const errorMessage = 'Failed to connect to the system'
+              currentSession.messages = currentSession.messages.map((msg, index) => {
+                if (index === currentSession.messages.length - 1) {
+                  return {
+                    ...msg,
+                    loading: false,
+                    errorText: errorMessage
+                  }
+                }
+                return msg
+              })
+              currentSession.callbacks.onMessagesUpdate?.([...currentSession.messages])
+              reject(new Error(errorMessage))
+            }
+          },
+          onerror: (error) => {
+            throw error // Rethrow to stop retries
+          },
+          openWhenHidden: true
+        })
+      } catch (error) {
+        console.error('Failed to send message: ', error)
+        const errorMessage = 'Failed to connect to the system'
+        currentSession.messages = currentSession.messages.map((msg, index) => {
+          if (index === currentSession.messages.length - 1) {
+            return {
+              ...msg,
+              loading: false,
+              errorText: errorMessage,
+              done: true
+            }
+          }
+          return msg
+        })
+        currentSession.callbacks.onMessagesUpdate?.([...currentSession.messages])
+        reject(error)
+      }
+    })()
+  })
+}

package/src/constants.js

@@ -0,0 +1,10 @@
+/**
+ * Constants for the Chat SDK
+ */
+
+export const MESSAGE_ROLES = {
+  BOT: 'assistant', // this can be automated or LLM AI Agent response
+  USER: 'user', // this is widget user
+  AGENT: 'agent', // this is human agent (dock side)
+  SYSTEM: 'system' // this is system message, for ex "Agent joined" / "Agent left"
+}

package/src/http.js

@@ -0,0 +1,122 @@
+/**
+ * API Service for Chat SDK
+ * Handles all HTTP requests without depending on external state
+ */
+
+import { getExternalId } from './chat.js'
+
+const AUTHENTICATION_ERROR = 'Something went wrong initializing the chat'
+const INITIALIZATION_ERROR = 'Chat SDK not initialized'
+
+// Module-level configuration
+let _config = {
+  endpoint: null
+}
+
+/**
+ * Configure the API service with endpoint
+ * @param {{ endpoint: string }} credentials
+ */
+export function configure(credentials) {
+  _config = {
+    endpoint: credentials.endpoint
+  }
+}
+
+/**
+ * Get current configuration
+ * @returns {{ endpoint: string | null }}
+ */
+export function getConfig() {
+  return { ..._config }
+}
+
+/**
+ * Authenticate with the chat service
+ * @param {{ endpoint: string }} credentials
+ * @returns {Promise<object>} Authentication response data
+ */
+export async function authenticate(payload) {
+  const { endpoint } = payload
+  const url = `${endpoint}/config`
+
+  const response = await fetch(url, {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json'
+    }
+  })
+
+  if (!response.ok) {
+    const errorPayload = await response.json()
+    throw new Error(errorPayload?.error || AUTHENTICATION_ERROR)
+  }
+
+  const res = await response.json()
+  const data = res.data
+
+  // Store endpoint for subsequent requests
+  configure({ endpoint })
+
+  return data
+}
+
+/**
+ * Get chat history for the current device
+ * @returns {Promise<{ sessions: Array }>}
+ */
+export async function getHistory() {
+  const queryParams = new URLSearchParams({
+    externalId: getExternalId()
+  })
+  const response = await fetchRequest(`/sessions?${queryParams.toString()}`, 'GET')
+
+  if (!response.ok) {
+    throw new Error('Unable to load history, please try again later')
+  }
+
+  return response.json()
+}
+
+/**
+ * Get messages for a specific session
+ * @param {string} sessionId
+ * @returns {Promise<{ sessionHistory: Array }>}
+ */
+export async function getMessages(sessionId) {
+  const queryParams = new URLSearchParams({
+    sessionId
+  })
+  const response = await fetchRequest(`/session?${queryParams.toString()}`, 'GET')
+
+  if (!response.ok) {
+    throw new Error('Unable to load messages, please try again later')
+  }
+
+  return response.json()
+}
+
+/**
+ * Internal fetch request helper
+ * @param {string} pathname
+ * @param {string} method
+ * @param {object|null} body
+ * @returns {Promise<Response>}
+ */
+async function fetchRequest(pathname, method = 'GET', body = null) {
+  const { endpoint } = _config
+
+  if (!endpoint) {
+    throw new Error(INITIALIZATION_ERROR)
+  }
+
+  const url = `${endpoint}${pathname}`
+
+  return fetch(url, {
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    method,
+    body: body ? JSON.stringify(body) : null
+  })
+}

package/src/index.js

@@ -0,0 +1,58 @@
+/**
+ * @origon/chat-sdk
+ *
+ * Chat SDK for Origon/Samespace - provides core chat functionality
+ * without UI dependencies.
+ *
+ * Usage:
+ * ```js
+ * import {
+ *   authenticate,
+ *   initiate,
+ *   sendMessage,
+ *   disconnect,
+ *   getHistory,
+ *   setCallbacks
+ * } from '@origon/chat-sdk'
+ *
+ * // Authenticate first
+ * const config = await authenticate({ endpoint: '...', apiKey: '...' })
+ *
+ * // Set up callbacks for state updates
+ * setCallbacks({
+ *   onMessage: (msg) => console.log('New message:', msg),
+ *   onMessagesUpdate: (messages) => updateUI(messages),
+ *   onTyping: (isTyping) => showTypingIndicator(isTyping),
+ *   onError: (error) => console.error(error)
+ * })
+ *
+ * // Start a chat session
+ * const { sessionId, messages } = await initiate()
+ *
+ * // Send messages
+ * await sendMessage({ text: 'Hello!' })
+ *
+ * // Disconnect when done
+ * disconnect()
+ * ```
+ */
+
+// HTTP API functions
+export { authenticate, getHistory, getMessages, configure } from './http.js'
+
+// Chat functions
+export { initialize, startChat, sendMessage, disconnect, setCallbacks } from './chat.js'
+
+// Call functions
+export {
+  startCall,
+  disconnectCall,
+  toggleMute,
+  getLocalStream,
+  getInboundAudioEnergy,
+  getOutboundAudioEnergy,
+  setCallCallbacks
+} from './call.js'
+
+// Constants
+export { MESSAGE_ROLES } from './constants.js'

package/src/utils.js

@@ -0,0 +1,84 @@
+/**
+ * Utility functions for the Chat SDK
+ */
+
+export function uuidv7() {
+  const timestamp = Date.now()
+  const bytes = new Uint8Array(16)
+  crypto.getRandomValues(bytes)
+
+  // Set timestamp (48 bits)
+  bytes[0] = (timestamp >> 40) & 0xff
+  bytes[1] = (timestamp >> 32) & 0xff
+  bytes[2] = (timestamp >> 24) & 0xff
+  bytes[3] = (timestamp >> 16) & 0xff
+  bytes[4] = (timestamp >> 8) & 0xff
+  bytes[5] = timestamp & 0xff
+
+  // Set version 7 (0111)
+  bytes[6] = (bytes[6] & 0x0f) | 0x70
+
+  // Set variant (10xx)
+  bytes[8] = (bytes[8] & 0x3f) | 0x80
+
+  const hex = [...bytes].map((b) => b.toString(16).padStart(2, '0')).join('')
+  return `${hex.slice(0, 8)}-${hex.slice(8, 12)}-${hex.slice(12, 16)}-${hex.slice(
+    16,
+    20
+  )}-${hex.slice(20)}`
+}
+
+export function getDeviceId() {
+  if (localStorage.getItem('chatDeviceId')) {
+    return localStorage.getItem('chatDeviceId')
+  }
+
+  const deviceId = uuidv7()
+  localStorage.setItem('chatDeviceId', deviceId)
+  return deviceId
+}
+
+export function parseJwt(token) {
+  try {
+    const base64Url = token.split('.')[1]
+    const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/')
+    const jsonPayload = decodeURIComponent(
+      atob(base64)
+        .split('')
+        .map(function (c) {
+          return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
+        })
+        .join('')
+    )
+
+    return JSON.parse(jsonPayload)
+  } catch {
+    return null
+  }
+}
+
+export async function sleep(ms) {
+  return new Promise((resolve) => setTimeout(resolve, ms))
+}
+
+export function getSocketEndpoint(baseUrl) {
+  let socketEndpoint
+  try {
+    const url = new URL(baseUrl)
+    socketEndpoint = `wss://${url.hostname}${url.pathname}/wss`
+  } catch {
+    console.error('Invalid base URL: ', baseUrl)
+  }
+  return socketEndpoint
+}
+
+export function getCallServerEndpoint(baseUrl) {
+  let socketEndpoint
+  try {
+    const url = new URL(baseUrl)
+    socketEndpoint = `wss://${url.hostname}${url.pathname}/audio`
+  } catch {
+    console.error('getCallServerEndpoint: Invalid base URL: ', baseUrl)
+  }
+  return socketEndpoint
+}