Merge pull request #3048 from stbenjam/websocket-wait

Wait for websocket before sending message

Author: openshift-merge-bot[bot]

sippy-ng/src/chat/AskSippyButton.js

@@ -2,11 +2,7 @@ import { AutoAwesome as AutoAwesomeIcon } from '@mui/icons-material'
 import { Button, Tooltip } from '@mui/material'
 import { CapabilitiesContext } from '../App'
 import { makeStyles } from '@mui/styles'
-import {
-  useDrawer,
-  useSessionActions,
-  useWebSocketActions,
-} from './store/useChatStore'
+import { useDrawer, useSessionActions } from './store/useChatStore'
 import PropTypes from 'prop-types'
 import React, { useContext } from 'react'
 
@@ -50,7 +46,6 @@ const useStyles = makeStyles((theme) => ({
 export default function AskSippyButton({ question, tooltip }) {
   const { openDrawer } = useDrawer()
   const { startNewSession } = useSessionActions()
-  const { sendMessage } = useWebSocketActions()
   const capabilities = useContext(CapabilitiesContext)
   const classes = useStyles()
 
@@ -59,11 +54,8 @@ export default function AskSippyButton({ question, tooltip }) {
   }
 
   const handleClick = () => {
-    startNewSession()
     openDrawer()
-    setTimeout(() => {
-      sendMessage(question)
-    }, 100)
+    startNewSession(question)
   }
 
   const button = (

sippy-ng/src/chat/store/sessionSlice.js

@@ -76,7 +76,8 @@ export const createSessionSlice = (set, get) => ({
   },
 
   // Start a new session (find empty or create new)
-  startNewSession: () => {
+  // If initialMessage is provided, waits for websocket connection and sends it
+  startNewSession: (initialMessage = null) => {
     const {
       sessions,
       activeSessionId,
@@ -85,6 +86,8 @@ export const createSessionSlice = (set, get) => ({
       setCurrentThinking,
       setError,
       setIsTyping,
+      connectionState,
+      sendMessage,
     } = get()
 
     // Try to find an existing empty session
@@ -106,6 +109,27 @@ export const createSessionSlice = (set, get) => ({
     setCurrentThinking(null)
     setError(null)
     setIsTyping(false)
+
+    // If an initial message is provided, wait for connection and send it
+    if (initialMessage) {
+      const maxAttempts = 50 // 5 seconds max (50 * 100ms)
+      let attempts = 0
+
+      const waitForConnection = () => {
+        const store = get()
+        if (store.connectionState === 'connected') {
+          sendMessage(initialMessage)
+        } else if (attempts < maxAttempts) {
+          attempts++
+          setTimeout(waitForConnection, 100)
+        } else {
+          console.error('Failed to connect to websocket after 5 seconds')
+          setError('Failed to connect to chat service')
+        }
+      }
+
+      waitForConnection()
+    }
   },
 
   // Delete a session