[Question] complex example with auto_route

[davidnwaneri]

Before v6 we had EmptyRoutePage

AutoRoute(page: EmptyRoutePage,name: 'ProfileRouter')

But after v6 its been removed. The alternative as mentioned in the docs is

@RoutePage(name: 'ProfileRouter')      
class ProfileRouterPage extends AutoRouter {}    

This is my route

...
AutoRoute(
          path: '/dashboard',
          guards: [AuthGuard(_context)],
          page: DashBoardRoute.page,
          children: [
            AutoRoute(
              path: 'home',
              page: HomeRoute.page,
            ),
            AutoRoute(
              page: ListRoute.page,
            ),
            AutoRoute(
              path: 'profile',
              page: ProfileRouter.page,
              children: [
                AutoRoute(
                  initial: true,
                  path: '',
                  page: ProfileRoute.page,
                ),
              ],
            ),
          ],
        ),

There are only two items in the bottom nav bar, HomeRoute and ListRoute . ProfileRoute is another screen entirely.
But when i try to push ProfileRoute from HomeRoute, my home route just rebuilds.
I use context.pushRoute(const ProfileRouter()); to push the HomeRoute. Please What am i doing wrong.

[davidnwaneri]

AutoRoute(                    
      path: '/dashboard',                    
      page: DashboardRoute.page,                    
      children: [                    
        AutoRoute(path: '', page: UsersRoute.page),
        AutoRoute(
              path: 'profile',
              page: ProfileRouter.page,
              children: [
                AutoRoute(
                  initial: true,
                  path: '',
                  page: SettingsRoute.page,
                ),
              ],
            ),                                      
      ],                    
    ),

How do you deal with this, where SettingsRoute is a child of ProfileRoute, but it is not nested and can only be accessed from profile on the UI

[Milad-Akarie]

Hey @davidnwaneri I think the problem here is the location of your ProfileRouter in the hierarchy,
your setup should look like this

[
AutoRoute(
          path: '/dashboard',
          guards: [AuthGuard(_context)],
          page: DashBoardRoute.page,
          children: [
            AutoRoute(
              path: 'home',
              page: HomeRoute.page,
            ),
            AutoRoute(
              page: ListRoute.page,
            ),
     
          ],
        ),
      /// this should be in the root scope or any scope other than the tabsRouter scope
       AutoRoute(
              path: '/profile',
              page: ProfileRouter.page,
              children: [
                AutoRoute(
                  initial: true,
                  path: '',
                  page: ProfileRoute.page,
                ),
              ],
            ),
]

[davidnwaneri]

@Milad-Akarie Thank you for taking out time to respond. This worked.

I had the wrong idea about declaring my routes. I've always thought dey should be declared the way they are accessed on the UI

[davidnwaneri]

For more context - no pun intended - say I also had:

AutoRoute(
              path: '/profile',
              page: ProfileRouter.page,
              children: [
                AutoRoute(
                  initial: true,
                  path: '',
                  page: ProfileRoute.page,
                ),
                ...
               AutoRoute(
                  path: 'settings',
                  page: SettingsRoute.page,
                ),
              ],
            ),

Settings route could have children route. Will this be valid or SettingsRoute should be in the root scope?

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions