#31 most commonruntime/UIv0CursorWindsurfBolt.new

You're importing a component that needs useState (add "use client")

You're importing a component that needs useState. This React hook only works in a client component. To fix, mark the file (or its parent) with the "use client" directive.

Got a slightly different error? Paste the exact message and get a fix prompt tailored to it.

Paste your error →

What it means

Next.js splits code into server parts and browser parts. A piece that needs to react to clicks or remember things was placed on the server side without being marked as a browser component.

How to fix it: paste this prompt into your AI builder

Fix prompt for Bolt, Cursor, v0, Windsurf
Next.js says a component needs "use client". Add the 'use client' directive at the top of the specific file that uses hooks or event handlers (not the whole layout unless necessary). If a server component (page/layout) needs data, keep data fetching there and pass it as props to the client component. Don't convert unrelated files to client components.

If the AI can't fix it: manual steps

  1. Add the line 'use client' (with quotes) as the very first line of the file named in the error.

Where this happens

Seen in these AI app builders and editors:

v0CursorWindsurfBolt.new

Sources

Related runtime/UI errors

Still stuck? Paste your full error and UnstuckMyVibe will match it and hand you the exact fix prompt.

Fix my error →