fix: block on validate failure

Author: brandonkachen

cli/src/chat.tsx

@@ -58,7 +58,7 @@ import type { User } from './utils/auth'
 import type { ToolName } from '@codebuff/sdk'
 import type { ScrollBoxRenderable } from '@opentui/core'
 
-type ChatVariant = 'ai' | 'user' | 'agent'
+type ChatVariant = 'ai' | 'user' | 'agent' | 'error'
 
 const MAX_VIRTUALIZED_TOP_LEVEL = 60
 const VIRTUAL_OVERSCAN = 12

cli/src/hooks/use-agent-validation.ts

@@ -13,7 +13,7 @@ export type ValidationError = {
 type UseAgentValidationResult = {
   validationErrors: ValidationError[]
   isValidating: boolean
-  validate: () => Promise<void>
+  validate: () => Promise<boolean>
 }
 
 /**
@@ -28,14 +28,15 @@ export const useAgentValidation = (
   const [isValidating, setIsValidating] = useState(false)
 
   // Validate agents and update state
-  const validate = useCallback(async () => {
+  // Returns true if validation passes, false if it fails
+  const validate = useCallback(async (): Promise<boolean> => {
     setIsValidating(true)
 
     try {
       const agentDefinitions = loadAgentDefinitions()
       logger.debug(
         { agentCount: agentDefinitions.length },
-        'Validating agents...',
+        'Validating agents before message send...',
       )
 
       const validationResult = await validateAgents(agentDefinitions, {
@@ -45,16 +46,20 @@ export const useAgentValidation = (
       if (validationResult.success) {
         logger.debug('Agent validation passed')
         setValidationErrors([])
+        return true
       } else {
         logger.debug(
           { errorCount: validationResult.validationErrors.length },
           'Agent validation found errors',
         )
         setValidationErrors(validationResult.validationErrors)
+        return false
       }
     } catch (error) {
       logger.error({ error }, 'Agent validation failed with exception')
       // Don't update validation errors on exception - keep previous state
+      // Return false to block message sending on validation errors
+      return false
     } finally {
       setIsValidating(false)
     }

cli/src/hooks/use-message-renderer.tsx

@@ -270,9 +270,10 @@ export const useMessageRenderer = (
 
       const isAi = message.variant === 'ai'
       const isUser = message.variant === 'user'
-      const lineColor = isAi ? theme.aiLine : theme.userLine
-      const textColor = isAi ? theme.messageAiText : theme.messageUserText
-      const timestampColor = isAi ? theme.timestampAi : theme.timestampUser
+      const isError = message.variant === 'error'
+      const lineColor = isError ? 'red' : isAi ? theme.aiLine : theme.userLine
+      const textColor = isError ? 'red' : isAi ? theme.messageAiText : theme.messageUserText
+      const timestampColor = isError ? 'red' : isAi ? theme.timestampAi : theme.timestampUser
       const estimatedMessageWidth = availableWidth
       const codeBlockWidth = Math.max(10, estimatedMessageWidth - 8)
       const paletteForMessage: MarkdownPalette = {

cli/src/hooks/use-send-message.ts

@@ -97,7 +97,7 @@ interface UseSendMessageOptions {
   setCanProcessQueue: (can: boolean) => void
   abortControllerRef: React.MutableRefObject<AbortController | null>
   agentId?: string
-  onBeforeMessageSend?: () => Promise<void>
+  onBeforeMessageSend?: () => Promise<boolean>
   setMainAgentStreamStartTime: (time: number | null) => void
 }
 
@@ -247,11 +247,43 @@ export const useSendMessage = ({
 
   const sendMessage = useCallback(
     async (content: string, params: { agentMode: 'FAST' | 'MAX' }) => {
-      // Trigger validation before sending message (non-blocking)
+      // Validate agents before sending message (blocking)
       if (onBeforeMessageSend) {
-        onBeforeMessageSend().catch((error) => {
-          logger.error({ error }, 'Validation before message send failed')
-        })
+        try {
+          const validationPassed = await onBeforeMessageSend()
+
+          if (!validationPassed) {
+            logger.warn('Message send blocked due to agent validation errors')
+
+            // Add an error message to the chat
+            const errorMessage: ChatMessage = {
+              id: `error-${Date.now()}`,
+              variant: 'error',
+              content: 'Cannot send message: Please fix agent validation errors first. Check the validation errors displayed above.',
+              timestamp: formatTimestamp(),
+            }
+
+            applyMessageUpdate((prev) => [...prev, errorMessage])
+            await yieldToEventLoop()
+
+            return
+          }
+        } catch (error) {
+          logger.error({ error }, 'Validation before message send failed with exception')
+
+          // Add an error message to the chat
+          const errorMessage: ChatMessage = {
+            id: `error-${Date.now()}`,
+            variant: 'error',
+            content: 'Cannot send message: Agent validation failed unexpectedly.',
+            timestamp: formatTimestamp(),
+          }
+
+          applyMessageUpdate((prev) => [...prev, errorMessage])
+          await yieldToEventLoop()
+
+          return
+        }
       }
 
       const { agentMode } = params