fix(visits): pin tool page 500s without the "use client" directive

`GET /visits/pin-tool` returned 500 on every request:

  x `ssr: false` is not allowed with `next/dynamic` in Server
    Components. Please move it into a Client Component.

The page uses `dynamic(..., { ssr: false })` to keep Leaflet off the
server (it touches `window` on import) but was missing the
`"use client"` directive that `supplier-map/page.tsx` carries for
exactly the same reason.

Worth noting how this got through: it fails at request time, not build
time, so `tsc --noEmit` was clean and all 32 unit tests passed. Nothing
renders the page, so only loading it in a browser surfaces it. Verified
by hand — 500 before, 200 after.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Dave 2026-09-06 17:00:19 +02:00
parent 61c5d8c906
commit b09a7e2e56

View file

@ -1,3 +1,5 @@
"use client";
import dynamic from "next/dynamic";
import { MapPinned } from "lucide-react";
@ -5,6 +7,13 @@ import { MapPinned } from "lucide-react";
* Office pin tool — wraps the Leaflet-heavy view in `dynamic({ ssr: false })`
* so the map never runs during SSR (Leaflet touches `window` on import).
* Mirrors the supplier-map page pattern.
*
* The `"use client"` directive above is load-bearing, not decoration:
* Next refuses `ssr: false` on `next/dynamic` inside a Server Component
* ("not allowed with next/dynamic in Server Components"), and the page
* 500s at request time rather than failing the build — so neither
* `tsc` nor the unit tests catch its absence. `supplier-map/page.tsx`
* carries the same directive for the same reason.
*/
const PinToolView = dynamic(
() => import("./pin-tool-view").then((module) => module.PinToolView),