[Tech Improvement] using GoRouter to manage navigation

[dariowskii]

📝 Improvement Description

I propose to use GoRouter to manage the navigation and in particular the type-safe routing generation.

🛑 Problem Statement

Now the project uses a primitive, handmade form of navigation through the definition and management of routes in the routes.dart file.

💡 Proposed Solution

Using go_router and refactor the navigation flow before it comes more advanced.

🌿 Benefits

Using go_router would bring several advantages:

• better navigation flow management
• stack replacement when needed
• secure handling of path and query parameters
• native integration of deeplinks (now maybe not needed, but why not)
• web-ready navigation streams (possibly as a future target)

🧱 Impact Area

• [ ] Backend
• [x] Frontend
• [ ] Infrastructure
• [ ] DevOps
• [ ] Other

✍️ Additional Context

No response

📜 Code of Conduct

• [x] ✅ I agree to the Code of Conduct

[fres-sudo]

TBH I'd never ever used go_router, so maybe I am wrong, but why in the world this is needed:

@immutable
class HomeScreenRoute extends GoRouteData {
  @override
  Widget build(BuildContext context, GoRouterState state) {
    return const HomeScreen();
  }
}

@immutable
class SongRoute extends GoRouteData {
  final int id;

  const SongRoute({
    required this.id,
  });

  @override
  Widget build(BuildContext context, GoRouterState state) {
    return SongScreen(songId: id.toString());
  }
}

I mean with auto_route you can simply do:

@RoutePage()
class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return const Scaffold(...);
  }
}

then you can navigate with

context.router.push(const HomeRoute());

And if you need to pass props you can do very easily:

@RoutePage()
class HomePage extends StatelessWidget {
  const HomePage({super.key, requirde this.count});

 final int count;

  @override
  Widget build(BuildContext context) {
    return const Scaffold(...);
  }
}

then you can call the route with

context.router.push(const HomeRoute(count: 10));

There's also the very convenient interface that makes you avoid using StatefulWidget in some situation, where you need the Stateful only for the initState:

@RoutePage()
class HomePage extends StatelessWidget implements AutoRouteWrapper {
  const HomePage({super.key});

  @override
  Widget wrappedRoute(BuildContext context) {
    // do whatever you want here, this is getting triggered only and only if you navigate to that route
    return this;
  }

  @override
  Widget build(BuildContext context) {
    return const Scaffold(...);
  }

Did you ever use auto_route so you can point out the benefits of go_router over auto_route?

[dariowskii]

@fres-sudo Yeah I know, it seems verbose at first 😂 I used go_router for a long time, so I know all the mechanics behind that package, for that reason I was suggesting to adopt it.

BUT, I have friends who are using auto_route, as well as many other members of the Flutter community, who tell me that it is in fact go_router but on steroids!

I was starting to look at it this month but haven't had time to experience it well, so before suggesting something I know little about (even though I've heard good things about it), I would stay more on the “classic” side.

In my opinion auto_route is super good, in general we need to implement a navigation manager 😂