
# Streaming Status Shows But No Text Appears

## Issue

When using `useChat`, the status changes to "streaming" immediately, but no text appears for several seconds.

## Background

The status changes to "streaming" as soon as the connection to the server is established and streaming begins - this includes metadata streaming, not just the LLM's generated tokens.

## Solution

Create a custom loading state that checks if the last assistant message actually contains content:

```tsx
'use client';

import { useChat } from '@ai-sdk/react';

export default function Page() {
  const { messages, status } = useChat();

  const lastMessage = messages.at(-1);

  const showLoader =
    status === 'streaming' &&
    lastMessage?.role === 'assistant' &&
    lastMessage?.parts?.length === 0;

  return (
    <>
      {messages.map(message => (
        <div key={message.id}>
          {message.role === 'user' ? 'User: ' : 'AI: '}
          {message.parts.map((part, index) =>
            part.type === 'text' ? <span key={index}>{part.text}</span> : null,
          )}
        </div>
      ))}

      {showLoader && <div>Loading...</div>}
    </>
  );
}
```

You can also check for specific part types if you're waiting for something specific:

```tsx
const showLoader =
  status === 'streaming' &&
  lastMessage?.role === 'assistant' &&
  !lastMessage?.parts?.some(part => part.type === 'text');
```

## Related Issues

- [GitHub Issue #7586](https://github.com/vercel/ai/issues/7586)


## Navigation

- [Azure OpenAI Slow to Stream](/v5/docs/troubleshooting/azure-stream-slow)
- [Client-Side Function Calls Not Invoked](/v5/docs/troubleshooting/client-side-function-calls-not-invoked)
- [Server Actions in Client Components](/v5/docs/troubleshooting/server-actions-in-client-components)
- [useChat/useCompletion stream output contains 0:... instead of text](/v5/docs/troubleshooting/strange-stream-output)
- [Streamable UI Errors](/v5/docs/troubleshooting/streamable-ui-errors)
- [Tool Invocation Missing Result Error](/v5/docs/troubleshooting/tool-invocation-missing-result)
- [Streaming Not Working When Deployed](/v5/docs/troubleshooting/streaming-not-working-when-deployed)
- [Streaming Not Working When Proxied](/v5/docs/troubleshooting/streaming-not-working-when-proxied)
- [Getting Timeouts When Deploying on Vercel](/v5/docs/troubleshooting/timeout-on-vercel)
- [Unclosed Streams](/v5/docs/troubleshooting/unclosed-streams)
- [useChat Failed to Parse Stream](/v5/docs/troubleshooting/use-chat-failed-to-parse-stream)
- [Server Action Plain Objects Error](/v5/docs/troubleshooting/client-stream-error)
- [useChat No Response](/v5/docs/troubleshooting/use-chat-tools-no-response)
- [Custom headers, body, and credentials not working with useChat](/v5/docs/troubleshooting/use-chat-custom-request-options)
- [TypeScript performance issues with Zod and AI SDK 5](/v5/docs/troubleshooting/typescript-performance-zod)
- [useChat "An error occurred"](/v5/docs/troubleshooting/use-chat-an-error-occurred)
- [Repeated assistant messages in useChat](/v5/docs/troubleshooting/repeated-assistant-messages)
- [onFinish not called when stream is aborted](/v5/docs/troubleshooting/stream-abort-handling)
- [Tool calling with generateObject and streamObject](/v5/docs/troubleshooting/tool-calling-with-structured-outputs)
- [Abort breaks resumable streams](/v5/docs/troubleshooting/abort-breaks-resumable-streams)
- [streamText fails silently](/v5/docs/troubleshooting/stream-text-not-working)
- [Streaming Status Shows But No Text Appears](/v5/docs/troubleshooting/streaming-status-delay)
- [Stale body values with useChat](/v5/docs/troubleshooting/use-chat-stale-body-data)
- [Type Error with onToolCall](/v5/docs/troubleshooting/ontoolcall-type-narrowing)
- [Unsupported model version error](/v5/docs/troubleshooting/unsupported-model-version)
- [Object generation failed with OpenAI](/v5/docs/troubleshooting/no-object-generated-content-filter)
- [Model is not assignable to type "LanguageModelV1"](/v5/docs/troubleshooting/model-is-not-assignable-to-type)
- [TypeScript error "Cannot find namespace 'JSX'"](/v5/docs/troubleshooting/typescript-cannot-find-namespace-jsx)
- [React error "Maximum update depth exceeded"](/v5/docs/troubleshooting/react-maximum-update-depth-exceeded)
- [Jest: cannot find module '@ai-sdk/rsc'](/v5/docs/troubleshooting/jest-cannot-find-module-ai-rsc)


[Full Sitemap](/sitemap.md)
