タイトルのワークアラウンドは以下になります。

![img](/mosaic-code.jpg)

タイトルのワークアラウンドは以下になります。

```tsx
import { useRouter } from 'next/router'

import { Result, Ok, Err } from 'neverthrow'
import { z } from 'zod'

const PathParamsSchema = z.object({
  userId: z.string(),
})

const useUserID = (): Result<{ userID: string }, Error> => {
  const { query } = useRouter()
  const parsed = PathParamsSchema.safeParse(query)
  if (!parsed.success) {
    return new Err(
      new Error('Invalid query parameter...', {
        cause: parsed.error,
      })
    )
  }
  return new Ok({ userID: parsed.data.userId })
}

const Sample = () => {
  const result = useUserID()
  if (result.isErr()) {
    return (
      <div>
        <h1>Something went wrong...</h1>
        <pre>
          <code>{JSON.stringify(result.error)}</code>
        </pre>
      </div>
    )
  }
  const { userID } = result.value

  return <p>{`userID: ${userID}`}</p>
}
```