Next.js App Router で useState が使えないエラーが解消できない

$ npx next build
▲ Next.js 15.5.25
 
   Creating an optimized production build ...
Failed to compile.
 
./app/Counter.js
Error:   x 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.
  |
  |  Learn more: https://nextjs.org/docs/app/api-reference/directives/use-client
  |
 
   ,-[/tmp/tmp.mTiXS4AI3F/app/Counter.js:1:1]
 1 | import { useState } from "react";
   :          ^^^^^^^^
 2 | 
 3 | export function Counter() {
 4 |   const [n, setN] = useState(0);
   `----
 
Import trace for requested module:
./app/Counter.js
./app/page.js
 
> Build failed because of webpack errors
$ echo $?
1

$ npx next build
▲ Next.js 15.5.25
 
   Creating an optimized production build ...
Failed to compile.
 
./app/Counter.js
Error:   x The "use client" directive must be placed before other expressions. Move it to the top of the file to resolve this issue.
   ,-[/tmp/tmp.mTiXS4AI3F/app/Counter.js:2:1]
 1 | import { useState } from "react";
 2 | "use client";
   : ^^^^^^^^^^^^^
 3 | 
 4 | export function Counter() {
 5 |   const [n, setN] = useState(0);
   `----
  x 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.
  |
  |  Learn more: https://nextjs.org/docs/app/api-reference/directives/use-client
  |
 
   ,-[/tmp/tmp.mTiXS4AI3F/app/Counter.js:1:1]
 1 | import { useState } from "react";
   :          ^^^^^^^^
 2 | "use client";
 3 | 
 4 | export function Counter() {
   `----
 
Import trace for requested module:
./app/Counter.js
./app/page.js
 
> Build failed because of webpack errors
$ echo $?
1

$ npx next build
▲ Next.js 15.5.25
 
   Creating an optimized production build ...
 ✓ Compiled successfully in 1976ms
   Linting and checking validity of types ...
   Collecting page data ...
   Generating static pages (0/4) ...
   Generating static pages (1/4) 
   Generating static pages (2/4) 
   Generating static pages (3/4) 
 ✓ Generating static pages (4/4)
   Finalizing page optimization ...
   Collecting build traces ...
 
Route (app)                                 Size  First Load JS
┌ ○ /                                      272 B         103 kB
└ ○ /_not-found                            991 B         103 kB
+ First Load JS shared by all             102 kB
  ├ chunks/255-37e0f0325134c4d7.js       46.4 kB
  ├ chunks/4bd1b696-c023c6e3521b1417.js  54.2 kB
  └ other shared chunks (total)          1.88 kB
 
○  (Static)  prerendered as static content
$ echo $?
0

"use client";
 
import { useState } from "react";
 
export function Counter() {
  const [n, setN] = useState(0);
  return <button onClick={() => setN(n + 1)}>{n}</button>;
}

import dynamic from "next/dynamic";
 
const Editor = dynamic(() => import("./Editor"), { ssr: false });