fix(web): reset streaming UI state when background job completes

[leoisadev1]

Summary

• Fixes the bug where the chat UI gets stuck in "streaming" state after a message completes
• The getActiveStreamJob Convex query only returns jobs with "running" or "pending" status
• When a job completes, it returns null - but the useEffect wasn't handling this case properly
• Now properly resets UI state to "ready" when activeStreamJob becomes null

Root Cause

The useEffect in use-persistent-chat.ts had this logic:

if (!activeStreamJob) return; // Just returned early, never reset status!

When the backend stream completed, getActiveStreamJob returned null (because it only queries running/pending jobs), but the UI status remained stuck at "streaming".

Fix

Now when activeStreamJob becomes null AND status is still "streaming" or "submitted", we properly call setStatus("ready") and clean up the streaming state.

Testing

1. Send a message in chat
2. Wait for it to complete
3. UI should properly reset to "ready" state (input enabled, thinking indicator gone)

[railway-app]

🚅 Environment openchat-pr-521 in OpenChat has no services deployed.

[greptile-apps]

Greptile Summary

Fixed a bug where the chat UI remained stuck in "streaming" state after message completion. The root cause was that getActiveStreamJob only returns jobs with "running" or "pending" status - when a job completes, it returns null. The previous code just returned early without resetting the UI state.

Key changes:

• When activeStreamJob becomes null AND status is still "streaming" or "submitted", the UI now properly resets to "ready" state
• Added proper cleanup of streamingRef and stream store via completeStream()
• Added helpful comment explaining the query behavior

Minor issue:

• Lines 164-170 contain unreachable code that checks for "completed"/"error" status, which getActiveStreamJob never returns (confidence: 3/5 - low priority cleanup)

Confidence Score: 4/5

• This PR is safe to merge with minimal risk - it fixes a clear bug in the streaming state management
• The fix correctly addresses the root cause by handling the null case when streams complete. The logic is sound and matches the backend behavior. One point deducted for the unreachable code at lines 164-170 which should be cleaned up but doesn't affect functionality
• No files require special attention - the change is localized and straightforward

Important Files Changed

Filename	Overview
apps/web/src/hooks/use-persistent-chat.ts	Fixed streaming state bug by handling null activeStreamJob; small redundancy with status checks at lines 164-170

Sequence Diagram

sequenceDiagram
    participant User
    participant UI as usePersistentChat Hook
    participant Convex as getActiveStreamJob Query
    participant Backend as Background Stream Action
    participant DB as Convex Database

    User->>UI: Send message
    UI->>Backend: startBackgroundStream()
    Backend->>DB: Insert streamJob (status: "pending")
    Backend->>Backend: Schedule executeStream action
    UI->>UI: setStatus("streaming")
    
    Note over Backend,DB: Stream execution starts
    Backend->>DB: Update job status to "running"
    Backend->>Backend: Fetch from OpenRouter API
    
    loop Streaming chunks
        Backend->>DB: Update job content
        Convex->>UI: Return activeStreamJob (status: "running")
        UI->>UI: Update UI with streamed content
    end
    
    Backend->>DB: completeStream() - Update job status to "completed"
    
    Note over Convex: Query filters out completed jobs
    Convex->>UI: Return null (no running/pending jobs)
    
    Note over UI: BUG FIX: Previously returned early here!
    UI->>UI: Check: status is "streaming" && activeStreamJob is null
    UI->>UI: setStatus("ready") + cleanup
    User->>User: Input re-enabled, UI ready

Loading

[greptile-apps]

Additional Comments (1)

1. apps/web/src/hooks/use-persistent-chat.ts, line 164-171 (link)

   style: Redundant code - this block is unreachable since getActiveStreamJob only returns jobs with "running" or "pending" status, never "completed" or "error". When a job completes, the query returns null and is handled above (lines 154-162).

_{1 file reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}