Hooks in shared component (useParams, useSearch)

Has anyone found a good solution for using type-safe hooks (

useParams

useParams

useParams

useParams,

useSearch

useSearch

useSearch

useSearch) from components that could be mounted on multiple routes? I'm thinking of writing custom hooks that take an array of

from

from

instead of a single

from

from

string, but I'd love to know if someone has something better.

The basic problem is something like this:

const Shared = () => {
  const { id } = useParams({ from: '???' })
}

createFileRoute('/foo/$id')({
  component: Shared
}}

createFileRoute('/bar/$id')({
  component: Shared
}}

const Shared = () => {
  const { id } = useParams({ from: '???' })
}

createFileRoute('/foo/$id')({
  component: Shared
}}

createFileRoute('/bar/$id')({
  component: Shared
}}

const Shared = () => {
  const { id } = useParams({ from: '???' })
}

createFileRoute('/foo/$id')({
  component: Shared
}}

createFileRoute('/bar/$id')({
  component: Shared
}}

const Shared = () => {
  const { id } = useParams({ from: '???' })
}

createFileRoute('/foo/$id')({
  component: Shared
}}

createFileRoute('/bar/$id')({
  component: Shared
}}

(Basically a component where the search params or path params are actually present in multiple routes, but just how do you get that in a type-safe way, i.e. without

strict:false

strict:false

strict:false

strict:false)

Hooks in shared component (useParams, useSearch)

Similar Threads

Similar Threads

Similar Threads