Migration script does not apply layout routes correctly.

[nicksrandall]

I'm trying to migrate my app to remix v2_rotuesConvetion and after running the migrate command, none of my layout routes were properly preserved.

[kiliman]

Yeah, I think v2 works slightly differently than remix-flat-routes, although mine is a superset. So I'll fix the migration tool and it should work for both.

Sorry about that.

[jimmed]

Hey, we're also experiencing this issue -- is there any update on the fix for it? We have a pretty large Remix app and would rather not migrate everything by hand.

Naturally, we're not in any big hurry, as Remix has a very forgiving deprecation strategy.

[kiliman]

It's been a while since I worked on the migration, and I don't have any big v1 projects to test on. Can you send me the file layout? If you don't want to post it publicly, you can email me at [email protected].

Thanks!

[nicksrandall]

In what format would you want this in?

[nicksrandall]

I sent an email with the output from running remix routes in my project.

[kiliman]

Just use the tree command

tree app/routes

You can either paste here or send to [email protected]

Thanks!!

[kiliman]

remix routes will work as well. Thanks!

[jimmed]

It's been a while since I worked on the migration, and I don't have any big v1 projects to test on. Can you send me the file layout?

Is this helpful? I've renamed a few of the routes for the sake of obfuscating a private project, but the layout is very much identical to the real project.

Routes as JSX

