After migrating to this library, my forms are submitting to incorrect routes.

Here's a repro (the README has a lot more detail): https://stackblitz.com/edit/node-kh9dmu?file=README.md

Hi, I'm trying out remix-flat-routes and when I use routes with trailing underscore at params, it affects the useParams as well as params in loader / action.

I have to resort to creating a getParam abstraction but just wondering if there's a good way to solve this within the library itself.

Just to clarify in case my description is not clear enough, for example, I have these routes:

/app/$organizationSlug.tsx
/app/$organizationSlug_/other.tsx` --> useParams() will return { organizationSlug_: "slug" }

I think the documentation needs updated for an index route.

For example, this will break because app.calendar and app.calendar.index refer to the same route:

app.tsx
app.calendar.tsx
app.calendar.index.tsx

But this works as intended:

app.tsx
app.calendar.tsx
app.calendar._index.tsx

Hey,

Mentioned this in a discussion but thought it would be best to create a separate issue.

After upgrading to 0.5.2 from 0.4.8, and using remix 1.9.0, my routes aren't valid apparently anymore

Here is my file structure, have removed a load to show the problem ones:

├── admin._index.tsx
├── admin.artists.$id._profile._index.tsx
├── admin.artists.$id._profile.episodes
├── admin.artists.$id._profile.shows.tsx
├── admin.artists.$id._profile.ts    <-layout
├── admin.artists.$id.episodes.new.tsx
├── admin.artists.$id.episodes.tsx    <-layout
├── admin.artists.$id.shows.$showId._profile._index.tsx
├── admin.artists.$id.shows.$showId._profile.tsx   <-layout
├── admin.artists.$id.shows.$showId.tsx    <-layout
├── admin.artists.$id.shows.tsx
├── admin.artists.$id.tsx   <-layout
├── admin.tsx

1.
Error: Path "/admin/artists/:id" defined by route "pages/admin.artists.$id._profile" conflicts with route "pages/admin.artists.$id"

2.
Error: Path "/admin/artists/:id/shows/:showId" defined by route "pages/admin.artists.$id.shows.$showId._profile" conflicts with route "pages/admin.artists.$id.shows.$showId"

3.
Error: Path "/admin/artists/:id/episodes" defined by route "pages/admin.artists.$id.episodes" conflicts with route "pages/admin.artists.$id._profile.episodes"

4.
Error: Path "/admin/artists/:id/shows" defined by route "pages/admin.artists.$id.shows" conflicts with route "pages/admin.artists.$id._profile.shows"

As mentioned this was working before, so wondering what's changed and what I would need to do to fix?

Thanks!

Based on the conversation on the Remix Flat Routes RFC discussion - is it correct that this library supports "hybrid routes" out of the box? I do not see anything referencing this in the README.

I was attempting to use a hybrid of a "layout route" directory with normal flat route subdirectories. Does this work out of the box?

Something like this:

routes/
  _dashboard/
     _list/
        _indext.tsx
    _update/
        _index.tsx

I'd like to colocate .css and .test.tsx files with my files in my routes. So I'd like to be able to ignore files as routes. Something like this config?

module.exports = {
	ignoredRouteFiles: ['**/*'],
	routes: async defineRoutes => {
		return flatRoutes('routes', defineRoutes, {
			ignoredRouteFiles: ['**/.*', '**/*.css', '**/*.test.{js,jsx,ts,tsx}'],
		})
	},
}

I'm trying to do optional dynamic segments like this: /($foo)

This spits out an error saying the route prefix must come first.

Tried putting the $ first and got this for the output route:

<Route path="reports/:(type)/:id" file="routes/reports_.$(type).$id/_route.tsx" />

When trying to nest a round under a parent route it is returning an error:

Error: Path "app/calendar" defined by route "routes/app.calendar/index" conflicts with route "routes/app.calendar.index/index"

version: 0.4.4

Awesome work! I love this.

I tried it on the revamp the react router docs site and had this route config:

app/routes
├── $lang.$ref
│   ├── $.tsx
│   └── index.tsx
├── $lang.$ref.tsx
├── healthcheck.tsx
└── index.tsx

Which creates this route tree with $ remix routes

<Routes>
  <Route file="root.tsx">
    <Route path="healthcheck" file="routes/healthcheck.tsx" />
    <Route path=":lang/:ref" file="routes/$lang.$ref.tsx">
      <Route index file="routes/$lang.$ref/index.tsx" />
      <Route path="*" file="routes/$lang.$ref/$.tsx" />
    </Route>
    <Route index file="routes/index.tsx" />
  </Route>
</Routes>

I ran the migration script and it kicked out:

app/flatroutes
├── $lang.$ref.$
├── $lang.$ref.index
├── $lang_.$ref
├── healthcheck
└── index

Which creates this incorrect route tree:

<Routes>
  <Route file="root.tsx">
    <Route path=":lang/:ref" file="flatroutes/$lang_.$ref/index.tsx" />
    <Route path="healthcheck" file="flatroutes/healthcheck/index.tsx" />
    <Route index file="flatroutes/index/index.tsx" />
  </Route>
</Routes>

• Note the strange $lang_.$ref
• Note the missing child routes under :lang/:ref

I'm realizing my examples never handled the case where a single route defines multiple segments <Route path=":lang/:ref" />, and it looks like the migration script and flatroutes aren't handling it either!

I changed my files to this, which I think is what the correct output of the migration script should be:

app/flatroutes
├── $lang.$ref
├── $lang.$ref.$
├── $lang.$ref.index
├── healthcheck
└── index

But the route config has an even bigger disappearing act with that 😶‍🌫️

<Routes>
  <Route file="root.tsx">
    <Route path="healthcheck" file="flatroutes/healthcheck/index.tsx" />
    <Route index file="flatroutes/index/index.tsx" />
  </Route>
</Routes>

It should look like this:

<Routes>
  <Route file="root.tsx">
    <Route path="healthcheck" file="routes/healthcheck.tsx" />
    <Route path=":lang/:ref" file="routes/$lang.$ref.tsx">
      <Route index file="routes/$lang.$ref/index.tsx" />
      <Route path="*" file="routes/$lang.$ref/$.tsx" />
    </Route>
    <Route index file="routes/index.tsx" />
  </Route>
</Routes>

The tricky bit here is when you see $lang.$ref and don't find a $lang to be the parent, we need to treat $lang.$ref as it's own route without needing a parent.

Of course, if the app developer adds a $lang then the route config will completely change on them, and I'd consider that expected behavior.

Having some trouble getting the new optional route segments working when nested in a folder:

This gives the output expected:

routes/
  hello.(thing).tsx
  index.tsx

<Routes>
  <Route file="root.tsx">
    <Route path="hello/thing?" file="routes/hello.(thing).tsx" />
    <Route index file="routes/index.tsx" />
  </Route>
</Routes>

However if nested in a folder we lose that route entirely:

routes/
  _folder+/
    hello.(thing).tsx
  index.tsx

<Routes>
  <Route file="root.tsx">
    <Route index file="routes/index.tsx" />
  </Route>
</Routes>

Using remix v1.9.0 + remix-flat-routes v0.5.1

It seems like the appDirectory is hard-coded to app, so if you've changed it (for me it's set to remix/app), you get an error. Would be ideal if remix-flat-routes respected the appDirectory parameter.

https://github.com/kiliman/remix-flat-routes/blob/1456a5b88b8e91c6288e0c50aeb5a508c1c72303/src/index.ts#L72