Adding New Routes

Sub-Route (under existing navigation)

  1. Create: routes/feature+/your-route.tsx
  2. Add to routes.ts: route('/feature/your-route', 'routes/feature+/your-route.tsx')
  3. Add to navigation.ts under /feature subPages:
'/feature/your-route': {
  name: 'Your Route Name',
  visibility: [hiddenUnlessOneOfRoles([KnownRoles.Admin])], // Or any visibility
},

New Top-Level Section

  1. Create: routes/your-section+/_layout.tsx and _index.tsx
  2. Add to routes.ts: layout('routes/your-section+/_layout.tsx', [...])
  3. Add to navigation.ts:
'/your-section': {
  name: 'Your Section',
  icon: 'your-icon',
  visibility: [hiddenUnlessFlagEnabled(FeatureFlagKeys.YOUR_FEATURE)],
  section: 'top',
},

Notes

  • Use kebab-case file names
  • Routes auto-generate types in .react-router/types/+routes.ts
  • Restart dev server after adding routes