<Routes>
  <Route file="root.tsx">
    <Route path="invitations/invalid" file="routes/invitations/invalid.tsx" />
    <Route path="invitations/onboard" file="routes/invitations/onboard.tsx" />
    <Route path="invitations/accept" file="routes/invitations/accept.tsx" />
    <Route path="org/:orgId" file="routes/org.$orgId.tsx">
      <Route path="widget/:widgetId/edit" file="routes/org.$orgId/widget.$widgetId.edit.tsx" />
      <Route path="floobits/:floobitId" file="routes/org.$orgId/floobits.$floobitId.tsx">
        <Route path="dongles/:dongleId" file="routes/org.$orgId/floobits.$floobitId/dongles/$dongleId.tsx" />
        <Route path="widgettemplates" file="routes/org.$orgId/floobits.$floobitId/widgettemplates.tsx">
          <Route path=":widgetId" file="routes/org.$orgId/floobits.$floobitId/widgettemplates/$widgetId.tsx" />
          <Route path="bind" file="routes/org.$orgId/floobits.$floobitId/widgettemplates/bind.tsx" />
        </Route>
        <Route path="dongles" index file="routes/org.$orgId/floobits.$floobitId/dongles/index.tsx" />
        <Route path="integrations" file="routes/org.$orgId/floobits.$floobitId/integrations.tsx">
          <Route path=":schemeId" file="routes/org.$orgId/floobits.$floobitId/integrations/$schemeId.tsx" />
        </Route>
        <Route path="findings" file="routes/org.$orgId/floobits.$floobitId/findings.tsx">
          <Route path=":findingId" file="routes/org.$orgId/floobits.$floobitId/findings/$findingId.tsx" />
          <Route index file="routes/org.$orgId/floobits.$floobitId/findings/index.tsx" />
        </Route>
        <Route path="overview" file="routes/org.$orgId/floobits.$floobitId/overview.tsx">
          <Route path="logs/download" file="routes/org.$orgId/floobits.$floobitId/overview/logs.download.tsx" />
          <Route path="logs" file="routes/org.$orgId/floobits.$floobitId/overview/logs.tsx" />
        </Route>
        <Route path="circles" file="routes/org.$orgId/floobits.$floobitId/circles.tsx">
          <Route path="modify/action/preview" file="routes/org.$orgId/floobits.$floobitId/circles/modify.action.preview.ts" />
          <Route path="modify/action/unbind" file="routes/org.$orgId/floobits.$floobitId/circles/modify.action.unbind.ts" />
          <Route path="modify/action/save" file="routes/org.$orgId/floobits.$floobitId/circles/modify.action.save.ts" />
          <Route path="modify/utils" file="routes/org.$orgId/floobits.$floobitId/circles/modify.utils.ts" />
          <Route path=":widgetId" file="routes/org.$orgId/floobits.$floobitId/circles/$widgetId.tsx" />
          <Route path="modify" file="routes/org.$orgId/floobits.$floobitId/circles/modify.tsx" />
        </Route>
        <Route path="events" file="routes/org.$orgId/floobits.$floobitId/events.tsx">
          <Route path=":eventId" file="routes/org.$orgId/floobits.$floobitId/events/$eventId.tsx">
            <Route path=":violationId" file="routes/org.$orgId/floobits.$floobitId/events/$eventId/$violationId.tsx" />
          </Route>
          <Route index file="routes/org.$orgId/floobits.$floobitId/events/index.tsx" />
        </Route>
        <Route index file="routes/org.$orgId/floobits.$floobitId/index.tsx" />
        <Route path="things" file="routes/org.$orgId/floobits.$floobitId/things.tsx">
          <Route path="floobitrole/:roleId" file="routes/org.$orgId/floobits.$floobitId/things/floobitrole.$roleId.tsx" />
          <Route path=":kind/:resourceId" file="routes/org.$orgId/floobits.$floobitId/things/$kind.$resourceId.tsx" />
          <Route path="role/:roleId" file="routes/org.$orgId/floobits.$floobitId/things/role.$roleId.tsx" />
        </Route>
      </Route>
      <Route path="images/:imageId" file="routes/org.$orgId/images.$imageId.tsx">
        <Route path="scans/:scanId" file="routes/org.$orgId/images.$imageId/scans.$scanId.tsx">
          <Route path="impacted" file="routes/org.$orgId/images.$imageId/scans.$scanId/impacted.tsx" />
          <Route index file="routes/org.$orgId/images.$imageId/scans.$scanId/index.tsx" />
          <Route path="sbom" file="routes/org.$orgId/images.$imageId/scans.$scanId/sbom.tsx" />
        </Route>
        <Route index file="routes/org.$orgId/images.$imageId/index.tsx" />
      </Route>
      <Route path="integrations" file="routes/org.$orgId/integrations.tsx">
        <Route path=":schemeId" file="routes/org.$orgId/integrations/$schemeId.tsx" />
      </Route>
      <Route path="access-keys" file="routes/org.$orgId/access-keys.tsx">
        <Route path=":keyId/delete" file="routes/org.$orgId/access-keys/$keyId.delete.tsx" />
        <Route path="add" file="routes/org.$orgId/access-keys/add.tsx" />
      </Route>
      <Route path="widget/add" file="routes/org.$orgId/widget.add.tsx" />
      <Route path="floobits" file="routes/org.$orgId/floobits.tsx">
        <Route path="delete/:floobitId" file="routes/org.$orgId/floobits/delete.$floobitId.tsx" />
        <Route path="add" file="routes/org.$orgId/floobits/add.tsx" />
      </Route>
      <Route path="images" file="routes/org.$orgId/images.tsx" />
      <Route path="widget" file="routes/org.$orgId/widget.tsx">
        <Route path=":widgetId" file="routes/org.$orgId/widget/$widgetId.tsx" />
        <Route path="upload" file="routes/org.$orgId/widget/upload.tsx" />
      </Route>
      <Route index file="routes/org.$orgId/index.tsx" />
    </Route>
    <Route file="routes/__global.tsx">
      <Route path="users" file="routes/__global/users.tsx">
        <Route path="deactivated" file="routes/__global/users/deactivated.tsx">
          <Route path="reactivate/:userId" file="routes/__global/users/deactivated/reactivate.$userId.tsx" />
        </Route>
        <Route path="invited" file="routes/__global/users/invited.tsx">
          <Route path="reinvite/:inviteId" file="routes/__global/users/invited/reinvite.$inviteId.tsx" />
          <Route path="new" file="routes/__global/users/invited/new.tsx" />
        </Route>
        <Route path="active" file="routes/__global/users/active.tsx">
          <Route path="deactivate/:userId" file="routes/__global/users/active/deactivate.$userId.tsx" />
        </Route>
        <Route index file="routes/__global/users/index.tsx" />
      </Route>
      <Route path="orgs" file="routes/__global/orgs.tsx">
        <Route path="edit/:orgId" file="routes/__global/orgs/edit.$orgId.tsx" />
        <Route path="create" file="routes/__global/orgs/create.tsx" />
      </Route>
    </Route>
    <Route path="accounts" file="routes/accounts.tsx">
      <Route path="edit/:accountId" file="routes/accounts/edit.$accountId.tsx" />
      <Route path="new" file="routes/accounts/new.tsx" />
    </Route>
    <Route path="recovery" file="routes/recovery.tsx">
      <Route path="self-service/recovery" file="routes/recovery/self-service/recovery.tsx" />
    </Route>
    <Route path="settings" file="routes/settings.tsx" />
    <Route path="sign-out" file="routes/sign-out.tsx" />
    <Route path="sign-in" file="routes/sign-in.tsx" />
    <Route path="errors" file="routes/errors.tsx" />
    <Route index file="routes/index.tsx" />
  </Route>
</Routes>

[kiliman]

@jimmed Yes, thank you! The more "real-world" examples, the better. @nicksrandall also sent me his, and I've got that one mostly done, so hopefully, yours will cover more edge cases.

[nicksrandall]

Thanks for all the work on this... has there been any progress here?

[geemanjs]

Hey @kiliman,

Going through a similar migration, was wandering if you could post the headway you made and the issues you see with it.

Happy to take it on and finish it off 🙏.

James