Nested pages subroutes with go_router (Flutter)

Question

My app structure can be like this:

home/folder/:fid/player
home/folder/:fid/folder/:fid/player
home/folder/:fid/folder/:fid/folder/:fid/player

with nested folders that can open other folders (a folder can contain an audio file which plays in the player) etc

Is this possible with go router? I've tried to do something like this instead:

home/folder/:fid/folder2/:f2id/player

but it is getting very messy. My router currently looks like this

 final router = GoRouter(
      routes: [
        GoRoute(
            path: HomePath,
            builder: (context, state) => HomeWrapperWidget(),
            routes: [
              GoRoute(
                path: 'session/:sid',
                routes: [
                  GoRoute(
                    path: 'player',
                    pageBuilder: (context, state) =>
                        getPlayerMaterialPage(state),
                  )
                ],
                pageBuilder: (context, state) =>
                    getSessionOptionsMaterialPage(state),
              ),
              GoRoute(
                path: 'folder/:fid',
                routes: [
                  GoRoute(
                    path: 'folder2/:f2id',
                    routes: [
                      GoRoute(
                        path: 'folder3/:f3id',
                        pageBuilder: (context, state) => getFolderMaterialPage(state),
                      ),
                    ],
                    pageBuilder: (context, state) =>
                        getFolderMaterialPage(state),
                  ),
                ],
                pageBuilder: (context, state) => getFolderMaterialPage(state),
              ),
              ...
            ]),
      ],
    );

Nope, I don't think it's possible so I stuck with the above solution. Alternatively I guess you could try to dynamically build the tree. — MSpeed, Jul 20 '22 at 15:28
thank you for the reply. https://pub.dev/packages/go_router_prototype is under development and could be our solution. — Dominik00000, Jul 23 '22 at 13:51

Yuriy N. · Answer 1 · 2023-04-15T11:18:36.420

It is probably just "opinion based" and not a good fit for a site, but I think such things should not be done with a router.

The router is for navigation between pages. The app should have the only one page(route) folder that accepts the parameter fid and displays the content of the specific folder in the file system according to its value.

Instead of relying on the go_router stack of routes, a stack of fids should be created.

Nested pages subroutes with go_router (Flutter)

1 Answers1