Merge pull request #2291 from KRTirtho/migrate/auto-routes

refactor: migrate to auto_route from go_router

build.yaml

@@ -4,6 +4,16 @@ targets:
       exclude:
         - bin/*.dart
     builders:
+      auto_route_generator:auto_route_generator: # this for @RoutePage
+        options:
+          enable_cached_builds: true
+        generate_for:
+          - lib/pages/**/*.dart
+      auto_route_generator:auto_router_generator: # this for @AutoRouterConfig
+        options:
+          enable_cached_builds: true
+        generate_for:
+          - lib/collections/routes.dart
       json_serializable:
         options:
           any_map: true

lib/collections/intents.dart

@@ -3,17 +3,9 @@ import 'dart:io';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:go_router/go_router.dart';
 import 'package:spotube/collections/routes.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/modules/player/player_controls.dart';
-import 'package:spotube/pages/home/home.dart';
-import 'package:spotube/pages/library/user_albums.dart';
-import 'package:spotube/pages/library/user_artists.dart';
-import 'package:spotube/pages/library/user_downloads.dart';
-import 'package:spotube/pages/library/user_local_tracks/user_local_tracks.dart';
-import 'package:spotube/pages/library/user_playlists.dart';
-import 'package:spotube/pages/lyrics/lyrics.dart';
-import 'package:spotube/pages/search/search.dart';
 import 'package:spotube/provider/audio_player/querying_track_info.dart';
 import 'package:spotube/services/audio_player/audio_player.dart';
 import 'package:spotube/utils/platform.dart';
@@ -40,7 +32,7 @@ class PlayPauseAction extends Action<PlayPauseIntent> {
 }
 
 class NavigationIntent extends Intent {
-  final GoRouter router;
+  final AppRouter router;
   final String path;
   const NavigationIntent(this.router, this.path);
 }
@@ -48,7 +40,7 @@ class NavigationIntent extends Intent {
 class NavigationAction extends Action<NavigationIntent> {
   @override
   invoke(intent) {
-    intent.router.go(intent.path);
+    intent.router.navigateNamed(intent.path);
     return null;
   }
 }
@@ -66,39 +58,39 @@ enum HomeTabs {
 }
 
 class HomeTabIntent extends Intent {
-  final WidgetRef ref;
+  final AppRouter router;
   final HomeTabs tab;
-  const HomeTabIntent(this.ref, {required this.tab});
+  const HomeTabIntent(this.router, {required this.tab});
 }
 
 class HomeTabAction extends Action<HomeTabIntent> {
   @override
   invoke(intent) {
-    final router = intent.ref.read(routerProvider);
+    final router = intent.router;
     switch (intent.tab) {
       case HomeTabs.browse:
-        router.goNamed(HomePage.name);
+        router.navigate(const HomeRoute());
         break;
       case HomeTabs.search:
-        router.goNamed(SearchPage.name);
+        router.navigate(const SearchRoute());
         break;
       case HomeTabs.lyrics:
-        router.goNamed(LyricsPage.name);
+        router.navigate(LyricsRoute());
         break;
       case HomeTabs.userPlaylists:
-        router.goNamed(UserPlaylistsPage.name);
+        router.navigate(const UserPlaylistsRoute());
         break;
       case HomeTabs.userArtists:
-        router.goNamed(UserArtistsPage.name);
+        router.navigate(const UserArtistsRoute());
         break;
       case HomeTabs.userAlbums:
-        router.goNamed(UserAlbumsPage.name);
+        router.navigate(const UserAlbumsRoute());
         break;
       case HomeTabs.userLocalLibrary:
-        router.goNamed(UserLocalLibraryPage.name);
+        router.navigate(const UserLocalLibraryRoute());
         break;
       case HomeTabs.userDownloads:
-        router.goNamed(UserDownloadsPage.name);
+        router.navigate(const UserDownloadsRoute());
         break;
     }
     return null;

lib/collections/routes.dart

@@ -1,365 +1,216 @@
-import 'package:flutter/foundation.dart' hide Category;
+import 'package:auto_route/auto_route.dart';
-import 'package:flutter/widgets.dart';
+import 'package:flutter/foundation.dart';
-import 'package:go_router/go_router.dart';
+import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:spotify/spotify.dart' hide Search;
+import 'package:spotube/collections/routes.gr.dart';
-import 'package:spotube/models/spotify/recommendation_seeds.dart';
-import 'package:spotube/pages/album/album.dart';
-import 'package:spotube/pages/connect/connect.dart';
-import 'package:spotube/pages/connect/control/control.dart';
-import 'package:spotube/pages/getting_started/getting_started.dart';
-import 'package:spotube/pages/home/feed/feed_section.dart';
-import 'package:spotube/pages/home/genres/genre_playlists.dart';
-import 'package:spotube/pages/home/genres/genres.dart';
-import 'package:spotube/pages/home/home.dart';
-import 'package:spotube/pages/lastfm_login/lastfm_login.dart';
-import 'package:spotube/pages/library/user_local_tracks/local_folder.dart';
-import 'package:spotube/pages/library/playlist_generate/playlist_generate.dart';
-import 'package:spotube/pages/library/playlist_generate/playlist_generate_result.dart';
-import 'package:spotube/pages/library/user_albums.dart';
-import 'package:spotube/pages/library/user_artists.dart';
-import 'package:spotube/pages/library/user_downloads.dart';
-import 'package:spotube/pages/library/user_local_tracks/user_local_tracks.dart';
-import 'package:spotube/pages/library/user_playlists.dart';
-import 'package:spotube/pages/lyrics/mini_lyrics.dart';
-import 'package:spotube/pages/playlist/liked_playlist.dart';
-import 'package:spotube/pages/playlist/playlist.dart';
-import 'package:spotube/pages/profile/profile.dart';
-import 'package:spotube/pages/search/search.dart';
-import 'package:spotube/pages/settings/blacklist.dart';
-import 'package:spotube/pages/settings/about.dart';
-import 'package:spotube/pages/settings/logs.dart';
-import 'package:spotube/pages/stats/albums/albums.dart';
-import 'package:spotube/pages/stats/artists/artists.dart';
-import 'package:spotube/pages/stats/fees/fees.dart';
-import 'package:spotube/pages/stats/minutes/minutes.dart';
-import 'package:spotube/pages/stats/playlists/playlists.dart';
-import 'package:spotube/pages/stats/stats.dart';
-import 'package:spotube/pages/stats/streams/streams.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/services/kv_store/kv_store.dart';
-import 'package:spotube/components/spotube_page_route.dart';
-import 'package:spotube/pages/artist/artist.dart';
-import 'package:spotube/pages/library/library.dart';
-import 'package:spotube/pages/lyrics/lyrics.dart';
-import 'package:spotube/pages/root/root_app.dart';
-import 'package:spotube/pages/settings/settings.dart';
-import 'package:spotube/pages/mobile_login/mobile_login.dart';
 
 final rootNavigatorKey = GlobalKey<NavigatorState>();
-final shellRouteNavigatorKey = GlobalKey<NavigatorState>();
+
-final routerProvider = Provider((ref) {
+@AutoRouterConfig(replaceInRouteName: 'Screen|Page,Route')
-  return GoRouter(
+class AppRouter extends RootStackRouter {
-    navigatorKey: rootNavigatorKey,
+  final WidgetRef ref;
-    routes: [
+
-      ShellRoute(
+  AppRouter(this.ref) : super(navigatorKey: rootNavigatorKey);
-        navigatorKey: shellRouteNavigatorKey,
+
-        builder: (context, state, child) => RootApp(child: child),
+  @override
-        routes: [
+  List<AutoRouteGuard> get guards => [
-          GoRoute(
+        AutoRouteGuardCallback(
-            path: "/",
+          (resolver, router) async {
-            name: HomePage.name,
-            redirect: (context, state) async {
             final auth = await ref.read(authenticationProvider.future);
 
             if (auth == null && !KVStoreService.doneGettingStarted) {
-                return "/getting-started";
+              resolver.redirect(const GettingStartedRoute());
+            } else {
+              resolver.next(true);
+            }
+          },
+        ),
+      ];
+
+  @override
+  List<AutoRoute> get routes => [
+        AutoRoute(
+          page: RootAppRoute.page,
+          path: "/",
+          initial: true,
+          children: [
+            AutoRoute(
+              path: "home",
+              page: HomeRoute.page,
+              initial: true,
+            ),
+            AutoRoute(
+              path: "home/genres",
+              page: GenreRoute.page,
+            ),
+            AutoRoute(
+              path: "home/genre/:categoryId",
+              page: GenrePlaylistsRoute.page,
+            ),
+            AutoRoute(
+              path: "home/feeds/:feedId",
+              page: HomeFeedSectionRoute.page,
+            ),
+            AutoRoute(
+              path: "search",
+              page: SearchRoute.page,
+            ),
+            AutoRoute(
+              path: "library",
+              page: LibraryRoute.page,
+              children: [
+                AutoRoute(
+                  path: "playlists",
+                  page: UserPlaylistsRoute.page,
+                ),
+                AutoRoute(
+                  path: "artists",
+                  page: UserArtistsRoute.page,
+                ),
+                AutoRoute(
+                  path: "albums",
+                  page: UserAlbumsRoute.page,
+                ),
+                AutoRoute(
+                  path: "local",
+                  page: UserLocalLibraryRoute.page,
+                ),
+                AutoRoute(
+                  path: "local/folder",
+                  page: LocalLibraryRoute.page,
+                  // parentNavigatorKey: shellRouteNavigatorKey,
+                ),
+                AutoRoute(
+                  path: "downloads",
+                  page: UserDownloadsRoute.page,
+                ),
+              ],
+            ),
+            AutoRoute(
+              path: "library/generate",
+              page: PlaylistGeneratorRoute.page,
+            ),
+            AutoRoute(
+              path: "library/generate/result",
+              page: PlaylistGenerateResultRoute.page,
+            ),
+            AutoRoute(
+              path: "lyrics",
+              page: LyricsRoute.page,
+            ),
+            AutoRoute(
+              path: "settings",
+              page: SettingsRoute.page,
+            ),
+            AutoRoute(
+              path: "settings/blacklist",
+              page: BlackListRoute.page,
+            ),
+            if (!kIsWeb)
+              AutoRoute(
+                path: "settings/logs",
+                page: LogsRoute.page,
+              ),
+            AutoRoute(
+              path: "settings/about",
+              page: AboutSpotubeRoute.page,
+            ),
+            AutoRoute(
+              path: "album/:id",
+              page: AlbumRoute.page,
+            ),
+            AutoRoute(
+              path: "artist/:id",
+              page: ArtistRoute.page,
+            ),
+            AutoRoute(
+              path: "liked-tracks",
+              page: LikedPlaylistRoute.page,
+            ),
+            AutoRoute(
+              path: "playlist/:id",
+              page: PlaylistRoute.page,
+              guards: [
+                AutoRouteGuard.redirect(
+                  (resolver) {
+                    final PlaylistRouteArgs(:id, :playlist) =
+                        resolver.route.args as PlaylistRouteArgs;
+                    if (id == "user-liked-tracks") {
+                      return LikedPlaylistRoute(playlist: playlist);
                     }
 
                     return null;
                   },
-            pageBuilder: (context, state) =>
-                const SpotubePage(child: HomePage()),
-            routes: [
-              GoRoute(
-                path: "genres",
-                name: GenrePage.name,
-                pageBuilder: (context, state) =>
-                    const SpotubePage(child: GenrePage()),
-              ),
-              GoRoute(
-                path: "genre/:categoryId",
-                name: GenrePlaylistsPage.name,
-                pageBuilder: (context, state) => SpotubePage(
-                  child: GenrePlaylistsPage(
-                    category: state.extra as Category,
-                  ),
-                ),
-              ),
-              GoRoute(
-                path: "feeds/:feedId",
-                name: HomeFeedSectionPage.name,
-                pageBuilder: (context, state) => SpotubePage(
-                  child: HomeFeedSectionPage(
-                    sectionUri: state.pathParameters["feedId"] as String,
-                  ),
-                ),
-              )
-            ],
-          ),
-          GoRoute(
-            path: "/search",
-            name: SearchPage.name,
-            pageBuilder: (context, state) =>
-                const SpotubePage(child: SearchPage()),
-          ),
-          ShellRoute(
-            pageBuilder: (context, state, child) =>
-                SpotubePage(child: LibraryPage(child: child)),
-            routes: [
-              GoRoute(
-                path: "/library/playlists",
-                name: UserPlaylistsPage.name,
-                pageBuilder: (context, state) =>
-                    const SpotubePage(child: UserPlaylistsPage()),
-              ),
-              GoRoute(
-                path: "/library/artists",
-                name: UserArtistsPage.name,
-                pageBuilder: (context, state) =>
-                    const SpotubePage(child: UserArtistsPage()),
-              ),
-              GoRoute(
-                path: "/library/album",
-                name: UserAlbumsPage.name,
-                pageBuilder: (context, state) =>
-                    const SpotubePage(child: UserAlbumsPage()),
-              ),
-              GoRoute(
-                  path: "/library/local",
-                  name: UserLocalLibraryPage.name,
-                  pageBuilder: (context, state) =>
-                      const SpotubePage(child: UserLocalLibraryPage()),
-                  routes: [
-                    GoRoute(
-                      path: "folder",
-                      name: LocalLibraryPage.name,
-                      parentNavigatorKey: shellRouteNavigatorKey,
-                      pageBuilder: (context, state) {
-                        assert(state.extra is String);
-                        return SpotubePage(
-                          child: LocalLibraryPage(
-                            state.extra as String,
-                            isDownloads:
-                                state.uri.queryParameters["downloads"] != null,
-                            isCache: state.uri.queryParameters["cache"] != null,
-                          ),
-                        );
-                      },
-                    ),
-                  ]),
-              GoRoute(
-                path: "/library/downloads",
-                name: UserDownloadsPage.name,
-                pageBuilder: (context, state) =>
-                    const SpotubePage(child: UserDownloadsPage()),
                 ),
               ],
             ),
-          GoRoute(
+            AutoRoute(
-            path: "/library/generate",
+              path: "track/:id",
-            name: PlaylistGeneratorPage.name,
+              page: TrackRoute.page,
-            pageBuilder: (context, state) =>
-                const SpotubePage(child: PlaylistGeneratorPage()),
-            routes: [
-              GoRoute(
-                path: "result",
-                name: PlaylistGenerateResultPage.name,
-                pageBuilder: (context, state) => SpotubePage(
-                  child: PlaylistGenerateResultPage(
-                    state: state.extra as GeneratePlaylistProviderInput,
             ),
+            AutoRoute(
+              path: "connect",
+              page: ConnectRoute.page,
             ),
-              )
+            AutoRoute(
-            ],
+              path: "connect/control",
+              page: ConnectControlRoute.page,
             ),
-          GoRoute(
+            AutoRoute(
-            path: "/lyrics",
+              path: "profile",
-            name: LyricsPage.name,
+              page: ProfileRoute.page,
-            pageBuilder: (context, state) =>
-                const SpotubePage(child: LyricsPage()),
             ),
-          GoRoute(
+            AutoRoute(
-            path: "/settings",
+              path: "stats",
-            name: SettingsPage.name,
+              page: StatsRoute.page,
-            pageBuilder: (context, state) => const SpotubePage(
-              child: SettingsPage(),
             ),
-            routes: [
+            AutoRoute(
-              GoRoute(
+              path: "stats/minutes",
-                path: "blacklist",
+              page: StatsMinutesRoute.page,
-                name: BlackListPage.name,
-                pageBuilder: (context, state) => SpotubeSlidePage(
-                  child: const BlackListPage(),
             ),
+            AutoRoute(
+              path: "stats/streams",
+              page: StatsStreamsRoute.page,
             ),
-              if (!kIsWeb)
+            AutoRoute(
-                GoRoute(
+              path: "stats/fees",
-                  path: "logs",
+              page: StatsStreamFeesRoute.page,
-                  name: LogsPage.name,
-                  pageBuilder: (context, state) => SpotubeSlidePage(
-                    child: const LogsPage(),
             ),
+            AutoRoute(
+              path: "stats/artists",
+              page: StatsArtistsRoute.page,
             ),
-              GoRoute(
+            AutoRoute(
-                path: "about",
+              path: "stats/albums",
-                name: AboutSpotube.name,
+              page: StatsAlbumsRoute.page,
-                pageBuilder: (context, state) => SpotubeSlidePage(
-                  child: const AboutSpotube(),
             ),
+            AutoRoute(
+              path: "stats/playlists",
+              page: StatsPlaylistsRoute.page,
             ),
           ],
         ),
-          GoRoute(
+        AutoRoute(
-            path: "/album/:id",
-            name: AlbumPage.name,
-            pageBuilder: (context, state) {
-              assert(state.extra is AlbumSimple);
-              return SpotubePage(
-                child: AlbumPage(album: state.extra as AlbumSimple),
-              );
-            },
-          ),
-          GoRoute(
-            path: "/artist/:id",
-            name: ArtistPage.name,
-            pageBuilder: (context, state) {
-              assert(state.pathParameters["id"] != null);
-              return SpotubePage(
-                  child: ArtistPage(state.pathParameters["id"]!));
-            },
-          ),
-          GoRoute(
-            path: "/playlist/:id",
-            name: PlaylistPage.name,
-            pageBuilder: (context, state) {
-              assert(state.extra is PlaylistSimple);
-              return SpotubePage(
-                child: state.pathParameters["id"] == "user-liked-tracks"
-                    ? LikedPlaylistPage(playlist: state.extra as PlaylistSimple)
-                    : PlaylistPage(playlist: state.extra as PlaylistSimple),
-              );
-            },
-          ),
-          GoRoute(
-            path: "/track/:id",
-            name: TrackPage.name,
-            pageBuilder: (context, state) {
-              final id = state.pathParameters["id"]!;
-              return SpotubePage(
-                child: TrackPage(trackId: id),
-              );
-            },
-          ),
-          GoRoute(
-            path: "/connect",
-            name: ConnectPage.name,
-            pageBuilder: (context, state) => const SpotubePage(
-              child: ConnectPage(),
-            ),
-            routes: [
-              GoRoute(
-                path: "control",
-                name: ConnectControlPage.name,
-                pageBuilder: (context, state) {
-                  return const SpotubePage(
-                    child: ConnectControlPage(),
-                  );
-                },
-              )
-            ],
-          ),
-          GoRoute(
-            path: "/profile",
-            name: ProfilePage.name,
-            pageBuilder: (context, state) =>
-                const SpotubePage(child: ProfilePage()),
-          ),
-          GoRoute(
-            path: "/stats",
-            name: StatsPage.name,
-            pageBuilder: (context, state) => const SpotubePage(
-              child: StatsPage(),
-            ),
-            routes: [
-              GoRoute(
-                path: "minutes",
-                name: StatsMinutesPage.name,
-                pageBuilder: (context, state) => const SpotubePage(
-                  child: StatsMinutesPage(),
-                ),
-              ),
-              GoRoute(
-                path: "streams",
-                name: StatsStreamsPage.name,
-                pageBuilder: (context, state) => const SpotubePage(
-                  child: StatsStreamsPage(),
-                ),
-              ),
-              GoRoute(
-                path: "fees",
-                name: StatsStreamFeesPage.name,
-                pageBuilder: (context, state) => const SpotubePage(
-                  child: StatsStreamFeesPage(),
-                ),
-              ),
-              GoRoute(
-                path: "artists",
-                name: StatsArtistsPage.name,
-                pageBuilder: (context, state) => const SpotubePage(
-                  child: StatsArtistsPage(),
-                ),
-              ),
-              GoRoute(
-                path: "albums",
-                name: StatsAlbumsPage.name,
-                pageBuilder: (context, state) => const SpotubePage(
-                  child: StatsAlbumsPage(),
-                ),
-              ),
-              GoRoute(
-                path: "playlists",
-                name: StatsPlaylistsPage.name,
-                pageBuilder: (context, state) => const SpotubePage(
-                  child: StatsPlaylistsPage(),
-                ),
-              ),
-            ],
-          )
-        ],
-      ),
-      GoRoute(
           path: "/mini-player",
-        name: MiniLyricsPage.name,
+          page: MiniLyricsRoute.page,
-        parentNavigatorKey: rootNavigatorKey,
+          // parentNavigatorKey: rootNavigatorKey,
-        pageBuilder: (context, state) => SpotubePage(
-          child: MiniLyricsPage(prevSize: state.extra as Size),
         ),
-      ),
+        AutoRoute(
-      GoRoute(
           path: "/getting-started",
-        name: GettingStarting.name,
+          page: GettingStartedRoute.page,
-        parentNavigatorKey: rootNavigatorKey,
+          // parentNavigatorKey: rootNavigatorKey,
-        pageBuilder: (context, state) => const SpotubePage(
-          child: GettingStarting(),
         ),
-      ),
+        AutoRoute(
-      GoRoute(
           path: "/login",
-        name: WebViewLogin.name,
+          page: WebViewLoginRoute.page,
-        parentNavigatorKey: rootNavigatorKey,
+          // parentNavigatorKey: rootNavigatorKey,
-        pageBuilder: (context, state) => const SpotubePage(
-          child: WebViewLogin(),
         ),
-      ),
+        AutoRoute(
-      GoRoute(
           path: "/lastfm-login",
-        name: LastFMLoginPage.name,
+          page: LastFMLoginRoute.page,
-        parentNavigatorKey: rootNavigatorKey,
+          // parentNavigatorKey: rootNavigatorKey,
-        pageBuilder: (context, state) =>
-            const SpotubePage(child: LastFMLoginPage()),
         ),
-    ],
+      ];
-  );
+}
-});

lib/collections/side_bar_tiles.dart

@@ -1,51 +1,51 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
-import 'package:spotube/pages/home/home.dart';
-import 'package:spotube/pages/library/user_albums.dart';
-import 'package:spotube/pages/library/user_artists.dart';
-import 'package:spotube/pages/library/user_local_tracks/user_local_tracks.dart';
-import 'package:spotube/pages/library/user_playlists.dart';
-import 'package:spotube/pages/lyrics/lyrics.dart';
-import 'package:spotube/pages/search/search.dart';
-import 'package:spotube/pages/stats/stats.dart';
 
 class SideBarTiles {
   final IconData icon;
   final String title;
   final String id;
-  final String name;
+  final String pathPrefix;
+  final PageRouteInfo route;
 
   SideBarTiles({
     required this.icon,
     required this.title,
     required this.id,
-    required this.name,
+    required this.route,
+    required this.pathPrefix,
   });
 }
 
 List<SideBarTiles> getSidebarTileList(AppLocalizations l10n) => [
       SideBarTiles(
-        id: "browse",
+        id: "home",
-        name: HomePage.name,
+        pathPrefix: "/home",
+        route: const HomeRoute(),
         icon: SpotubeIcons.home,
         title: l10n.browse,
       ),
       SideBarTiles(
         id: "search",
-        name: SearchPage.name,
+        pathPrefix: "/search",
+        route: const SearchRoute(),
         icon: SpotubeIcons.search,
         title: l10n.search,
       ),
       SideBarTiles(
         id: "lyrics",
-        name: LyricsPage.name,
+        pathPrefix: "/lyrics",
+        route: LyricsRoute(),
         icon: SpotubeIcons.music,
         title: l10n.lyrics,
       ),
       SideBarTiles(
         id: "stats",
-        name: StatsPage.name,
+        pathPrefix: "/stats",
+        route: const StatsRoute(),
         icon: SpotubeIcons.chart,
         title: l10n.stats,
       ),
@@ -54,52 +54,60 @@ List<SideBarTiles> getSidebarTileList(AppLocalizations l10n) => [
 List<SideBarTiles> getSidebarLibraryTileList(AppLocalizations l10n) => [
       SideBarTiles(
         id: "playlists",
+        pathPrefix: "/library/playlists",
         title: l10n.playlists,
-        name: UserPlaylistsPage.name,
+        route: const UserPlaylistsRoute(),
         icon: SpotubeIcons.playlist,
       ),
       SideBarTiles(
         id: "artists",
+        pathPrefix: "/library/artists",
         title: l10n.artists,
-        name: UserArtistsPage.name,
+        route: const UserArtistsRoute(),
         icon: SpotubeIcons.artist,
       ),
       SideBarTiles(
         id: "albums",
+        pathPrefix: "/library/albums",
         title: l10n.albums,
-        name: UserAlbumsPage.name,
+        route: const UserAlbumsRoute(),
         icon: SpotubeIcons.album,
       ),
       SideBarTiles(
         id: "local_library",
+        pathPrefix: "/library/local",
         title: l10n.local_library,
-        name: UserLocalLibraryPage.name,
+        route: const UserLocalLibraryRoute(),
         icon: SpotubeIcons.device,
       ),
     ];
 
 List<SideBarTiles> getNavbarTileList(AppLocalizations l10n) => [
       SideBarTiles(
-        id: "browse",
+        id: "home",
-        name: HomePage.name,
+        pathPrefix: "/home",
+        route: const HomeRoute(),
         icon: SpotubeIcons.home,
         title: l10n.browse,
       ),
       SideBarTiles(
         id: "search",
-        name: SearchPage.name,
+        pathPrefix: "/search",
+        route: const SearchRoute(),
         icon: SpotubeIcons.search,
         title: l10n.search,
       ),
       SideBarTiles(
         id: "library",
-        name: UserPlaylistsPage.name,
+        pathPrefix: "/library",
+        route: const UserPlaylistsRoute(),
         icon: SpotubeIcons.library,
         title: l10n.library,
       ),
       SideBarTiles(
         id: "stats",
-        name: StatsPage.name,
+        pathPrefix: "/stats",
+        route: const StatsRoute(),
         icon: SpotubeIcons.chart,
         title: l10n.stats,
       ),

lib/components/dialogs/track_details_dialog.dart

@@ -1,6 +1,7 @@
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/links/artist_link.dart';
 import 'package:spotube/components/links/hyper_link.dart';
@@ -32,8 +33,7 @@ class TrackDetailsDialog extends HookWidget {
       ),
       context.l10n.album: LinkText(
         track.album!.name!,
-        "/album/${track.album?.id}",
+        AlbumRoute(album: track.album!, id: track.album!.id!),
-        extra: track.album,
         overflow: TextOverflow.ellipsis,
         style: const TextStyle(color: Colors.blue),
       ),

lib/components/fallbacks/anonymous_fallback.dart

@@ -1,13 +1,13 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:flutter_undraw/flutter_undraw.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/settings/settings.dart';
 
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/utils/platform.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class AnonymousFallback extends ConsumerWidget {
   final Widget? child;
@@ -40,7 +40,7 @@ class AnonymousFallback extends ConsumerWidget {
           Text(context.l10n.not_logged_in),
           Button.primary(
             child: Text(context.l10n.login_with_spotify),
-            onPressed: () => ServiceUtils.pushNamed(context, SettingsPage.name),
+            onPressed: () => context.navigateTo(const SettingsRoute()),
           )
         ],
       ),

lib/components/links/artist_link.dart

@@ -1,9 +1,9 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/links/anchor_button.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/artist/artist.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class ArtistLink extends StatelessWidget {
   final List<ArtistSimple> artists;
@@ -49,13 +49,8 @@ class ArtistLink extends StatelessWidget {
                     if (onRouteChange != null) {
                       onRouteChange?.call("/artist/${artist.value.id}");
                     } else {
-                      ServiceUtils.pushNamed(
+                      context
-                        context,
+                          .navigateTo(ArtistRoute(artistId: artist.value.id!));
-                        ArtistPage.name,
-                        pathParameters: {
-                          "id": artist.value.id!,
-                        },
-                      );
                     }
                   },
                   overflow: TextOverflow.ellipsis,

lib/components/links/link_text.dart

@@ -1,15 +1,14 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotube/components/links/anchor_button.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class LinkText<T> extends StatelessWidget {
   final String text;
   final TextStyle style;
   final TextAlign? textAlign;
   final TextOverflow? overflow;
-  final String route;
+  final PageRouteInfo route;
   final int? maxLines;
-  final T? extra;
 
   final bool push;
   const LinkText(
@@ -17,7 +16,6 @@ class LinkText<T> extends StatelessWidget {
     this.route, {
     super.key,
     this.textAlign,
-    this.extra,
     this.overflow,
     this.style = const TextStyle(),
     this.maxLines,
@@ -30,9 +28,9 @@ class LinkText<T> extends StatelessWidget {
       text,
       onTap: () {
         if (push) {
-          ServiceUtils.push(context, route, extra: extra);
+          context.navigateTo(route);
         } else {
-          ServiceUtils.navigate(context, route, extra: extra);
+          context.navigateTo(route);
         }
       },
       key: key,

lib/components/spotube_page_route.dart

@@ -1,25 +1,24 @@
 import 'package:shadcn_flutter/shadcn_flutter.dart';
-import 'package:go_router/go_router.dart';
 
 class SpotubePage<T> extends MaterialPage<T> {
   const SpotubePage({required super.child});
 }
 
-class SpotubeSlidePage extends CustomTransitionPage {
+// class SpotubeSlidePage extends CustomTransitionPage {
-  SpotubeSlidePage({
+//   SpotubeSlidePage({
-    required super.child,
+//     required super.child,
-    super.key,
+//     super.key,
-  }) : super(
+//   }) : super(
-          reverseTransitionDuration: const Duration(milliseconds: 150),
+//           reverseTransitionDuration: const Duration(milliseconds: 150),
-          transitionDuration: const Duration(milliseconds: 150),
+//           transitionDuration: const Duration(milliseconds: 150),
-          transitionsBuilder: (context, animation, secondaryAnimation, child) {
+//           transitionsBuilder: (context, animation, secondaryAnimation, child) {
-            return SlideTransition(
+//             return SlideTransition(
-              position: Tween<Offset>(
+//               position: Tween<Offset>(
-                begin: const Offset(1, 0),
+//                 begin: const Offset(1, 0),
-                end: Offset.zero,
+//                 end: Offset.zero,
-              ).animate(animation),
+//               ).animate(animation),
-              child: child,
+//               child: child,
-            );
+//             );
-          },
+//           },
-        );
+//         );
-}
+// }

lib/components/titlebar/titlebar.dart

@@ -1,3 +1,4 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
@@ -73,6 +74,10 @@ class TitleBar extends HookConsumerWidget implements PreferredSizeWidget {
           final hasFullscreen =
               MediaQuery.sizeOf(context).width == constraints.maxWidth;
 
+          final canPop = leading.isEmpty &&
+              automaticallyImplyLeading &&
+              (Navigator.canPop(context) || context.watchRouter.canPop());
+
           return GestureDetector(
             onHorizontalDragStart: (_) => onDrag(ref),
             onVerticalDragStart: (_) => onDrag(ref),
@@ -94,13 +99,7 @@ class TitleBar extends HookConsumerWidget implements PreferredSizeWidget {
               }
             },
             child: AppBar(
-              leading: leading.isEmpty &&
+              leading: canPop ? [const BackButton()] : leading,
-                      automaticallyImplyLeading &&
-                      Navigator.canPop(context)
-                  ? [
-                      const BackButton(),
-                    ]
-                  : leading,
               trailing: [
                 ...trailing,
                 Align(

lib/components/track_tile/track_options.dart

@@ -1,14 +1,16 @@
 import 'dart:io';
 
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 import 'package:spotify/spotify.dart' hide Offset;
 import 'package:spotube/collections/assets.gen.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/adaptive/adaptive_pop_sheet_list.dart';
 import 'package:spotube/components/dialogs/playlist_add_track_dialog.dart';
@@ -22,7 +24,6 @@ import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/models/database/database.dart';
 import 'package:spotube/models/local_track.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/blacklist_provider.dart';
 import 'package:spotube/provider/download_manager_provider.dart';
@@ -30,7 +31,6 @@ import 'package:spotube/provider/local_tracks/local_tracks_provider.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/provider/spotify_provider.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 import 'package:url_launcher/url_launcher_string.dart';
 
@@ -166,7 +166,6 @@ class TrackOptions extends HookConsumerWidget {
   @override
   Widget build(BuildContext context, ref) {
     final mediaQuery = MediaQuery.of(context);
-    final router = GoRouter.of(context);
     final ThemeData(:colorScheme) = Theme.of(context);
 
     final playlist = ref.watch(audioPlayerProvider);
@@ -211,9 +210,8 @@ class TrackOptions extends HookConsumerWidget {
       onSelected: (value) async {
         switch (value) {
           case TrackOptionValue.album:
-            await router.push(
+            await context.navigateTo(
-              '/album/${track.album!.id}',
+              AlbumRoute(id: track.album!.id!, album: track.album!),
-              extra: track.album!,
             );
             break;
           case TrackOptionValue.delete:
@@ -347,12 +345,8 @@ class TrackOptions extends HookConsumerWidget {
             alignment: Alignment.centerLeft,
             child: ArtistLink(
               artists: track.artists!,
-              onOverflowArtistClick: () => ServiceUtils.pushNamed(
+              onOverflowArtistClick: () => context.navigateTo(
-                context,
+                TrackRoute(trackId: track.id!),
-                TrackPage.name,
-                pathParameters: {
-                  "id": track.id!,
-                },
               ),
             ),
           ),

lib/components/track_tile/track_tile.dart

@@ -1,13 +1,14 @@
 import 'dart:async';
 
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter/gestures.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
 
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:skeletonizer/skeletonizer.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/hover_builder.dart';
 import 'package:spotube/components/image/universal_image.dart';
@@ -21,12 +22,10 @@ import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/duration.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/models/local_track.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/audio_player/querying_track_info.dart';
 import 'package:spotube/provider/audio_player/state.dart';
 import 'package:spotube/provider/blacklist_provider.dart';
 import 'package:spotube/utils/platform.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class TrackTile extends HookConsumerWidget {
   /// [index] will not be shown if null
@@ -234,12 +233,8 @@ class TrackTile extends HookConsumerWidget {
                                 padding: (context, states) => EdgeInsets.zero,
                               ),
                               onPressed: () {
-                                context.pushNamed(
+                                context
-                                  TrackPage.name,
+                                    .navigateTo(TrackRoute(trackId: track.id!));
-                                  pathParameters: {
-                                    "id": track.id!,
-                                  },
-                                );
                               },
                               child: Text(
                                 track.name!,
@@ -266,8 +261,8 @@ class TrackTile extends HookConsumerWidget {
                           alignment: Alignment.centerLeft,
                           child: LinkText(
                             track.album!.name!,
-                            "/album/${track.album?.id}",
+                            AlbumRoute(
-                            extra: track.album,
+                                album: track.album!, id: track.album!.id!),
                             push: true,
                             overflow: TextOverflow.ellipsis,
                           ),
@@ -288,17 +283,15 @@ class TrackTile extends HookConsumerWidget {
                         constraints: const BoxConstraints(maxHeight: 40),
                         child: ArtistLink(
                           artists: track.artists ?? [],
-                          onOverflowArtistClick: () => ServiceUtils.pushNamed(
+                          onOverflowArtistClick: () {
-                            context,
+                            context.navigateTo(
-                            TrackPage.name,
+                              TrackRoute(trackId: track.id!),
-                            pathParameters: {
+                            );
-                              "id": track.id!,
                           },
                         ),
                       ),
                     ),
             ),
-            ),
             trailing: Row(
               mainAxisSize: MainAxisSize.min,
               children: [

lib/hooks/configurators/use_deep_linking.dart

@@ -4,6 +4,7 @@ import 'package:app_links/app_links.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:spotube/collections/routes.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/provider/spotify_provider.dart';
 import 'package:flutter_sharing_intent/flutter_sharing_intent.dart';
 import 'package:flutter_sharing_intent/model/sharing_file.dart';
@@ -13,10 +14,9 @@ import 'package:spotube/utils/platform.dart';
 final appLinks = AppLinks();
 final linkStream = appLinks.stringLinkStream.asBroadcastStream();
 
-void useDeepLinking(WidgetRef ref) {
+void useDeepLinking(WidgetRef ref, AppRouter router) {
   // single instance no worries
   final spotify = ref.watch(spotifyProvider);
-  final router = ref.watch(routerProvider);
 
   useEffect(() {
     void uriListener(List<SharedFile> files) async {
@@ -27,24 +27,21 @@ void useDeepLinking(WidgetRef ref) {
 
         switch (url.pathSegments.first) {
           case "album":
-            router.push(
+            final album = await spotify.albums.get(url.pathSegments.last);
-              "/album/${url.pathSegments.last}",
+            router.navigate(
-              extra: await spotify.albums.get(url.pathSegments.last),
+              AlbumRoute(id: album.id!, album: album),
             );
             break;
           case "artist":
-            router.push("/artist/${url.pathSegments.last}");
+            router.navigate(ArtistRoute(artistId: url.pathSegments.last));
             break;
           case "playlist":
-            router.push(
+            final playlist = await spotify.playlists.get(url.pathSegments.last);
-              "/playlist/${url.pathSegments.last}",
+            router
-              extra: await spotify.playlists.get(url.pathSegments.last),
+                .navigate(PlaylistRoute(id: playlist.id!, playlist: playlist));
-            );
             break;
           case "track":
-            router.push(
+            router.navigate(TrackRoute(trackId: url.pathSegments.last));
-              "/track/${url.pathSegments.last}",
-            );
             break;
           default:
             break;
@@ -68,21 +65,21 @@ void useDeepLinking(WidgetRef ref) {
 
         switch (startSegment) {
           case "spotify:album":
-            await router.push(
+            final album = await spotify.albums.get(endSegment);
-              "/album/$endSegment",
+            await router.navigate(
-              extra: await spotify.albums.get(endSegment),
+              AlbumRoute(id: album.id!, album: album),
             );
             break;
           case "spotify:artist":
-            await router.push("/artist/$endSegment");
+            await router.navigate(ArtistRoute(artistId: endSegment));
             break;
           case "spotify:track":
-            await router.push("/track/$endSegment");
+            await router.navigate(TrackRoute(trackId: endSegment));
             break;
           case "spotify:playlist":
-            await router.push(
+            final playlist = await spotify.playlists.get(endSegment);
-              "/playlist/$endSegment",
+            await router.navigate(
-              extra: await spotify.playlists.get(endSegment),
+              PlaylistRoute(id: playlist.id!, playlist: playlist),
             );
             break;
           default:

lib/main.dart

@@ -17,8 +17,8 @@ import 'package:metadata_god/metadata_god.dart';
 import 'package:smtc_windows/smtc_windows.dart';
 import 'package:spotube/collections/env.dart';
 import 'package:spotube/collections/initializers.dart';
-import 'package:spotube/collections/routes.dart';
 import 'package:spotube/collections/intents.dart';
+import 'package:spotube/collections/routes.dart';
 import 'package:spotube/hooks/configurators/use_close_behavior.dart';
 import 'package:spotube/hooks/configurators/use_deep_linking.dart';
 import 'package:spotube/hooks/configurators/use_disable_battery_optimizations.dart';
@@ -133,7 +133,7 @@ class Spotube extends HookConsumerWidget {
     final locale = ref.watch(userPreferencesProvider.select((s) => s.locale));
     final accentMaterialColor =
         ref.watch(userPreferencesProvider.select((s) => s.accentColorScheme));
-    final router = ref.watch(routerProvider);
+    final router = useMemoized(() => AppRouter(ref), []);
     final hasTouchSupport = useHasTouch();
 
     ref.listen(audioPlayerStreamListenersProvider, (_, __) {});
@@ -144,7 +144,7 @@ class Spotube extends HookConsumerWidget {
 
     useFixWindowStretching();
     useDisableBatteryOptimizations();
-    useDeepLinking(ref);
+    useDeepLinking(ref, router);
     useCloseBehavior(ref);
     useGetStoragePermissions(ref);
 
@@ -171,7 +171,7 @@ class Spotube extends HookConsumerWidget {
         GlobalWidgetsLocalizations.delegate,
         GlobalCupertinoLocalizations.delegate,
       ],
-      routerConfig: router,
+      routerConfig: router.config(),
       debugShowCheckedModeBanner: false,
       title: 'Spotube',
       builder: (context, child) {
@@ -240,42 +240,42 @@ class Spotube extends HookConsumerWidget {
           LogicalKeyboardKey.digit1,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.browse),
+        ): HomeTabIntent(router, tab: HomeTabs.browse),
         LogicalKeySet(
           LogicalKeyboardKey.digit2,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.search),
+        ): HomeTabIntent(router, tab: HomeTabs.search),
         LogicalKeySet(
           LogicalKeyboardKey.digit3,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.lyrics),
+        ): HomeTabIntent(router, tab: HomeTabs.lyrics),
         LogicalKeySet(
           LogicalKeyboardKey.digit4,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.userPlaylists),
+        ): HomeTabIntent(router, tab: HomeTabs.userPlaylists),
         LogicalKeySet(
           LogicalKeyboardKey.digit5,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.userArtists),
+        ): HomeTabIntent(router, tab: HomeTabs.userArtists),
         LogicalKeySet(
           LogicalKeyboardKey.digit6,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.userAlbums),
+        ): HomeTabIntent(router, tab: HomeTabs.userAlbums),
         LogicalKeySet(
           LogicalKeyboardKey.digit7,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.userLocalLibrary),
+        ): HomeTabIntent(router, tab: HomeTabs.userLocalLibrary),
         LogicalKeySet(
           LogicalKeyboardKey.digit8,
           LogicalKeyboardKey.control,
           LogicalKeyboardKey.shift,
-        ): HomeTabIntent(ref, tab: HomeTabs.userDownloads),
+        ): HomeTabIntent(router, tab: HomeTabs.userDownloads),
         LogicalKeySet(
           LogicalKeyboardKey.keyW,
           LogicalKeyboardKey.control,

lib/modules/album/album_card.dart

@@ -1,7 +1,9 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/dialogs/select_device_dialog.dart';
 import 'package:spotube/components/playbutton_view/playbutton_card.dart';
 import 'package:spotube/components/playbutton_view/playbutton_tile.dart';
@@ -10,14 +12,12 @@ import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/extensions/track.dart';
 import 'package:spotube/models/connect/connect.dart';
-import 'package:spotube/pages/album/album.dart';
 import 'package:spotube/provider/audio_player/querying_track_info.dart';
 import 'package:spotube/provider/connect/connect.dart';
 import 'package:spotube/provider/history/history.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/services/audio_player/audio_player.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 extension FormattedAlbumType on AlbumType {
   String get formatted => name.replaceFirst(name[0], name[0].toUpperCase());
@@ -69,14 +69,7 @@ class AlbumCard extends HookConsumerWidget {
         "${album.albumType?.formatted} • ${album.artists?.asString() ?? ""}";
 
     void onTap() {
-      ServiceUtils.pushNamed(
+      context.navigateTo(AlbumRoute(id: album.id!, album: album));
-        context,
-        AlbumPage.name,
-        pathParameters: {
-          "id": album.id!,
-        },
-        extra: album,
-      );
     }
 
     void onPlaybuttonPressed() async {

lib/modules/artist/artist_card.dart

@@ -1,16 +1,16 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:auto_size_text/auto_size_text.dart';
 
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 
-import 'package:spotube/pages/artist/artist.dart';
 import 'package:spotube/provider/blacklist_provider.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class ArtistCard extends HookConsumerWidget {
   final Artist artist;
@@ -36,13 +36,7 @@ class ArtistCard extends HookConsumerWidget {
       width: 180,
       child: Button.card(
         onPressed: () {
-          ServiceUtils.pushNamed(
+          context.navigateTo(ArtistRoute(artistId: artist.id!));
-            context,
-            ArtistPage.name,
-            pathParameters: {
-              "id": artist.id!,
-            },
-          );
         },
         child: Column(
           children: [

lib/modules/connect/connect_device.dart

@@ -1,11 +1,11 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/connect/connect.dart';
 import 'package:spotube/provider/connect/clients.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class ConnectDeviceButton extends HookConsumerWidget {
   final bool _sidebar;
@@ -26,7 +26,7 @@ class ConnectDeviceButton extends HookConsumerWidget {
         return IconButton.ghost(
           icon: const Icon(SpotubeIcons.speaker),
           onPressed: () {
-            ServiceUtils.pushNamed(context, ConnectPage.name);
+            context.navigateTo(const ConnectRoute());
           },
         );
       }
@@ -35,7 +35,7 @@ class ConnectDeviceButton extends HookConsumerWidget {
         width: double.infinity,
         child: Button.primary(
           onPressed: () {
-            ServiceUtils.pushNamed(context, ConnectPage.name);
+            context.navigateTo(const ConnectRoute());
           },
           trailing: const Icon(SpotubeIcons.speaker),
           child: Text(
@@ -50,7 +50,7 @@ class ConnectDeviceButton extends HookConsumerWidget {
       children: [
         SecondaryBadge(
           onPressed: () {
-            ServiceUtils.pushNamed(context, ConnectPage.name);
+            context.navigateTo(const ConnectRoute());
           },
           style: const ButtonStyle.secondary(size: ButtonSize(.8)),
           leading: connectClients.asData?.value.resolvedService != null
@@ -70,7 +70,7 @@ class ConnectDeviceButton extends HookConsumerWidget {
         IconButton.primary(
           icon: const Icon(SpotubeIcons.speaker),
           onPressed: () {
-            ServiceUtils.pushNamed(context, ConnectPage.name);
+            context.navigateTo(const ConnectRoute());
           },
         )
       ],

lib/modules/home/sections/feed.dart

@@ -1,10 +1,10 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/home/feed/feed_section.dart';
 import 'package:spotube/provider/spotify/views/home.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class HomePageFeedSection extends HookConsumerWidget {
   const HomePageFeedSection({super.key});
@@ -39,14 +39,10 @@ class HomePageFeedSection extends HookConsumerWidget {
           onFetchMore: () {},
           titleTrailing: Button.text(
             child: Text(context.l10n.browse_all),
-            onPressed: () => ServiceUtils.pushNamed(
+            onPressed: () {
-              context,
+              context.navigateTo(HomeFeedSectionRoute(sectionUri: section.uri));
-              HomeFeedSectionPage.name,
-              pathParameters: {
-                "feedId": section.uri,
             },
           ),
-          ),
         );
       },
     );

lib/modules/home/sections/friends/friend_item.dart

@@ -1,14 +1,13 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter/gestures.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/models/spotify_friends.dart';
-import 'package:spotube/pages/album/album.dart';
-import 'package:spotube/pages/artist/artist.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/spotify_provider.dart';
 
 class FriendItem extends HookConsumerWidget {
@@ -50,9 +49,8 @@ class FriendItem extends HookConsumerWidget {
                       text: friend.track.name,
                       recognizer: TapGestureRecognizer()
                         ..onTap = () {
-                          context.pushNamed(TrackPage.name, pathParameters: {
+                          context
-                            "id": friend.track.id,
+                              .navigateTo(TrackRoute(trackId: friend.track.id));
-                          });
                         },
                     ),
                     const TextSpan(text: " • "),
@@ -66,12 +64,8 @@ class FriendItem extends HookConsumerWidget {
                       text: " ${friend.track.artist.name}",
                       recognizer: TapGestureRecognizer()
                         ..onTap = () {
-                          context.pushNamed(
+                          context.navigateTo(
-                            ArtistPage.name,
+                            ArtistRoute(artistId: friend.track.artist.id),
-                            pathParameters: {
-                              "id": friend.track.artist.id,
-                            },
-                            extra: friend.track.artist,
                           );
                         },
                     ),
@@ -80,13 +74,13 @@ class FriendItem extends HookConsumerWidget {
                       text: friend.track.context.name,
                       recognizer: TapGestureRecognizer()
                         ..onTap = () async {
-                          context.push(
+                          context.router.navigateNamed(
                             "/${friend.track.context.path}",
-                            extra:
+                            // extra:
-                                !friend.track.context.path.startsWith("album")
+                            //     !friend.track.context.path.startsWith("album")
-                                    ? null
+                            //         ? null
-                                    : await spotify.albums
+                            //         : await spotify.albums
-                                        .get(friend.track.context.id),
+                            //             .get(friend.track.context.id),
                           );
                         },
                     ),
@@ -104,12 +98,8 @@ class FriendItem extends HookConsumerWidget {
                           final album =
                               await spotify.albums.get(friend.track.album.id);
                           if (context.mounted) {
-                            context.pushNamed(
+                            context.navigateTo(
-                              AlbumPage.name,
+                              AlbumRoute(id: album.id!, album: album),
-                              pathParameters: {
-                                "id": friend.track.album.id,
-                              },
-                              extra: album,
                             );
                           }
                         },

lib/modules/home/sections/genres/genre_card.dart

@@ -1,17 +1,17 @@
 import 'dart:math';
 import 'dart:ui';
 
-import 'package:go_router/go_router.dart';
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:skeletonizer/skeletonizer.dart';
 import 'package:spotify/spotify.dart' hide Offset;
 import 'package:spotube/collections/fake.dart';
 import 'package:spotube/collections/gradients.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/modules/home/sections/genres/genre_card_playlist_card.dart';
-import 'package:spotube/pages/home/genres/genre_playlists.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 
 final random = Random();
@@ -76,10 +76,11 @@ class GenreSectionCard extends HookConsumerWidget {
                 ).h3(),
                 Button.link(
                   onPressed: () {
-                    context.pushNamed(
+                    context.navigateTo(
-                      GenrePlaylistsPage.name,
+                      GenrePlaylistsRoute(
-                      pathParameters: {'categoryId': category.id!},
+                        id: category.id!,
-                      extra: category,
+                        category: category,
+                      ),
                     );
                   },
                   child: Text(

lib/modules/home/sections/genres/genre_card_playlist_card.dart

@@ -1,12 +1,12 @@
-import 'package:go_router/go_router.dart';
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart' hide Image;
 import 'package:spotube/collections/env.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/extensions/string.dart';
-import 'package:spotube/pages/playlist/playlist.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:stroke_text/stroke_text.dart';
 
@@ -47,12 +47,8 @@ class GenreSectionCardPlaylistCard extends HookConsumerWidget {
             },
           ),
           onPressed: () {
-            context.pushNamed(
+            context.navigateTo(
-              PlaylistPage.name,
+              PlaylistRoute(id: playlist.id!, playlist: playlist),
-              pathParameters: {
-                "id": playlist.id!,
-              },
-              extra: playlist,
             );
           },
           child: Column(

lib/modules/home/sections/genres/genres.dart

@@ -1,15 +1,16 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 import 'package:skeletonizer/skeletonizer.dart';
 import 'package:spotube/collections/fake.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/modules/home/sections/genres/genre_card.dart';
-import 'package:spotube/pages/home/genres/genres.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 
 class HomeGenresSection extends HookConsumerWidget {
@@ -47,7 +48,7 @@ class HomeGenresSection extends HookConsumerWidget {
               ),
               Button.link(
                 onPressed: () {
-                  context.pushNamed(GenrePage.name);
+                  context.navigateTo(const GenreRoute());
                 },
                 child: Text(
                   context.l10n.browse_all,

lib/modules/library/local_folder/local_folder_item.dart

@@ -1,18 +1,18 @@
 import 'dart:math';
 
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:path/path.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/extensions/string.dart';
-import 'package:spotube/pages/library/user_local_tracks/local_folder.dart';
 import 'package:spotube/provider/local_tracks/local_tracks_provider.dart';
 import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
 
@@ -59,13 +59,12 @@ class LocalFolderItem extends HookConsumerWidget {
 
     return Button(
       onPressed: () {
-        context.pushNamed(
+        context.navigateTo(
-          LocalLibraryPage.name,
+          LocalLibraryRoute(
-          queryParameters: {
+            location: folder,
-            if (isDownloadFolder) "downloads": "true",
+            isCache: isCacheFolder,
-            if (isCacheFolder) "cache": "true",
+            isDownloads: isDownloadFolder,
-          },
+          ),
-          extra: folder,
         );
       },
       style: ButtonVariance.card.copyWith(

lib/modules/library/user_downloads/download_item.dart

@@ -1,18 +1,18 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/components/links/artist_link.dart';
 import 'package:spotube/components/ui/button_tile.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/download_manager_provider.dart';
 import 'package:spotube/services/download_manager/download_status.dart';
 import 'package:spotube/services/sourced_track/sourced_track.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class DownloadItem extends HookConsumerWidget {
   final Track track;
@@ -66,14 +66,10 @@ class DownloadItem extends HookConsumerWidget {
       subtitle: ArtistLink(
         artists: track.artists ?? <Artist>[],
         mainAxisAlignment: WrapAlignment.start,
-        onOverflowArtistClick: () => ServiceUtils.pushNamed(
+        onOverflowArtistClick: () {
-          context,
+          context.navigateTo(TrackRoute(trackId: track.id!));
-          TrackPage.name,
-          pathParameters: {
-            "id": track.id!,
         },
       ),
-      ),
       trailing: isQueryingSourceInfo
           ? Text(context.l10n.querying_info).small()
           : switch (taskStatus.value!) {

lib/modules/player/player.dart

@@ -1,13 +1,14 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:flutter/material.dart' show showModalBottomSheet;
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 import 'package:sliding_up_panel/sliding_up_panel.dart';
 
 import 'package:spotube/collections/assets.gen.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/framework/app_pop_scope.dart';
 import 'package:spotube/modules/player/player_actions.dart';
@@ -25,13 +26,11 @@ import 'package:spotube/extensions/image.dart';
 import 'package:spotube/models/local_track.dart';
 import 'package:spotube/modules/root/spotube_navigation_bar.dart';
 import 'package:spotube/pages/lyrics/lyrics.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/provider/server/active_sourced_track.dart';
 import 'package:spotube/provider/volume_provider.dart';
 import 'package:spotube/services/sourced_track/sources/youtube.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 import 'package:url_launcher/url_launcher_string.dart';
 
@@ -94,7 +93,7 @@ class PlayerView extends HookConsumerWidget {
     }, [panelController.isAttached && panelController.isPanelOpen]);
 
     return AppPopScope(
-      canPop: context.canPop(),
+      canPop: false,
       onPopInvoked: (didPop) async {
         await panelController.close();
       },
@@ -210,14 +209,10 @@ class PlayerView extends HookConsumerWidget {
                                 .copyWith(fontWeight: FontWeight.bold),
                             onRouteChange: (route) {
                               panelController.close();
-                              GoRouter.of(context).push(route);
+                              context.router.navigateNamed(route);
-                            },
-                            onOverflowArtistClick: () => ServiceUtils.pushNamed(
-                              context,
-                              TrackPage.name,
-                              pathParameters: {
-                                "id": currentTrack!.id!,
                             },
+                            onOverflowArtistClick: () => context.navigateTo(
+                              TrackRoute(trackId: currentTrack!.id!),
                             ),
                           ),
                       ],

lib/modules/player/player_overlay.dart

@@ -1,4 +1,3 @@
-import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:sliding_up_panel/sliding_up_panel.dart';
@@ -8,6 +7,10 @@ import 'package:spotube/modules/root/spotube_navigation_bar.dart';
 import 'package:spotube/modules/player/player.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 
+final playerOverlayControllerProvider = StateProvider<PanelController>((ref) {
+  return PanelController();
+});
+
 class PlayerOverlay extends HookConsumerWidget {
   final String albumArt;
 
@@ -23,7 +26,7 @@ class PlayerOverlay extends HookConsumerWidget {
 
     final screenSize = MediaQuery.sizeOf(context);
 
-    final panelController = useMemoized(() => PanelController(), []);
+    final panelController = ref.watch(playerOverlayControllerProvider);
 
     return SlidingUpPanel(
       maxHeight: screenSize.height,

lib/modules/player/player_track_details.dart

@@ -1,17 +1,18 @@
+import 'package:auto_route/auto_route.dart';
+
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:spotify/spotify.dart';
 
 import 'package:spotube/collections/assets.gen.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/components/links/artist_link.dart';
 import 'package:spotube/components/links/link_text.dart';
 import 'package:spotube/extensions/artist_simple.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class PlayerTrackDetails extends HookConsumerWidget {
   final Color? color;
@@ -50,7 +51,7 @@ class PlayerTrackDetails extends HookConsumerWidget {
                 const SizedBox(height: 4),
                 LinkText(
                   playback.activeTrack?.name ?? "",
-                  "/track/${playback.activeTrack?.id}",
+                  TrackRoute(trackId: playback.activeTrack?.id ?? ""),
                   push: true,
                   overflow: TextOverflow.ellipsis,
                   style: theme.typography.normal.copyWith(
@@ -72,7 +73,7 @@ class PlayerTrackDetails extends HookConsumerWidget {
               children: [
                 LinkText(
                   playback.activeTrack?.name ?? "",
-                  "/track/${playback.activeTrack?.id}",
+                  TrackRoute(trackId: playback.activeTrack?.id ?? ""),
                   push: true,
                   overflow: TextOverflow.ellipsis,
                   style: TextStyle(fontWeight: FontWeight.bold, color: color),
@@ -80,15 +81,10 @@ class PlayerTrackDetails extends HookConsumerWidget {
                 ArtistLink(
                   artists: playback.activeTrack?.artists ?? [],
                   onRouteChange: (route) {
-                    ServiceUtils.push(context, route);
+                    context.router.navigateNamed(route);
                   },
-                  onOverflowArtistClick: () => ServiceUtils.pushNamed(
+                  onOverflowArtistClick: () =>
-                    context,
+                      context.navigateTo(TrackRoute(trackId: track!.id!)),
-                    TrackPage.name,
-                    pathParameters: {
-                      "id": track!.id!,
-                    },
-                  ),
                 )
               ],
             ),

lib/modules/playlist/playlist_card.dart

@@ -1,8 +1,10 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart' hide Offset, Image;
 import 'package:spotube/collections/env.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/dialogs/select_device_dialog.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/components/playbutton_view/playbutton_card.dart';
@@ -10,14 +12,12 @@ import 'package:spotube/components/playbutton_view/playbutton_tile.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/models/connect/connect.dart';
-import 'package:spotube/pages/playlist/playlist.dart';
 import 'package:spotube/provider/audio_player/querying_track_info.dart';
 import 'package:spotube/provider/connect/connect.dart';
 import 'package:spotube/provider/history/history.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/services/audio_player/audio_player.dart';
-import 'package:spotube/utils/service_utils.dart';
 import 'package:stroke_text/stroke_text.dart';
 
 class PlaylistCard extends HookConsumerWidget {
@@ -73,14 +73,7 @@ class PlaylistCard extends HookConsumerWidget {
     }
 
     void onTap() {
-      ServiceUtils.pushNamed(
+      context.navigateTo(PlaylistRoute(id: playlist.id!, playlist: playlist));
-        context,
-        PlaylistPage.name,
-        pathParameters: {
-          "id": playlist.id!,
-        },
-        extra: playlist,
-      );
     }
 
     void onPlaybuttonPressed() async {

lib/modules/playlist/playlist_create_dialog.dart

@@ -1,11 +1,11 @@
 import 'dart:convert';
 import 'dart:io';
 
+import 'package:auto_route/auto_route.dart';
 import 'package:collection/collection.dart';
 import 'package:flutter_form_builder/flutter_form_builder.dart';
 import 'package:form_builder_validators/form_builder_validators.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:image_picker/image_picker.dart';
 import 'package:path/path.dart';
@@ -105,7 +105,7 @@ class PlaylistCreateDialog extends HookConsumerWidget {
         isSubmitting.value = false;
         if (context.mounted &&
             !ref.read(playlistProvider(playlistId ?? "")).hasError) {
-          context.pop();
+          context.router.maybePop();
         }
       }
     }

lib/modules/root/bottom_player.dart

@@ -1,10 +1,11 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 
 import 'package:spotube/collections/assets.gen.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/models/database/database.dart';
 import 'package:spotube/modules/player/player_actions.dart';
@@ -96,9 +97,8 @@ class BottomPlayer extends HookConsumerWidget {
                           const Duration(milliseconds: 100),
                           () async {
                             if (context.mounted) {
-                              context.go(
+                              context.navigateTo(
-                                '/mini-player',
+                                MiniLyricsRoute(prevSize: prevSize),
-                                extra: prevSize,
                               );
                             }
                           },

lib/modules/root/sidebar.dart

@@ -1,270 +0,0 @@
-import 'package:flutter/material.dart' show Badge;
-import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
-import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:shadcn_flutter/shadcn_flutter.dart';
-
-import 'package:spotube/collections/assets.gen.dart';
-import 'package:spotube/collections/side_bar_tiles.dart';
-import 'package:spotube/collections/spotube_icons.dart';
-import 'package:spotube/components/image/universal_image.dart';
-import 'package:spotube/extensions/image.dart';
-import 'package:spotube/models/database/database.dart';
-import 'package:spotube/extensions/constrains.dart';
-import 'package:spotube/extensions/context.dart';
-import 'package:spotube/modules/connect/connect_device.dart';
-import 'package:spotube/pages/library/user_downloads.dart';
-import 'package:spotube/pages/profile/profile.dart';
-import 'package:spotube/pages/settings/settings.dart';
-import 'package:spotube/provider/authentication/authentication.dart';
-import 'package:spotube/provider/download_manager_provider.dart';
-import 'package:spotube/provider/spotify/spotify.dart';
-
-import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
-
-import 'package:spotube/utils/service_utils.dart';
-
-class Sidebar extends HookConsumerWidget {
-  final Widget child;
-
-  const Sidebar({
-    required this.child,
-    super.key,
-  });
-
-  static Widget brandLogo() {
-    return Container(
-      decoration: BoxDecoration(
-        color: Colors.black,
-        borderRadius: BorderRadius.circular(50),
-      ),
-      child: Assets.spotubeLogoPng.image(height: 50),
-    );
-  }
-
-  @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    final routerState = GoRouterState.of(context);
-    final mediaQuery = MediaQuery.of(context);
-
-    final layoutMode =
-        ref.watch(userPreferencesProvider.select((s) => s.layoutMode));
-
-    final sidebarTileList = useMemoized(
-      () => getSidebarTileList(context.l10n),
-      [context.l10n],
-    );
-
-    final sidebarLibraryTileList = useMemoized(
-      () => getSidebarLibraryTileList(context.l10n),
-      [context.l10n],
-    );
-
-    final tileList = [...sidebarTileList, ...sidebarLibraryTileList];
-
-    final selectedIndex = tileList.indexWhere(
-      (e) => routerState.namedLocation(e.name) == routerState.matchedLocation,
-    );
-
-    if (layoutMode == LayoutMode.compact ||
-        (mediaQuery.smAndDown && layoutMode == LayoutMode.adaptive)) {
-      return Scaffold(child: child);
-    }
-
-    final navigationButtons = [
-      NavigationLabel(
-        child: mediaQuery.lgAndUp ? const Text("Spotube") : const Text(""),
-      ),
-      for (final tile in sidebarTileList)
-        NavigationButton(
-          label: mediaQuery.lgAndUp ? Text(tile.title) : null,
-          child: Tooltip(
-            tooltip: TooltipContainer(child: Text(tile.title)),
-            child: Icon(tile.icon),
-          ),
-          onChanged: (value) {
-            if (value) {
-              context.goNamed(tile.name);
-            }
-          },
-        ),
-      const NavigationDivider(),
-      if (mediaQuery.lgAndUp)
-        NavigationLabel(child: Text(context.l10n.library)),
-      for (final tile in sidebarLibraryTileList)
-        NavigationButton(
-          label: mediaQuery.lgAndUp ? Text(tile.title) : null,
-          onChanged: (value) {
-            if (value) {
-              context.goNamed(tile.name);
-            }
-          },
-          child: Tooltip(
-            tooltip: TooltipContainer(child: Text(tile.title)),
-            child: Icon(tile.icon),
-          ),
-        ),
-    ];
-
-    return Row(
-      crossAxisAlignment: CrossAxisAlignment.start,
-      children: [
-        Column(
-          children: [
-            Expanded(
-              child: mediaQuery.lgAndUp
-                  ? NavigationSidebar(
-                      index: selectedIndex,
-                      onSelected: (index) {
-                        final tile = tileList[index];
-                        context.goNamed(tile.name);
-                      },
-                      children: navigationButtons,
-                    )
-                  : NavigationRail(
-                      alignment: NavigationRailAlignment.start,
-                      index: selectedIndex,
-                      onSelected: (index) {
-                        final tile = tileList[index];
-                        context.goNamed(tile.name);
-                      },
-                      children: navigationButtons,
-                    ),
-            ),
-            const SidebarFooter(),
-            if (mediaQuery.lgAndUp) const Gap(130) else const Gap(65),
-          ],
-        ),
-        const VerticalDivider(),
-        Expanded(child: child),
-      ],
-    );
-  }
-}
-
-class SidebarFooter extends HookConsumerWidget implements NavigationBarItem {
-  const SidebarFooter({
-    super.key,
-  });
-
-  @override
-  Widget build(BuildContext context, ref) {
-    final theme = Theme.of(context);
-    final mediaQuery = MediaQuery.of(context);
-    final routerState = GoRouterState.of(context);
-    final downloadCount = ref.watch(downloadManagerProvider).$downloadCount;
-    final userSnapshot = ref.watch(meProvider);
-    final data = userSnapshot.asData?.value;
-
-    final avatarImg = (data?.images).asUrlString(
-      index: (data?.images?.length ?? 1) - 1,
-      placeholder: ImagePlaceholder.artist,
-    );
-
-    final auth = ref.watch(authenticationProvider);
-
-    if (mediaQuery.mdAndDown) {
-      return Column(
-        mainAxisSize: MainAxisSize.min,
-        spacing: 10,
-        children: [
-          Badge(
-            isLabelVisible: downloadCount > 0,
-            label: Text(downloadCount.toString()),
-            child: IconButton(
-              variance: routerState.topRoute?.name == UserDownloadsPage.name
-                  ? ButtonVariance.secondary
-                  : ButtonVariance.ghost,
-              icon: const Icon(SpotubeIcons.download),
-              onPressed: () =>
-                  ServiceUtils.navigateNamed(context, UserDownloadsPage.name),
-            ),
-          ),
-          const ConnectDeviceButton.sidebar(),
-          IconButton(
-            variance: ButtonVariance.ghost,
-            icon: const Icon(SpotubeIcons.settings),
-            onPressed: () =>
-                ServiceUtils.navigateNamed(context, SettingsPage.name),
-          ),
-        ],
-      );
-    }
-
-    return Container(
-      padding: const EdgeInsets.only(left: 12),
-      width: 180,
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
-        spacing: 10,
-        children: [
-          SizedBox(
-            width: double.infinity,
-            child: Button(
-              style: routerState.topRoute?.name == UserDownloadsPage.name
-                  ? ButtonVariance.secondary
-                  : ButtonVariance.outline,
-              onPressed: () {
-                ServiceUtils.navigateNamed(context, UserDownloadsPage.name);
-              },
-              leading: const Icon(SpotubeIcons.download),
-              trailing: downloadCount > 0
-                  ? PrimaryBadge(
-                      child: Text(downloadCount.toString()),
-                    )
-                  : null,
-              child: Text(context.l10n.downloads),
-            ),
-          ),
-          const ConnectDeviceButton.sidebar(),
-          Row(
-            mainAxisSize: MainAxisSize.min,
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-            children: [
-              if (auth.asData?.value != null && data == null)
-                const CircularProgressIndicator()
-              else if (data != null)
-                Flexible(
-                  child: GestureDetector(
-                    onTap: () {
-                      ServiceUtils.pushNamed(context, ProfilePage.name);
-                    },
-                    child: Row(
-                      children: [
-                        Avatar(
-                          initials:
-                              Avatar.getInitials(data.displayName ?? "User"),
-                          provider: UniversalImage.imageProvider(avatarImg),
-                        ),
-                        const SizedBox(width: 10),
-                        Flexible(
-                          child: Text(
-                            data.displayName ?? context.l10n.guest,
-                            maxLines: 1,
-                            softWrap: false,
-                            overflow: TextOverflow.fade,
-                            style: theme.typography.normal
-                                .copyWith(fontWeight: FontWeight.bold),
-                          ),
-                        ),
-                      ],
-                    ),
-                  ),
-                ),
-              IconButton(
-                variance: ButtonVariance.ghost,
-                icon: const Icon(SpotubeIcons.settings),
-                onPressed: () {
-                  ServiceUtils.pushNamed(context, SettingsPage.name);
-                },
-              ),
-            ],
-          ),
-        ],
-      ),
-    );
-  }
-
-  @override
-  bool get selectable => false;
-}

lib/modules/root/sidebar/sidebar.dart

@@ -0,0 +1,132 @@
+import 'package:auto_route/auto_route.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:shadcn_flutter/shadcn_flutter.dart';
+
+import 'package:spotube/collections/assets.gen.dart';
+import 'package:spotube/collections/side_bar_tiles.dart';
+import 'package:spotube/models/database/database.dart';
+import 'package:spotube/extensions/constrains.dart';
+import 'package:spotube/extensions/context.dart';
+import 'package:spotube/modules/root/sidebar/sidebar_footer.dart';
+
+import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
+
+class Sidebar extends HookConsumerWidget {
+  final Widget child;
+
+  const Sidebar({
+    required this.child,
+    super.key,
+  });
+
+  static Widget brandLogo() {
+    return Container(
+      decoration: BoxDecoration(
+        color: Colors.black,
+        borderRadius: BorderRadius.circular(50),
+      ),
+      child: Assets.spotubeLogoPng.image(height: 50),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final mediaQuery = MediaQuery.of(context);
+
+    final layoutMode =
+        ref.watch(userPreferencesProvider.select((s) => s.layoutMode));
+
+    final sidebarTileList = useMemoized(
+      () => getSidebarTileList(context.l10n),
+      [context.l10n],
+    );
+
+    final sidebarLibraryTileList = useMemoized(
+      () => getSidebarLibraryTileList(context.l10n),
+      [context.l10n],
+    );
+
+    final tileList = [...sidebarTileList, ...sidebarLibraryTileList];
+
+    final router = context.watchRouter;
+
+    final selectedIndex = tileList.indexWhere(
+      (e) => router.currentPath.startsWith(e.pathPrefix),
+    );
+
+    if (layoutMode == LayoutMode.compact ||
+        (mediaQuery.smAndDown && layoutMode == LayoutMode.adaptive)) {
+      return child;
+    }
+
+    final navigationButtons = [
+      NavigationLabel(
+        child: mediaQuery.lgAndUp ? const Text("Spotube") : const Text(""),
+      ),
+      for (final tile in sidebarTileList)
+        NavigationButton(
+          label: mediaQuery.lgAndUp ? Text(tile.title) : null,
+          child: Tooltip(
+            tooltip: TooltipContainer(child: Text(tile.title)),
+            child: Icon(tile.icon),
+          ),
+          onChanged: (value) {
+            if (value) {
+              context.navigateTo(tile.route);
+            }
+          },
+        ),
+      const NavigationDivider(),
+      if (mediaQuery.lgAndUp)
+        NavigationLabel(child: Text(context.l10n.library)),
+      for (final tile in sidebarLibraryTileList)
+        NavigationButton(
+          label: mediaQuery.lgAndUp ? Text(tile.title) : null,
+          onChanged: (value) {
+            if (value) {
+              context.navigateTo(tile.route);
+            }
+          },
+          child: Tooltip(
+            tooltip: TooltipContainer(child: Text(tile.title)),
+            child: Icon(tile.icon),
+          ),
+        ),
+    ];
+
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Column(
+          children: [
+            Expanded(
+              child: mediaQuery.lgAndUp
+                  ? NavigationSidebar(
+                      index: selectedIndex,
+                      onSelected: (index) {
+                        final tile = tileList[index];
+                        context.navigateTo(tile.route);
+                      },
+                      children: navigationButtons,
+                    )
+                  : NavigationRail(
+                      alignment: NavigationRailAlignment.start,
+                      index: selectedIndex,
+                      onSelected: (index) {
+                        final tile = tileList[index];
+                        context.navigateTo(tile.route);
+                      },
+                      children: navigationButtons,
+                    ),
+            ),
+            const SidebarFooter(),
+            if (mediaQuery.lgAndUp) const Gap(130) else const Gap(65),
+          ],
+        ),
+        const VerticalDivider(),
+        Expanded(child: child),
+      ],
+    );
+  }
+}

lib/modules/root/sidebar/sidebar_footer.dart

@@ -0,0 +1,140 @@
+import 'package:auto_route/auto_route.dart';
+import 'package:flutter/material.dart' show Badge;
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:shadcn_flutter/shadcn_flutter.dart';
+
+import 'package:spotube/collections/routes.gr.dart';
+import 'package:spotube/collections/spotube_icons.dart';
+import 'package:spotube/components/image/universal_image.dart';
+import 'package:spotube/extensions/image.dart';
+import 'package:spotube/extensions/constrains.dart';
+import 'package:spotube/extensions/context.dart';
+import 'package:spotube/modules/connect/connect_device.dart';
+import 'package:spotube/provider/authentication/authentication.dart';
+import 'package:spotube/provider/download_manager_provider.dart';
+import 'package:spotube/provider/spotify/spotify.dart';
+
+class SidebarFooter extends HookConsumerWidget implements NavigationBarItem {
+  const SidebarFooter({
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context, ref) {
+    final theme = Theme.of(context);
+    final router = AutoRouter.of(context, watch: true);
+    final mediaQuery = MediaQuery.of(context);
+    final downloadCount = ref.watch(downloadManagerProvider).$downloadCount;
+    final userSnapshot = ref.watch(meProvider);
+    final data = userSnapshot.asData?.value;
+
+    final avatarImg = (data?.images).asUrlString(
+      index: (data?.images?.length ?? 1) - 1,
+      placeholder: ImagePlaceholder.artist,
+    );
+
+    final auth = ref.watch(authenticationProvider);
+
+    if (mediaQuery.mdAndDown) {
+      return Column(
+        mainAxisSize: MainAxisSize.min,
+        spacing: 10,
+        children: [
+          Badge(
+            isLabelVisible: downloadCount > 0,
+            label: Text(downloadCount.toString()),
+            child: IconButton(
+              variance: router.topRoute.name == UserDownloadsRoute.name
+                  ? ButtonVariance.secondary
+                  : ButtonVariance.ghost,
+              icon: const Icon(SpotubeIcons.download),
+              onPressed: () => context.navigateTo(const UserDownloadsRoute()),
+            ),
+          ),
+          const ConnectDeviceButton.sidebar(),
+          IconButton(
+            variance: ButtonVariance.ghost,
+            icon: const Icon(SpotubeIcons.settings),
+            onPressed: () => context.navigateTo(const SettingsRoute()),
+          ),
+        ],
+      );
+    }
+
+    return Container(
+      padding: const EdgeInsets.only(left: 12),
+      width: 180,
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        spacing: 10,
+        children: [
+          SizedBox(
+            width: double.infinity,
+            child: Button(
+              style: router.topRoute.name == UserDownloadsRoute.name
+                  ? ButtonVariance.secondary
+                  : ButtonVariance.outline,
+              onPressed: () {
+                context.navigateTo(const UserDownloadsRoute());
+              },
+              leading: const Icon(SpotubeIcons.download),
+              trailing: downloadCount > 0
+                  ? PrimaryBadge(
+                      child: Text(downloadCount.toString()),
+                    )
+                  : null,
+              child: Text(context.l10n.downloads),
+            ),
+          ),
+          const ConnectDeviceButton.sidebar(),
+          Row(
+            mainAxisSize: MainAxisSize.min,
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            children: [
+              if (auth.asData?.value != null && data == null)
+                const CircularProgressIndicator()
+              else if (data != null)
+                Flexible(
+                  child: GestureDetector(
+                    onTap: () {
+                      context.navigateTo(const ProfileRoute());
+                    },
+                    child: Row(
+                      children: [
+                        Avatar(
+                          initials:
+                              Avatar.getInitials(data.displayName ?? "User"),
+                          provider: UniversalImage.imageProvider(avatarImg),
+                        ),
+                        const SizedBox(width: 10),
+                        Flexible(
+                          child: Text(
+                            data.displayName ?? context.l10n.guest,
+                            maxLines: 1,
+                            softWrap: false,
+                            overflow: TextOverflow.fade,
+                            style: theme.typography.normal
+                                .copyWith(fontWeight: FontWeight.bold),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ),
+              IconButton(
+                variance: ButtonVariance.ghost,
+                icon: const Icon(SpotubeIcons.settings),
+                onPressed: () {
+                  context.navigateTo(const SettingsRoute());
+                },
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+
+  @override
+  bool get selectable => false;
+}

lib/modules/root/spotube_navigation_bar.dart

@@ -1,6 +1,8 @@
+import 'dart:math';
+
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart' show Badge;
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
@@ -12,8 +14,6 @@ import 'package:spotube/models/database/database.dart';
 import 'package:spotube/provider/download_manager_provider.dart';
 import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
 
-import 'package:spotube/utils/service_utils.dart';
-
 final navigationPanelHeight = StateProvider<double>((ref) => 50);
 
 class SpotubeNavigationBar extends HookConsumerWidget {
@@ -23,10 +23,9 @@ class SpotubeNavigationBar extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, ref) {
-    final routerState = GoRouterState.of(context);
+    final mediaQuery = MediaQuery.of(context);
 
     final downloadCount = ref.watch(downloadManagerProvider).$downloadCount;
-    final mediaQuery = MediaQuery.of(context);
     final layoutMode =
         ref.watch(userPreferencesProvider.select((s) => s.layoutMode));
 
@@ -37,14 +36,14 @@ class SpotubeNavigationBar extends HookConsumerWidget {
 
     final panelHeight = ref.watch(navigationPanelHeight);
 
-    final selectedIndex = useMemoized(() {
+    final router = context.watchRouter;
-      final index = navbarTileList.indexWhere(
+    final selectedIndex = max(
-        (e) => routerState.namedLocation(e.name) == routerState.matchedLocation,
+      0,
+      navbarTileList.indexWhere(
+        (e) => router.currentPath.startsWith(e.pathPrefix),
+      ),
     );
 
-      return index == -1 ? 0 : index;
-    }, [navbarTileList, routerState.matchedLocation]);
-
     if (layoutMode == LayoutMode.extended ||
         (mediaQuery.mdAndUp && layoutMode == LayoutMode.adaptive) ||
         panelHeight < 10) {
@@ -63,7 +62,7 @@ class SpotubeNavigationBar extends HookConsumerWidget {
               surfaceBlur: context.theme.surfaceBlur,
               surfaceOpacity: context.theme.surfaceOpacity,
               onSelected: (i) {
-                ServiceUtils.navigateNamed(context, navbarTileList[i].name);
+                context.navigateTo(navbarTileList[i].route);
               },
               children: [
                 for (final tile in navbarTileList)

lib/modules/stats/common/album_item.dart

@@ -1,12 +1,12 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/ui/button_tile.dart';
 import 'package:spotube/modules/album/album_card.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/components/links/artist_link.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/pages/album/album.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class StatsAlbumItem extends StatelessWidget {
   final AlbumSimple album;
@@ -36,25 +36,15 @@ class StatsAlbumItem extends StatelessWidget {
             child: ArtistLink(
               artists: album.artists ?? [],
               mainAxisAlignment: WrapAlignment.start,
-              onOverflowArtistClick: () => ServiceUtils.pushNamed(
+              onOverflowArtistClick: () =>
-                context,
+                  context.navigateTo(AlbumRoute(id: album.id!, album: album)),
-                AlbumPage.name,
-                pathParameters: {
-                  "id": album.id!,
-                },
-              ),
             ),
           ),
         ],
       ),
       trailing: info,
       onPressed: () {
-        ServiceUtils.pushNamed(
+        context.navigateTo(AlbumRoute(id: album.id!, album: album));
-          context,
-          AlbumPage.name,
-          pathParameters: {"id": album.id!},
-          extra: album,
-        );
       },
     );
   }

lib/modules/stats/common/artist_item.dart

@@ -1,10 +1,10 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/components/ui/button_tile.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/pages/artist/artist.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class StatsArtistItem extends StatelessWidget {
   final Artist artist;
@@ -30,11 +30,7 @@ class StatsArtistItem extends StatelessWidget {
       ),
       trailing: info,
       onPressed: () {
-        ServiceUtils.pushNamed(
+        context.navigateTo(ArtistRoute(artistId: artist.id!));
-          context,
-          ArtistPage.name,
-          pathParameters: {"id": artist.id!},
-        );
       },
     );
   }

lib/modules/stats/common/playlist_item.dart

@@ -1,11 +1,11 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/components/ui/button_tile.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/extensions/string.dart';
-import 'package:spotube/pages/playlist/playlist.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class StatsPlaylistItem extends StatelessWidget {
   final PlaylistSimple playlist;
@@ -35,12 +35,7 @@ class StatsPlaylistItem extends StatelessWidget {
       ),
       trailing: info,
       onPressed: () {
-        ServiceUtils.pushNamed(
+        context.navigateTo(PlaylistRoute(id: playlist.id!, playlist: playlist));
-          context,
-          PlaylistPage.name,
-          pathParameters: {"id": playlist.id!},
-          extra: playlist,
-        );
       },
     );
   }

lib/modules/stats/common/track_item.dart

@@ -1,11 +1,11 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/components/links/artist_link.dart';
 import 'package:spotube/components/ui/button_tile.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/pages/track/track.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class StatsTrackItem extends StatelessWidget {
   final Track track;
@@ -34,23 +34,13 @@ class StatsTrackItem extends StatelessWidget {
       subtitle: ArtistLink(
         artists: track.artists!,
         mainAxisAlignment: WrapAlignment.start,
-        onOverflowArtistClick: () => ServiceUtils.pushNamed(
+        onOverflowArtistClick: () {
-          context,
+          context.navigateTo(TrackRoute(trackId: track.id!));
-          TrackPage.name,
-          pathParameters: {
-            "id": track.id!,
         },
       ),
-      ),
       trailing: info,
       onPressed: () {
-        ServiceUtils.pushNamed(
+        context.navigateTo(TrackRoute(trackId: track.id!));
-          context,
-          TrackPage.name,
-          pathParameters: {
-            "id": track.id!,
-          },
-        );
       },
     );
   }

lib/modules/stats/summary/summary.dart

@@ -1,19 +1,14 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:skeletonizer/skeletonizer.dart';
 import 'package:spotube/collections/fake.dart';
 import 'package:spotube/collections/formatters.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/modules/stats/summary/summary_card.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/stats/albums/albums.dart';
-import 'package:spotube/pages/stats/artists/artists.dart';
-import 'package:spotube/pages/stats/fees/fees.dart';
-import 'package:spotube/pages/stats/minutes/minutes.dart';
-import 'package:spotube/pages/stats/playlists/playlists.dart';
-import 'package:spotube/pages/stats/streams/streams.dart';
 import 'package:spotube/provider/history/summary.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class StatsPageSummarySection extends HookConsumerWidget {
   const StatsPageSummarySection({super.key});
@@ -50,7 +45,7 @@ class StatsPageSummarySection extends HookConsumerWidget {
                 description: context.l10n.summary_listened_to_music,
                 color: Colors.indigo,
                 onTap: () {
-                  ServiceUtils.pushNamed(context, StatsMinutesPage.name);
+                  context.navigateTo(const StatsMinutesRoute());
                 },
               ),
               SummaryCard(
@@ -59,7 +54,7 @@ class StatsPageSummarySection extends HookConsumerWidget {
                 description: context.l10n.summary_streamed_overall,
                 color: Colors.blue,
                 onTap: () {
-                  ServiceUtils.pushNamed(context, StatsStreamsPage.name);
+                  context.navigateTo(const StatsStreamsRoute());
                 },
               ),
               SummaryCard.unformatted(
@@ -68,7 +63,7 @@ class StatsPageSummarySection extends HookConsumerWidget {
                 description: context.l10n.summary_owed_to_artists,
                 color: Colors.green,
                 onTap: () {
-                  ServiceUtils.pushNamed(context, StatsStreamFeesPage.name);
+                  context.navigateTo(const StatsStreamsRoute());
                 },
               ),
               SummaryCard(
@@ -77,7 +72,7 @@ class StatsPageSummarySection extends HookConsumerWidget {
                 description: context.l10n.summary_music_reached_you,
                 color: Colors.yellow,
                 onTap: () {
-                  ServiceUtils.pushNamed(context, StatsArtistsPage.name);
+                  context.navigateTo(const StatsArtistsRoute());
                 },
               ),
               SummaryCard(
@@ -86,7 +81,7 @@ class StatsPageSummarySection extends HookConsumerWidget {
                 description: context.l10n.summary_got_your_love,
                 color: Colors.pink,
                 onTap: () {
-                  ServiceUtils.pushNamed(context, StatsAlbumsPage.name);
+                  context.navigateTo(const StatsAlbumsRoute());
                 },
               ),
               SummaryCard(
@@ -95,7 +90,7 @@ class StatsPageSummarySection extends HookConsumerWidget {
                 description: context.l10n.summary_were_on_repeat,
                 color: Colors.teal,
                 onTap: () {
-                  ServiceUtils.pushNamed(context, StatsPlaylistsPage.name);
+                  context.navigateTo(const StatsPlaylistsRoute());
                 },
               ),
             ]),

lib/modules/stats/top/top.dart

@@ -56,6 +56,7 @@ class StatsPageTopSection extends HookConsumerWidget {
             floating: true,
             elevation: 0,
             backgroundColor: context.theme.colorScheme.background,
+            automaticallyImplyLeading: false,
             flexibleSpace: Padding(
               padding: const EdgeInsets.all(8.0),
               child: Row(

lib/pages/album/album.dart

@@ -1,3 +1,4 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
@@ -7,12 +8,15 @@ import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 
+@RoutePage()
 class AlbumPage extends HookConsumerWidget {
   static const name = "album";
 
   final AlbumSimple album;
+  final String id;
   const AlbumPage({
     super.key,
+    @PathParam("id") required this.id,
     required this.album,
   });
 

lib/pages/artist/artist.dart

@@ -13,12 +13,17 @@ import 'package:spotube/pages/artist/section/header.dart';
 import 'package:spotube/pages/artist/section/related_artists.dart';
 import 'package:spotube/pages/artist/section/top_tracks.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class ArtistPage extends HookConsumerWidget {
   static const name = "artist";
 
   final String artistId;
-  const ArtistPage(this.artistId, {super.key});
+  const ArtistPage(
+    @PathParam("id") this.artistId, {
+    super.key,
+  });
 
   @override
   Widget build(BuildContext context, ref) {

lib/pages/connect/connect.dart

@@ -1,14 +1,15 @@
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/ui/button_tile.dart';
 import 'package:spotube/modules/connect/local_devices.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/connect/control/control.dart';
 import 'package:spotube/provider/connect/clients.dart';
-import 'package:spotube/utils/service_utils.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class ConnectPage extends HookConsumerWidget {
   static const name = "connect";
 
@@ -22,12 +23,11 @@ class ConnectPage extends HookConsumerWidget {
     final connectClientsNotifier = ref.read(connectClientsProvider.notifier);
     final discoveredDevices = connectClients.asData?.value.services;
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
-        TitleBar(
+          TitleBar(title: Text(context.l10n.devices)),
-          automaticallyImplyLeading: true,
-          title: Text(context.l10n.devices),
-        )
         ],
         child: Padding(
           padding: const EdgeInsets.all(10.0),
@@ -71,10 +71,7 @@ class ConnectPage extends HookConsumerWidget {
                         : null,
                     onPressed: () {
                       if (selected) {
-                      ServiceUtils.pushNamed(
+                        context.navigateTo(const ConnectControlRoute());
-                        context,
-                        ConnectControlPage.name,
-                      );
                       } else {
                         connectClientsNotifier.resolveService(device);
                       }
@@ -86,6 +83,7 @@ class ConnectPage extends HookConsumerWidget {
             ],
           ),
         ),
+      ),
     );
   }
 }

lib/pages/connect/control/control.dart

@@ -1,7 +1,8 @@
-import 'package:go_router/go_router.dart';
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/modules/player/player_queue.dart';
 import 'package:spotube/modules/player/volume_slider.dart';
@@ -13,11 +14,9 @@ import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/duration.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/pages/track/track.dart';
 import 'package:spotube/provider/connect/clients.dart';
 import 'package:spotube/provider/connect/connect.dart';
 import 'package:media_kit/media_kit.dart' hide Track;
-import 'package:spotube/utils/service_utils.dart';
 
 class RemotePlayerQueue extends ConsumerWidget {
   const RemotePlayerQueue({super.key});
@@ -46,6 +45,7 @@ class RemotePlayerQueue extends ConsumerWidget {
   }
 }
 
+@RoutePage()
 class ConnectControlPage extends HookConsumerWidget {
   static const name = "connect_control";
 
@@ -65,7 +65,7 @@ class ConnectControlPage extends HookConsumerWidget {
 
     ref.listen(connectClientsProvider, (prev, next) {
       if (next.asData?.value.resolvedService == null) {
-        context.pop();
+        context.back();
       }
     });
 
@@ -75,7 +75,6 @@ class ConnectControlPage extends HookConsumerWidget {
         headers: [
           TitleBar(
             title: Text(resolvedService!.name),
-            automaticallyImplyLeading: true,
           )
         ],
         child: LayoutBuilder(builder: (context, constrains) {
@@ -115,12 +114,9 @@ class ConnectControlPage extends HookConsumerWidget {
                               style: typography.h4,
                               onTap: () {
                                 if (playlist.activeTrack == null) return;
-                                ServiceUtils.pushNamed(
+                                context.navigateTo(
-                                  context,
+                                  TrackRoute(
-                                  TrackPage.name,
+                                      trackId: playlist.activeTrack!.id!),
-                                  pathParameters: {
-                                    "id": playlist.activeTrack!.id!,
-                                  },
                                 );
                               },
                             ),
@@ -130,13 +126,8 @@ class ConnectControlPage extends HookConsumerWidget {
                               artists: playlist.activeTrack?.artists ?? [],
                               textStyle: typography.normal,
                               mainAxisAlignment: WrapAlignment.start,
-                              onOverflowArtistClick: () =>
+                              onOverflowArtistClick: () => context.navigateTo(
-                                  ServiceUtils.pushNamed(
+                                TrackRoute(trackId: playlist.activeTrack!.id!),
-                                context,
-                                TrackPage.name,
-                                pathParameters: {
-                                  "id": playlist.activeTrack!.id!,
-                                },
                               ),
                             ),
                           ),

lib/pages/getting_started/getting_started.dart

@@ -8,11 +8,13 @@ import 'package:spotube/pages/getting_started/sections/greeting.dart';
 import 'package:spotube/pages/getting_started/sections/playback.dart';
 import 'package:spotube/pages/getting_started/sections/region.dart';
 import 'package:spotube/pages/getting_started/sections/support.dart';
+import 'package:auto_route/auto_route.dart';
 
-class GettingStarting extends HookConsumerWidget {
+@RoutePage()
+class GettingStartedPage extends HookConsumerWidget {
   static const name = "getting_started";
 
-  const GettingStarting({super.key});
+  const GettingStartedPage({super.key});
 
   @override
   Widget build(BuildContext context, ref) {

lib/pages/getting_started/sections/support.dart

@@ -1,11 +1,11 @@
-import 'package:go_router/go_router.dart';
+import 'package:auto_route/auto_route.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotube/collections/env.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/modules/getting_started/blur_card.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/home/home.dart';
 import 'package:spotube/pages/mobile_login/hooks/login_callback.dart';
 import 'package:spotube/services/kv_store/kv_store.dart';
 import 'package:url_launcher/url_launcher_string.dart';
@@ -112,7 +112,7 @@ class GettingStartedScreenSupportSection extends HookConsumerWidget {
                   onPressed: () async {
                     await KVStoreService.setDoneGettingStarted(true);
                     if (context.mounted) {
-                      context.goNamed(HomePage.name);
+                      context.navigateTo(const HomeRoute());
                     }
                   },
                   child: Text(context.l10n.browse_anonymously),

lib/pages/home/feed/feed_section.dart

@@ -1,3 +1,4 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
@@ -10,11 +11,15 @@ import 'package:spotube/modules/playlist/playlist_card.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/provider/spotify/views/home_section.dart';
 
+@RoutePage()
 class HomeFeedSectionPage extends HookConsumerWidget {
   static const name = "home_feed_section";
 
   final String sectionUri;
-  const HomeFeedSectionPage({super.key, required this.sectionUri});
+  const HomeFeedSectionPage({
+    super.key,
+    @PathParam("feedId") required this.sectionUri,
+  });
 
   @override
   Widget build(BuildContext context, ref) {
@@ -23,13 +28,14 @@ class HomeFeedSectionPage extends HookConsumerWidget {
     final controller = useScrollController();
     final isArtist = section.items.every((item) => item.artist != null);
 
-    return Skeletonizer(
+    return SafeArea(
+      bottom: false,
+      child: Skeletonizer(
         enabled: homeFeedSection.isLoading,
         child: Scaffold(
           headers: [
             TitleBar(
               title: Text(section.title ?? ""),
-            automaticallyImplyLeading: true,
             )
           ],
           child: Padding(
@@ -39,7 +45,8 @@ class HomeFeedSectionPage extends HookConsumerWidget {
               slivers: [
                 if (isArtist)
                   SliverGrid.builder(
-                  gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
+                    gridDelegate:
+                        const SliverGridDelegateWithMaxCrossAxisExtent(
                       maxCrossAxisExtent: 200,
                       mainAxisExtent: 250,
                       crossAxisSpacing: 8,
@@ -88,6 +95,7 @@ class HomeFeedSectionPage extends HookConsumerWidget {
             ),
           ),
         ),
+      ),
     );
   }
 }

lib/pages/home/genres/genre_playlists.dart

@@ -1,12 +1,12 @@
 import 'package:flutter/material.dart' show CollapseMode, FlexibleSpaceBar;
 import 'package:flutter_hooks/flutter_hooks.dart';
 
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 
 import 'package:spotify/spotify.dart' hide Offset;
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/button/back_button.dart';
 import 'package:spotube/components/playbutton_view/playbutton_view.dart';
 import 'package:spotube/hooks/utils/use_custom_status_bar_color.dart';
@@ -16,12 +16,19 @@ import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/utils/platform.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class GenrePlaylistsPage extends HookConsumerWidget {
   static const name = "genre_playlists";
 
   final Category category;
-  const GenrePlaylistsPage({super.key, required this.category});
+  final String id;
+  const GenrePlaylistsPage({
+    super.key,
+    @PathParam("categoryId") required this.id,
+    required this.category,
+  });
 
   @override
   Widget build(BuildContext context, ref) {
@@ -30,16 +37,16 @@ class GenrePlaylistsPage extends HookConsumerWidget {
     final playlistsNotifier =
         ref.read(categoryPlaylistsProvider(category.id!).notifier);
     final scrollController = useScrollController();
-    final routeName = GoRouterState.of(context).name;
 
     useCustomStatusBarColor(
       Colors.black,
-      routeName == GenrePlaylistsPage.name,
+      context.watchRouter.topRoute.name == GenrePlaylistsRoute.name,
       noSetBGColor: true,
       automaticSystemUiAdjustment: false,
     );
 
-    return Scaffold(
+    return SafeArea(
+      child: Scaffold(
         headers: [
           if (kIsDesktop)
             const TitleBar(
@@ -68,7 +75,9 @@ class GenrePlaylistsPage extends HookConsumerWidget {
             child: CustomScrollView(
               controller: scrollController,
               slivers: [
-              SliverAppBar(
+                SliverSafeArea(
+                  bottom: false,
+                  sliver: SliverAppBar(
                     automaticallyImplyLeading: false,
                     leading: kIsMobile ? const BackButton() : null,
                     expandedHeight: mediaQuery.mdAndDown ? 200 : 150,
@@ -104,6 +113,7 @@ class GenrePlaylistsPage extends HookConsumerWidget {
                       collapseMode: CollapseMode.parallax,
                     ),
                   ),
+                ),
                 const SliverGap(20),
                 SliverSafeArea(
                   top: false,
@@ -117,8 +127,8 @@ class GenrePlaylistsPage extends HookConsumerWidget {
                       isLoading: playlists.isLoading,
                       hasMore: playlists.asData?.value.hasMore == true,
                       onRequestMore: playlistsNotifier.fetchMore,
-                    listItemBuilder: (context, index) =>
+                      listItemBuilder: (context, index) => PlaylistCard.tile(
-                        PlaylistCard.tile(playlists.asData!.value.items[index]),
+                          playlists.asData!.value.items[index]),
                       gridItemBuilder: (context, index) =>
                           PlaylistCard(playlists.asData!.value.items[index]),
                     ),
@@ -129,6 +139,7 @@ class GenrePlaylistsPage extends HookConsumerWidget {
             ),
           ),
         ),
+      ),
     );
   }
 }

lib/pages/home/genres/genres.dart

@@ -3,17 +3,19 @@ import 'dart:math';
 import 'package:auto_size_text/auto_size_text.dart';
 
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 import 'package:spotube/collections/gradients.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/home/genres/genre_playlists.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class GenrePage extends HookConsumerWidget {
   static const name = "genre";
   const GenrePage({super.key});
@@ -30,7 +32,6 @@ class GenrePage extends HookConsumerWidget {
         headers: [
           TitleBar(
             title: Text(context.l10n.explore_genres),
-            automaticallyImplyLeading: true,
           )
         ],
         child: GridView.builder(
@@ -49,12 +50,11 @@ class GenrePage extends HookConsumerWidget {
             final gradient = gradients[Random().nextInt(gradients.length)];
             return CardImage(
               onPressed: () {
-                context.pushNamed(
+                context.navigateTo(
-                  GenrePlaylistsPage.name,
+                  GenrePlaylistsRoute(
-                  pathParameters: {
+                    id: category.id!,
-                    "categoryId": category.id!,
+                    category: category,
-                  },
+                  ),
-                  extra: category,
                 );
               },
               image: Stack(

lib/pages/home/home.dart

@@ -1,9 +1,11 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 import 'package:spotube/collections/assets.gen.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/models/database/database.dart';
 import 'package:spotube/modules/connect/connect_device.dart';
@@ -16,11 +18,10 @@ import 'package:spotube/modules/home/sections/new_releases.dart';
 import 'package:spotube/modules/home/sections/recent.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/constrains.dart';
-import 'package:spotube/pages/settings/settings.dart';
 import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
 import 'package:spotube/utils/platform.dart';
-import 'package:spotube/utils/service_utils.dart';
 
+@RoutePage()
 class HomePage extends HookConsumerWidget {
   static const name = "home";
   const HomePage({super.key});
@@ -53,7 +54,7 @@ class HomePage extends HookConsumerWidget {
                     IconButton.ghost(
                       icon: const Icon(SpotubeIcons.settings, size: 20),
                       onPressed: () {
-                        ServiceUtils.pushNamed(context, SettingsPage.name);
+                        context.navigateTo(const SettingsRoute());
                       },
                     ),
                     const Gap(10),

lib/pages/lastfm_login/lastfm_login.dart

@@ -1,6 +1,5 @@
 import 'package:flutter_hooks/flutter_hooks.dart';
 
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotube/collections/spotube_icons.dart';
@@ -9,14 +8,15 @@ import 'package:spotube/components/dialogs/prompt_dialog.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/provider/scrobbler/scrobbler.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class LastFMLoginPage extends HookConsumerWidget {
   static const name = "lastfm_login";
   const LastFMLoginPage({super.key});
 
   @override
   Widget build(BuildContext context, ref) {
-    final router = GoRouter.of(context);
     final scrobblerNotifier = ref.read(scrobblerProvider.notifier);
 
     final usernameKey =
@@ -31,6 +31,7 @@ class LastFMLoginPage extends HookConsumerWidget {
     return Scaffold(
       headers: const [
         SafeArea(
+          bottom: false,
           child: TitleBar(
             leading: [BackButton()],
           ),
@@ -39,7 +40,8 @@ class LastFMLoginPage extends HookConsumerWidget {
       child: Row(
         mainAxisAlignment: MainAxisAlignment.center,
         children: [
-          Container(
+          Flexible(
+            child: Container(
               constraints: const BoxConstraints(maxWidth: 400),
               alignment: Alignment.center,
               padding: const EdgeInsets.all(16),
@@ -53,7 +55,9 @@ class LastFMLoginPage extends HookConsumerWidget {
                         values[usernameKey].trim(),
                         values[passwordKey],
                       );
-                    router.pop();
+                      if (context.mounted) {
+                        context.back();
+                      }
                     } catch (e) {
                       if (context.mounted) {
                         showPromptDialog(
@@ -137,6 +141,7 @@ class LastFMLoginPage extends HookConsumerWidget {
                 ),
               ),
             ),
+          ),
         ],
       ),
     );

lib/pages/library/library.dart

@@ -1,47 +1,54 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart' show Badge;
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/side_bar_tiles.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/library/user_downloads.dart';
 import 'package:spotube/provider/download_manager_provider.dart';
 
+@RoutePage()
 class LibraryPage extends HookConsumerWidget {
-  final Widget child;
+  const LibraryPage({super.key});
-  const LibraryPage({super.key, required this.child});
 
   @override
   Widget build(BuildContext context, ref) {
     final downloadingCount = ref.watch(downloadManagerProvider).$downloadCount;
-    final routerState = GoRouterState.of(context);
+    final router = context.watchRouter;
     final sidebarLibraryTileList = useMemoized(
       () => [
         ...getSidebarLibraryTileList(context.l10n),
         SideBarTiles(
           id: "downloads",
+          pathPrefix: "library/downloads",
           title: context.l10n.downloads,
-          name: UserDownloadsPage.name,
+          route: const UserDownloadsRoute(),
           icon: SpotubeIcons.download,
         ),
       ],
       [context.l10n],
     );
     final index = sidebarLibraryTileList.indexWhere(
-      (e) => routerState.namedLocation(e.name) == routerState.matchedLocation,
+      (e) => router.currentPath.startsWith(e.pathPrefix),
     );
 
-    return SafeArea(
+    return PopScope(
+      canPop: false,
+      onPopInvokedWithResult: (didPop, result) {
+        context.navigateTo(const HomeRoute());
+      },
+      child: SafeArea(
         bottom: false,
         child: LayoutBuilder(builder: (context, constraints) {
           return Scaffold(
             headers: [
               if (constraints.smAndDown)
                 TitleBar(
+                  automaticallyImplyLeading: false,
                   child: SingleChildScrollView(
                     scrollDirection: Axis.horizontal,
                     child: TabList(
@@ -50,13 +57,13 @@ class LibraryPage extends HookConsumerWidget {
                         for (final tile in sidebarLibraryTileList)
                           TabButton(
                             child: Badge(
-                            isLabelVisible:
+                              isLabelVisible: tile.id == 'downloads' &&
-                                tile.id == 'downloads' && downloadingCount > 0,
+                                  downloadingCount > 0,
                               label: Text(downloadingCount.toString()),
                               child: Text(tile.title),
                             ),
                             onPressed: () {
-                            context.goNamed(tile.name);
+                              context.navigateTo(tile.route);
                             },
                           ),
                       ],
@@ -65,9 +72,10 @@ class LibraryPage extends HookConsumerWidget {
                 ),
               const Gap(10),
             ],
-          child: child,
+            child: const AutoRouter(),
           );
         }),
+      ),
     );
   }
 }

lib/pages/library/playlist_generate/playlist_generate.dart

@@ -1,10 +1,11 @@
 import 'package:collection/collection.dart';
 
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotify_markets.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/button/back_button.dart';
@@ -23,9 +24,11 @@ import 'package:spotube/models/spotify/recommendation_seeds.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/provider/spotify_provider.dart';
 import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
+import 'package:auto_route/auto_route.dart';
 
 const RecommendationAttribute zeroValues = (min: 0, target: 0, max: 0);
 
+@RoutePage()
 class PlaylistGeneratorPage extends HookConsumerWidget {
   static const name = "playlist_generator";
 
@@ -253,7 +256,9 @@ class PlaylistGeneratorPage extends HookConsumerWidget {
 
     final controller = useScrollController();
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
             leading: const [BackButton()],
@@ -305,8 +310,8 @@ class PlaylistGeneratorPage extends HookConsumerWidget {
                                     ),
                                     Expanded(
                                       child: Slider(
-                                      value:
+                                        value: SliderValue.single(
-                                          SliderValue.single(value.toDouble()),
+                                            value.toDouble()),
                                         min: 10,
                                         max: 100,
                                         divisions: 9,
@@ -652,17 +657,19 @@ class PlaylistGeneratorPage extends HookConsumerWidget {
                                       seedArtists: artists.value
                                           .map((a) => a.id!)
                                           .toList(),
-                                    seedTracks:
+                                      seedTracks: tracks.value
-                                        tracks.value.map((t) => t.id!).toList(),
+                                          .map((t) => t.id!)
+                                          .toList(),
                                       seedGenres: genres.value,
                                       limit: limit.value,
                                       max: max.value,
                                       min: min.value,
                                       target: target.value,
                                     );
-                                  GoRouter.of(context).push(
+                                    context.navigateTo(
-                                    "/library/generate/result",
+                                      PlaylistGenerateResultRoute(
-                                    extra: routeState,
+                                        state: routeState,
+                                      ),
                                     );
                                   },
                             child: Text(context.l10n.generate),
@@ -676,6 +683,7 @@ class PlaylistGeneratorPage extends HookConsumerWidget {
             ),
           ),
         ),
+      ),
     );
   }
 }

lib/pages/library/playlist_generate/playlist_generate_result.dart

@@ -1,8 +1,10 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/button/back_button.dart';
 import 'package:spotube/modules/library/playlist_generate/simple_track_tile.dart';
@@ -11,10 +13,10 @@ import 'package:spotube/components/dialogs/playlist_add_track_dialog.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/models/spotify/recommendation_seeds.dart';
-import 'package:spotube/pages/playlist/playlist.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 
+@RoutePage()
 class PlaylistGenerateResultPage extends HookConsumerWidget {
   static const name = "playlist_generate_result";
 
@@ -27,8 +29,6 @@ class PlaylistGenerateResultPage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, ref) {
-    final router = GoRouter.of(context);
-
     final playlistNotifier = ref.watch(audioPlayerProvider.notifier);
 
     final generatedPlaylist = ref.watch(generatePlaylistProvider(state));
@@ -48,7 +48,9 @@ class PlaylistGenerateResultPage extends HookConsumerWidget {
     final isAllTrackSelected = selectedTracks.value.length ==
         (generatedPlaylist.asData?.value.length ?? 0);
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: const [
           TitleBar(leading: [BackButton()])
         ],
@@ -101,7 +103,8 @@ class PlaylistGenerateResultPage extends HookConsumerWidget {
                               : () async {
                                   await playlistNotifier.addTracks(
                                     generatedPlaylist.asData!.value.where(
-                                    (e) => selectedTracks.value.contains(e.id!),
+                                      (e) =>
+                                          selectedTracks.value.contains(e.id!),
                                     ),
                                   );
                                   if (context.mounted) {
@@ -134,13 +137,12 @@ class PlaylistGenerateResultPage extends HookConsumerWidget {
                                     ),
                                   );
 
-                                if (playlist != null) {
+                                  if (playlist != null && context.mounted) {
-                                  router.goNamed(
+                                    context.navigateTo(
-                                    PlaylistPage.name,
+                                      PlaylistRoute(
-                                    pathParameters: {
+                                        id: playlist.id!,
-                                      "id": playlist.id!,
+                                        playlist: playlist,
-                                    },
+                                      ),
-                                    extra: playlist,
                                     );
                                   }
                                 },
@@ -153,11 +155,13 @@ class PlaylistGenerateResultPage extends HookConsumerWidget {
                               : () async {
                                   final hasAdded = await showDialog<bool>(
                                     context: context,
-                                  builder: (context) => PlaylistAddTrackDialog(
+                                    builder: (context) =>
+                                        PlaylistAddTrackDialog(
                                       openFromPlaylist: null,
                                       tracks: selectedTracks.value
                                           .map(
-                                          (e) => generatedPlaylist.asData!.value
+                                            (e) => generatedPlaylist
+                                                .asData!.value
                                                 .firstWhere(
                                               (element) => element.id == e,
                                             ),
@@ -245,7 +249,8 @@ class PlaylistGenerateResultPage extends HookConsumerWidget {
                                   child: GestureDetector(
                                     onTap: () {
                                       selectedTracks.value.contains(track.id)
-                                        ? selectedTracks.value.remove(track.id)
+                                          ? selectedTracks.value
+                                              .remove(track.id)
                                           : selectedTracks.value.add(track.id!);
                                       selectedTracks.value =
                                           selectedTracks.value.toList();
@@ -261,6 +266,7 @@ class PlaylistGenerateResultPage extends HookConsumerWidget {
                   ],
                 ),
               ),
+      ),
     );
   }
 }

lib/pages/library/user_albums.dart

@@ -15,7 +15,9 @@ import 'package:spotube/components/fallbacks/anonymous_fallback.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class UserAlbumsPage extends HookConsumerWidget {
   static const name = 'user_albums';
   const UserAlbumsPage({super.key});
@@ -63,6 +65,7 @@ class UserAlbumsPage extends HookConsumerWidget {
               controller: controller,
               slivers: [
                 SliverAppBar(
+                  automaticallyImplyLeading: false,
                   backgroundColor: Theme.of(context).colorScheme.background,
                   floating: true,
                   flexibleSpace: Padding(

lib/pages/library/user_artists.dart

@@ -18,7 +18,9 @@ import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class UserArtistsPage extends HookConsumerWidget {
   static const name = 'user_artists';
   const UserArtistsPage({super.key});
@@ -70,6 +72,7 @@ class UserArtistsPage extends HookConsumerWidget {
                 controller: controller,
                 slivers: [
                   SliverAppBar(
+                    automaticallyImplyLeading: false,
                     backgroundColor: Theme.of(context).colorScheme.background,
                     floating: true,
                     flexibleSpace: SizedBox(

lib/pages/library/user_downloads.dart

@@ -5,7 +5,9 @@ import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotube/modules/library/user_downloads/download_item.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/provider/download_manager_provider.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class UserDownloadsPage extends HookConsumerWidget {
   static const name = 'user_downloads';
   const UserDownloadsPage({super.key});

lib/pages/library/user_local_tracks/local_folder.dart

@@ -29,7 +29,9 @@ import 'package:spotube/provider/local_tracks/local_tracks_provider.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
 import 'package:spotube/utils/service_utils.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class LocalLibraryPage extends HookConsumerWidget {
   static const name = "local_library_page";
 

lib/pages/library/user_local_tracks/user_local_tracks.dart

@@ -1,3 +1,4 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:file_picker/file_picker.dart';
 import 'package:file_selector/file_selector.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
@@ -24,6 +25,7 @@ enum SortBy {
   album,
 }
 
+@RoutePage()
 class UserLocalLibraryPage extends HookConsumerWidget {
   static const name = 'user_local_library';
   const UserLocalLibraryPage({super.key});

lib/pages/library/user_playlists.dart

@@ -7,6 +7,7 @@ import 'package:shadcn_flutter/shadcn_flutter.dart' hide Image;
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 
 import 'package:spotify/spotify.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/playbutton_view/playbutton_view.dart';
 import 'package:spotube/modules/playlist/playlist_create_dialog.dart';
@@ -14,12 +15,12 @@ import 'package:spotube/components/inter_scrollbar/inter_scrollbar.dart';
 import 'package:spotube/components/fallbacks/anonymous_fallback.dart';
 import 'package:spotube/modules/playlist/playlist_card.dart';
 import 'package:spotube/extensions/context.dart';
-import 'package:spotube/pages/library/playlist_generate/playlist_generate.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/utils/platform.dart';
-import 'package:spotube/utils/service_utils.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class UserPlaylistsPage extends HookConsumerWidget {
   static const name = 'user_playlists';
   const UserPlaylistsPage({super.key});
@@ -90,6 +91,7 @@ class UserPlaylistsPage extends HookConsumerWidget {
             controller: controller,
             slivers: [
               SliverAppBar(
+                automaticallyImplyLeading: false,
                 floating: true,
                 backgroundColor: context.theme.colorScheme.background,
                 flexibleSpace: Container(
@@ -113,10 +115,7 @@ class UserPlaylistsPage extends HookConsumerWidget {
                         leading: const Icon(SpotubeIcons.magic),
                         child: Text(context.l10n.generate),
                         onPressed: () {
-                          ServiceUtils.pushNamed(
+                          context.navigateTo(const PlaylistGeneratorRoute());
-                            context,
-                            PlaylistGeneratorPage.name,
-                          );
                         },
                       ),
                       const Gap(10),

lib/pages/lyrics/lyrics.dart

@@ -14,7 +14,9 @@ import 'package:spotube/pages/lyrics/synced_lyrics.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/utils/platform.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class LyricsPage extends HookConsumerWidget {
   static const name = "lyrics";
 

lib/pages/lyrics/mini_lyrics.dart

@@ -1,9 +1,10 @@
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:palette_generator/palette_generator.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/modules/player/player_controls.dart';
 import 'package:spotube/modules/player/player_queue.dart';
@@ -14,7 +15,9 @@ import 'package:spotube/pages/lyrics/synced_lyrics.dart';
 import 'package:spotube/provider/audio_player/audio_player.dart';
 import 'package:spotube/utils/platform.dart';
 import 'package:window_manager/window_manager.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class MiniLyricsPage extends HookConsumerWidget {
   static const name = "mini_lyrics";
 
@@ -265,7 +268,7 @@ class MiniLyricsPage extends HookConsumerWidget {
                               const Duration(milliseconds: 200));
                         } finally {
                           if (context.mounted) {
-                            GoRouter.of(context).go('/lyrics');
+                            context.navigateTo(LyricsRoute());
                           }
                         }
                       },

lib/pages/mobile_login/hooks/login_callback.dart

@@ -1,14 +1,15 @@
 import 'dart:io';
 
+import 'package:auto_route/auto_route.dart';
 import 'package:desktop_webview_window/desktop_webview_window.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart' hide join;
 import 'package:flutter/services.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:path/path.dart';
 import 'package:path_provider/path_provider.dart';
-import 'package:spotube/pages/mobile_login/mobile_login.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/pages/mobile_login/no_webview_runtime_dialog.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/utils/platform.dart';
@@ -20,7 +21,7 @@ Future<void> Function() useLoginCallback(WidgetRef ref) {
 
   return useCallback(() async {
     if (kIsMobile || kIsMacOS) {
-      context.pushNamed(WebViewLogin.name);
+      context.navigateTo(const WebViewLoginRoute());
       return;
     }
 
@@ -57,7 +58,7 @@ Future<void> Function() useLoginCallback(WidgetRef ref) {
 
               webview.close();
               if (context.mounted) {
-                context.go("/");
+                context.navigateTo(const HomeRoute());
               }
             });
           }
@@ -76,5 +77,5 @@ Future<void> Function() useLoginCallback(WidgetRef ref) {
         });
       }
     }
-  }, [authNotifier, theme, context.go, context.pushNamed]);
+  }, [authNotifier, theme, context.navigateTo]);
 }

lib/pages/mobile_login/mobile_login.dart

@@ -1,16 +1,19 @@
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:flutter_inappwebview/flutter_inappwebview.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/button/back_button.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/utils/platform.dart';
+import 'package:auto_route/auto_route.dart';
 
-class WebViewLogin extends HookConsumerWidget {
+@RoutePage()
+class WebViewLoginPage extends HookConsumerWidget {
   static const name = "login";
-  const WebViewLogin({super.key});
+  const WebViewLoginPage({super.key});
 
   @override
   Widget build(BuildContext context, ref) {
@@ -24,7 +27,9 @@ class WebViewLogin extends HookConsumerWidget {
       );
     }
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: const [
           TitleBar(
             leading: [BackButton(color: Colors.white)],
@@ -64,11 +69,12 @@ class WebViewLogin extends HookConsumerWidget {
               await authenticationNotifier.login(cookieHeader);
               if (context.mounted) {
                 // ignore: use_build_context_synchronously
-              GoRouter.of(context).go("/");
+                context.navigateTo(const HomeRoute());
               }
             }
           },
         ),
+      ),
     );
   }
 }

lib/pages/playlist/liked_playlist.dart

@@ -5,7 +5,9 @@ import 'package:spotube/components/track_presentation/presentation_props.dart';
 import 'package:spotube/components/track_presentation/track_presentation.dart';
 import 'package:spotube/pages/playlist/playlist.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class LikedPlaylistPage extends HookConsumerWidget {
   static const name = PlaylistPage.name;
 

lib/pages/playlist/playlist.dart

@@ -9,13 +9,17 @@ import 'package:spotube/components/track_presentation/use_is_user_playlist.dart'
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class PlaylistPage extends HookConsumerWidget {
   static const name = "playlist";
 
   final PlaylistSimple _playlist;
+  final String id;
   const PlaylistPage({
     super.key,
+    @PathParam("id") required this.id,
     required PlaylistSimple playlist,
   }) : _playlist = playlist;
 

lib/pages/profile/profile.dart

@@ -12,7 +12,9 @@ import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:url_launcher/url_launcher_string.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class ProfilePage extends HookConsumerWidget {
   static const name = "profile";
 
@@ -42,7 +44,6 @@ class ProfilePage extends HookConsumerWidget {
         headers: [
           TitleBar(
             title: Text(context.l10n.profile),
-            automaticallyImplyLeading: true,
           )
         ],
         child: Skeletonizer(

lib/pages/root/root_app.dart

@@ -1,27 +1,19 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
-import 'package:spotube/collections/side_bar_tiles.dart';
-import 'package:spotube/components/framework/app_pop_scope.dart';
 import 'package:spotube/modules/root/bottom_player.dart';
-import 'package:spotube/modules/root/sidebar.dart';
+import 'package:spotube/modules/root/sidebar/sidebar.dart';
 import 'package:spotube/modules/root/spotube_navigation_bar.dart';
-import 'package:spotube/extensions/context.dart';
 import 'package:spotube/hooks/configurators/use_endless_playback.dart';
 import 'package:spotube/modules/root/use_downloader_dialogs.dart';
 import 'package:spotube/modules/root/use_global_subscriptions.dart';
-import 'package:spotube/pages/home/home.dart';
 import 'package:spotube/provider/glance/glance.dart';
-import 'package:spotube/utils/platform.dart';
 
-class RootApp extends HookConsumerWidget {
+@RoutePage()
-  final Widget child;
+class RootAppPage extends HookConsumerWidget {
-  const RootApp({
+  const RootAppPage({super.key});
-    required this.child,
-    super.key,
-  });
 
   @override
   Widget build(BuildContext context, ref) {
@@ -45,42 +37,19 @@ class RootApp extends HookConsumerWidget {
       return null;
     }, [backgroundColor, brightness]);
 
-    final navTileNames = useMemoized(() {
-      return getSidebarTileList(context.l10n).map((s) => s.name).toList();
-    }, []);
-
     final scaffold = MediaQuery.removeViewInsets(
       context: context,
       removeBottom: true,
-      child: Scaffold(
+      child: const Scaffold(
-        footers: const [
+        footers: [
           BottomPlayer(),
           SpotubeNavigationBar(),
         ],
         floatingFooter: true,
-        child: Sidebar(child: child),
+        child: Sidebar(child: AutoRouter()),
       ),
     );
 
-    if (!kIsAndroid) {
     return scaffold;
   }
-
-    final topRoute = GoRouterState.of(context).topRoute;
-    final canPop = topRoute != null && !navTileNames.contains(topRoute.name);
-
-    return AppPopScope(
-      canPop: canPop,
-      onPopInvoked: (didPop) {
-        if (didPop) return;
-
-        if (topRoute?.name == HomePage.name) {
-          SystemNavigator.pop();
-        } else {
-          context.goNamed(HomePage.name);
-        }
-      },
-      child: scaffold,
-    );
-  }
 }

lib/pages/search/search.dart

@@ -6,6 +6,7 @@ import 'package:spotify/spotify.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:fuzzywuzzy/fuzzywuzzy.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:spotube/collections/routes.gr.dart';
 
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/inter_scrollbar/inter_scrollbar.dart';
@@ -20,7 +21,9 @@ import 'package:spotube/pages/search/sections/tracks.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/services/kv_store/kv_store.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class SearchPage extends HookConsumerWidget {
   static const name = "search";
 
@@ -66,12 +69,17 @@ class SearchPage extends HookConsumerWidget {
       );
     }
 
-    return SafeArea(
+    return PopScope(
+      canPop: false,
+      onPopInvokedWithResult: (didPop, result) {
+        context.navigateTo(const HomeRoute());
+      },
+      child: SafeArea(
         bottom: false,
         child: Scaffold(
           headers: [
             if (kTitlebarVisible)
-            const TitleBar(automaticallyImplyLeading: true, height: 30)
+              const TitleBar(automaticallyImplyLeading: false, height: 30)
           ],
           child: auth.asData?.value == null
               ? const AnonymousFallback()
@@ -121,7 +129,8 @@ class SearchPage extends HookConsumerWidget {
                                       trailing: AnimatedCrossFade(
                                         duration:
                                             const Duration(milliseconds: 300),
-                                      crossFadeState: controller.text.isNotEmpty
+                                        crossFadeState:
+                                            controller.text.isNotEmpty
                                                 ? CrossFadeState.showFirst
                                                 : CrossFadeState.showSecond,
                                         firstChild: IconButton.ghost(
@@ -131,17 +140,18 @@ class SearchPage extends HookConsumerWidget {
                                             controller.clear();
                                           },
                                         ),
-                                      secondChild:
+                                        secondChild: const SizedBox.square(
-                                          const SizedBox.square(dimension: 28),
+                                            dimension: 28),
                                       ),
                                       onAcceptSuggestion: (index) {
-                                      controller.text =
+                                        controller.text = KVStoreService
-                                          KVStoreService.recentSearches[index];
+                                            .recentSearches[index];
                                         ref
                                                 .read(searchTermStateProvider
                                                     .notifier)
                                                 .state =
-                                          KVStoreService.recentSearches[index];
+                                            KVStoreService
+                                                .recentSearches[index];
                                       },
                                       onChanged: (value) {},
                                       onSubmitted: onSubmitted,
@@ -167,7 +177,8 @@ class SearchPage extends HookConsumerWidget {
                                   height: 200 * theme.scaling,
                                 ),
                                 const SizedBox(height: 20),
-                              Text(context.l10n.search_to_get_results).large(),
+                                Text(context.l10n.search_to_get_results)
+                                    .large(),
                               ],
                             ),
                           (false, true) => Container(
@@ -226,6 +237,7 @@ class SearchPage extends HookConsumerWidget {
                   ],
                 ),
         ),
+      ),
     );
   }
 }

lib/pages/settings/about.dart

@@ -11,15 +11,17 @@ import 'package:spotube/hooks/controllers/use_package_info.dart';
 
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:url_launcher/url_launcher.dart';
+import 'package:auto_route/auto_route.dart';
 
 final _licenseProvider = FutureProvider<String>((ref) async {
   return await rootBundle.loadString("LICENSE");
 });
 
-class AboutSpotube extends HookConsumerWidget {
+@RoutePage()
+class AboutSpotubePage extends HookConsumerWidget {
   static const name = "about";
 
-  const AboutSpotube({super.key});
+  const AboutSpotubePage({super.key});
 
   @override
   Widget build(BuildContext context, ref) {
@@ -29,7 +31,9 @@ class AboutSpotube extends HookConsumerWidget {
 
     const colon = TableCell(child: Text(":"));
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
             leading: const [BackButton()],
@@ -89,8 +93,8 @@ class AboutSpotube extends HookConsumerWidget {
                               TableCell(child: Text(context.l10n.build_number)),
                               colon,
                               TableCell(
-                              child: Text(
+                                child: Text(packageInfo.buildNumber
-                                  packageInfo.buildNumber.replaceAll(".", " ")),
+                                    .replaceAll(".", " ")),
                               )
                             ],
                           ),
@@ -189,6 +193,7 @@ class AboutSpotube extends HookConsumerWidget {
             ),
           ),
         ),
+      ),
     );
   }
 }

lib/pages/settings/blacklist.dart

@@ -11,7 +11,9 @@ import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/components/ui/button_tile.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/provider/blacklist_provider.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class BlackListPage extends HookConsumerWidget {
   static const name = "blacklist";
 
@@ -45,7 +47,9 @@ class BlackListPage extends HookConsumerWidget {
       [blacklist, searchText.value],
     );
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
             title: Text(context.l10n.blacklist),
@@ -79,9 +83,8 @@ class BlackListPage extends HookConsumerWidget {
                     trailing: IconButton.ghost(
                       icon: Icon(SpotubeIcons.trash, color: Colors.red[400]),
                       onPressed: () {
-                      ref
+                        ref.read(blacklistProvider.notifier).remove(
-                          .read(blacklistProvider.notifier)
+                            filteredBlacklist.elementAt(index).elementId);
-                          .remove(filteredBlacklist.elementAt(index).elementId);
                       },
                     ),
                   );
@@ -90,6 +93,7 @@ class BlackListPage extends HookConsumerWidget {
             ),
           ],
         ),
+      ),
     );
   }
 }

lib/pages/settings/logs.dart

@@ -11,7 +11,9 @@ import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/provider/logs/logs_provider.dart';
 import 'package:spotube/services/logger/logger.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class LogsPage extends HookConsumerWidget {
   static const name = "logs";
 

lib/pages/settings/sections/about.dart

@@ -1,9 +1,11 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:flutter/material.dart' show ListTile;
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart' hide ButtonStyle;
 import 'package:spotube/collections/env.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/modules/settings/section_card_with_heading.dart';
 import 'package:spotube/components/adaptive/adaptive_list_tile.dart';
@@ -88,7 +90,7 @@ class SettingsAboutSection extends HookConsumerWidget {
           title: Text(context.l10n.about_spotube),
           trailing: const Icon(SpotubeIcons.angleRight),
           onTap: () {
-            GoRouter.of(context).push("/settings/about");
+            context.navigateTo(const AboutSpotubeRoute());
           },
         )
       ],

lib/pages/settings/sections/accounts.dart

@@ -1,20 +1,20 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:flutter/material.dart' show ListTile;
-import 'package:go_router/go_router.dart';
+
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/modules/settings/section_card_with_heading.dart';
 import 'package:spotube/components/image/universal_image.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/pages/profile/profile.dart';
 import 'package:spotube/pages/mobile_login/hooks/login_callback.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/scrobbler/scrobbler.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
-import 'package:spotube/utils/service_utils.dart';
 
 class SettingsAccountSection extends HookConsumerWidget {
   const SettingsAccountSection({super.key});
@@ -22,7 +22,6 @@ class SettingsAccountSection extends HookConsumerWidget {
   @override
   Widget build(context, ref) {
     final theme = Theme.of(context);
-    final router = GoRouter.of(context);
 
     final auth = ref.watch(authenticationProvider);
     final scrobbler = ref.watch(scrobblerProvider);
@@ -50,7 +49,7 @@ class SettingsAccountSection extends HookConsumerWidget {
               ),
             ),
             onTap: () {
-              ServiceUtils.pushNamed(context, ProfilePage.name);
+              context.navigateTo(ProfileRoute());
             },
           ),
         if (auth.asData?.value == null)
@@ -99,7 +98,7 @@ class SettingsAccountSection extends HookConsumerWidget {
               trailing: Button.destructive(
                 onPressed: () async {
                   ref.read(authenticationProvider.notifier).logout();
-                  GoRouter.of(context).pop();
+                  context.maybePop();
                 },
                 child: Text(context.l10n.logout),
               ),
@@ -113,7 +112,7 @@ class SettingsAccountSection extends HookConsumerWidget {
             trailing: Button.secondary(
               leading: const Icon(SpotubeIcons.lastFm),
               onPressed: () {
-                router.push("/lastfm-login");
+                context.navigateTo(const LastFMLoginRoute());
               },
               child: Text(context.l10n.connect),
             ),

lib/pages/settings/sections/developers.dart

@@ -1,7 +1,9 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart' show ListTile;
 import 'package:flutter_hooks/flutter_hooks.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/modules/settings/section_card_with_heading.dart';
 import 'package:spotube/extensions/context.dart';
@@ -19,7 +21,7 @@ class SettingsDevelopersSection extends HookWidget {
           title: Text(context.l10n.logs),
           trailing: const Icon(SpotubeIcons.angleRight),
           onTap: () {
-            GoRouter.of(context).push("/settings/logs");
+            context.navigateTo(const LogsRoute());
           },
         )
       ],

lib/pages/settings/sections/playback.dart

@@ -1,12 +1,13 @@
+import 'package:auto_route/auto_route.dart';
 import 'package:collection/collection.dart';
 import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart' show ListTile;
 
-import 'package:go_router/go_router.dart';
 import 'package:google_fonts/google_fonts.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:piped_client/piped_client.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/models/database/database.dart';
 import 'package:spotube/modules/settings/section_card_with_heading.dart';
@@ -267,7 +268,7 @@ class SettingsPlaybackSection extends HookConsumerWidget {
           title: Text(context.l10n.blacklist),
           subtitle: Text(context.l10n.blacklist_description),
           onTap: () {
-            GoRouter.of(context).push("/settings/blacklist");
+            context.navigateTo(const BlackListRoute());
           },
           trailing: const Icon(SpotubeIcons.angleRight),
         ),

lib/pages/settings/settings.dart

@@ -15,7 +15,9 @@ import 'package:spotube/pages/settings/sections/language_region.dart';
 import 'package:spotube/pages/settings/sections/playback.dart';
 import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
 import 'package:spotube/utils/platform.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class SettingsPage extends HookConsumerWidget {
   static const name = "settings";
 
@@ -32,7 +34,6 @@ class SettingsPage extends HookConsumerWidget {
         headers: [
           TitleBar(
             title: Text(context.l10n.settings),
-            automaticallyImplyLeading: true,
           )
         ],
         child: Scrollbar(

lib/pages/stats/albums/albums.dart

@@ -10,7 +10,9 @@ import 'package:spotube/provider/history/top.dart';
 import 'package:spotube/provider/history/top/albums.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:very_good_infinite_list/very_good_infinite_list.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class StatsAlbumsPage extends HookConsumerWidget {
   static const name = "stats_albums";
   const StatsAlbumsPage({super.key});
@@ -24,10 +26,11 @@ class StatsAlbumsPage extends HookConsumerWidget {
 
     final albumsData = topAlbums.asData?.value.items ?? [];
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
-          automaticallyImplyLeading: true,
             title: Text(context.l10n.albums),
           )
         ],
@@ -51,6 +54,7 @@ class StatsAlbumsPage extends HookConsumerWidget {
             },
           ),
         ),
+      ),
     );
   }
 }

lib/pages/stats/artists/artists.dart

@@ -11,7 +11,9 @@ import 'package:spotube/provider/history/top.dart';
 import 'package:spotube/provider/history/top/tracks.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:very_good_infinite_list/very_good_infinite_list.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class StatsArtistsPage extends HookConsumerWidget {
   static const name = "stats_artists";
   const StatsArtistsPage({super.key});
@@ -27,10 +29,11 @@ class StatsArtistsPage extends HookConsumerWidget {
     final artistsData = useMemoized(
         () => topTracks.asData?.value.artists ?? [], [topTracks.asData?.value]);
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
-          automaticallyImplyLeading: true,
             title: Text(context.l10n.artists),
           )
         ],
@@ -54,6 +57,7 @@ class StatsArtistsPage extends HookConsumerWidget {
             },
           ),
         ),
+      ),
     );
   }
 }

lib/pages/stats/fees/fees.dart

@@ -12,7 +12,9 @@ import 'package:spotube/provider/history/top.dart';
 import 'package:spotube/provider/history/top/tracks.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:very_good_infinite_list/very_good_infinite_list.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class StatsStreamFeesPage extends HookConsumerWidget {
   static const name = "stats_stream_fees";
 
@@ -48,10 +50,11 @@ class StatsStreamFeesPage extends HookConsumerWidget {
       HistoryDuration.allTime: context.l10n.all_time,
     };
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
-          automaticallyImplyLeading: true,
             title: Text(context.l10n.streaming_fees_hypothetical),
           )
         ],
@@ -84,7 +87,8 @@ class StatsStreamFeesPage extends HookConsumerWidget {
                         if (value == null) return;
                         duration.value = value;
                       },
-                    itemBuilder: (context, value) => Text(translations[value]!),
+                      itemBuilder: (context, value) =>
+                          Text(translations[value]!),
                       constraints: const BoxConstraints(maxWidth: 150),
                       popupWidthConstraint: PopoverConstraint.anchorMaxSize,
                       children: [
@@ -107,7 +111,8 @@ class StatsStreamFeesPage extends HookConsumerWidget {
                     await topTracksNotifier.fetchMore();
                   },
                   hasError: topTracks.hasError,
-                isLoading: topTracks.isLoading && !topTracks.isLoadingNextPage,
+                  isLoading:
+                      topTracks.isLoading && !topTracks.isLoadingNextPage,
                   hasReachedMax: topTracks.asData?.value.hasMore ?? true,
                   itemCount: artistsData.length,
                   itemBuilder: (context, index) {
@@ -122,6 +127,7 @@ class StatsStreamFeesPage extends HookConsumerWidget {
             ),
           ],
         ),
+      ),
     );
   }
 }

lib/pages/stats/minutes/minutes.dart

@@ -10,7 +10,9 @@ import 'package:spotube/provider/history/top.dart';
 import 'package:spotube/provider/history/top/tracks.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:very_good_infinite_list/very_good_infinite_list.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class StatsMinutesPage extends HookConsumerWidget {
   static const name = "stats_minutes";
 
@@ -26,11 +28,12 @@ class StatsMinutesPage extends HookConsumerWidget {
 
     final tracksData = topTracks.asData?.value.items ?? [];
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
             title: Text(context.l10n.minutes_listened),
-          automaticallyImplyLeading: true,
           )
         ],
         child: Skeletonizer(
@@ -56,6 +59,7 @@ class StatsMinutesPage extends HookConsumerWidget {
             },
           ),
         ),
+      ),
     );
   }
 }

lib/pages/stats/playlists/playlists.dart

@@ -10,7 +10,9 @@ import 'package:spotube/provider/history/top.dart';
 import 'package:spotube/provider/history/top/playlists.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:very_good_infinite_list/very_good_infinite_list.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class StatsPlaylistsPage extends HookConsumerWidget {
   static const name = "stats_playlists";
   const StatsPlaylistsPage({super.key});
@@ -25,10 +27,11 @@ class StatsPlaylistsPage extends HookConsumerWidget {
 
     final playlistsData = topPlaylists.asData?.value.items ?? [];
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
-          automaticallyImplyLeading: true,
             title: Text(context.l10n.playlists),
           )
         ],
@@ -39,7 +42,8 @@ class StatsPlaylistsPage extends HookConsumerWidget {
               await topPlaylistsNotifier.fetchMore();
             },
             hasError: topPlaylists.hasError,
-          isLoading: topPlaylists.isLoading && !topPlaylists.isLoadingNextPage,
+            isLoading:
+                topPlaylists.isLoading && !topPlaylists.isLoadingNextPage,
             hasReachedMax: topPlaylists.asData?.value.hasMore ?? true,
             itemCount: playlistsData.length,
             itemBuilder: (context, index) {
@@ -47,13 +51,14 @@ class StatsPlaylistsPage extends HookConsumerWidget {
               return StatsPlaylistItem(
                 playlist: playlist.playlist,
                 info: Text(
-                context.l10n
+                  context.l10n.count_plays(
-                    .count_plays(compactNumberFormatter.format(playlist.count)),
+                      compactNumberFormatter.format(playlist.count)),
                 ),
               );
             },
           ),
         ),
+      ),
     );
   }
 }

lib/pages/stats/stats.dart

@@ -1,10 +1,13 @@
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/modules/stats/summary/summary.dart';
 import 'package:spotube/modules/stats/top/top.dart';
 import 'package:spotube/utils/platform.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class StatsPage extends HookConsumerWidget {
   static const name = "stats";
 
@@ -12,11 +15,17 @@ class StatsPage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, ref) {
-    return SafeArea(
+    return PopScope(
+      canPop: false,
+      onPopInvokedWithResult: (didPop, result) {
+        context.navigateTo(const HomeRoute());
+      },
+      child: SafeArea(
         bottom: false,
         child: Scaffold(
           headers: [
-          if (kTitlebarVisible) const TitleBar(),
+            if (kTitlebarVisible)
+              const TitleBar(automaticallyImplyLeading: false),
           ],
           child: CustomScrollView(
             slivers: [
@@ -31,6 +40,7 @@ class StatsPage extends HookConsumerWidget {
             ],
           ),
         ),
+      ),
     );
   }
 }

lib/pages/stats/streams/streams.dart

@@ -10,7 +10,9 @@ import 'package:spotube/provider/history/top.dart';
 import 'package:spotube/provider/history/top/tracks.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:very_good_infinite_list/very_good_infinite_list.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class StatsStreamsPage extends HookConsumerWidget {
   static const name = "stats_streams";
 
@@ -26,11 +28,12 @@ class StatsStreamsPage extends HookConsumerWidget {
 
     final tracksData = topTracks.asData?.value.items ?? [];
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: [
           TitleBar(
             title: Text(context.l10n.streamed_songs),
-          automaticallyImplyLeading: true,
           )
         ],
         child: Skeletonizer(
@@ -56,6 +59,7 @@ class StatsStreamsPage extends HookConsumerWidget {
             },
           ),
         ),
+      ),
     );
   }
 }

lib/pages/track/track.dart

@@ -1,10 +1,10 @@
 import 'dart:ui';
 
-import 'package:gap/gap.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:skeletonizer/skeletonizer.dart';
 import 'package:spotube/collections/fake.dart';
+import 'package:spotube/collections/routes.gr.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/heart_button/heart_button.dart';
 import 'package:spotube/components/image/universal_image.dart';
@@ -20,14 +20,16 @@ import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/services/audio_player/audio_player.dart';
 
 import 'package:spotube/extensions/constrains.dart';
+import 'package:auto_route/auto_route.dart';
 
+@RoutePage()
 class TrackPage extends HookConsumerWidget {
   static const name = "track";
 
   final String trackId;
   const TrackPage({
     super.key,
-    required this.trackId,
+    @PathParam("id") required this.trackId,
   });
 
   @override
@@ -52,10 +54,11 @@ class TrackPage extends HookConsumerWidget {
       }
     }
 
-    return Scaffold(
+    return SafeArea(
+      bottom: false,
+      child: Scaffold(
         headers: const [
           TitleBar(
-          automaticallyImplyLeading: true,
             backgroundColor: Colors.transparent,
             surfaceBlur: 0,
           )
@@ -119,7 +122,8 @@ class TrackPage extends HookConsumerWidget {
                             ),
                           ),
                           Padding(
-                          padding: const EdgeInsets.symmetric(horizontal: 16.0),
+                            padding:
+                                const EdgeInsets.symmetric(horizontal: 16.0),
                             child: Column(
                               crossAxisAlignment: mediaQuery.smAndDown
                                   ? CrossAxisAlignment.center
@@ -138,9 +142,11 @@ class TrackPage extends HookConsumerWidget {
                                     Flexible(
                                       child: LinkText(
                                         track.album!.name!,
-                                      '/album/${track.album!.id}',
+                                        AlbumRoute(
+                                          id: track.album!.id!,
+                                          album: track.album!,
+                                        ),
                                         push: true,
-                                      extra: track.album,
                                       ),
                                     ),
                                   ],
@@ -242,6 +248,7 @@ class TrackPage extends HookConsumerWidget {
             ),
           ],
         ),
+      ),
     );
   }
 }

lib/utils/service_utils.dart

@@ -1,8 +1,9 @@
 import 'dart:typed_data';
 
+import 'package:auto_route/auto_route.dart';
 import 'package:dio/dio.dart';
 import 'package:flutter_cache_manager/flutter_cache_manager.dart';
-import 'package:go_router/go_router.dart';
+
 import 'package:html/dom.dart' hide Text;
 import 'package:shadcn_flutter/shadcn_flutter.dart' hide Element;
 import 'package:spotify/spotify.dart';
@@ -276,70 +277,6 @@ abstract class ServiceUtils {
     return subtitle;
   }
 
-  static void navigate(BuildContext context, String location, {Object? extra}) {
-    if (GoRouterState.of(context).matchedLocation == location) return;
-    GoRouter.of(context).go(location, extra: extra);
-  }
-
-  static void navigateNamed(
-    BuildContext context,
-    String name, {
-    Object? extra,
-    Map<String, String>? pathParameters,
-    Map<String, dynamic>? queryParameters,
-  }) {
-    if (GoRouterState.of(context).matchedLocation == name) return;
-    GoRouter.of(context).goNamed(
-      name,
-      pathParameters: pathParameters ?? const {},
-      queryParameters: queryParameters ?? const {},
-      extra: extra,
-    );
-  }
-
-  static void push(BuildContext context, String location, {Object? extra}) {
-    final router = GoRouter.of(context);
-    final routerState = GoRouterState.of(context);
-    final routerStack = router.routerDelegate.currentConfiguration.matches
-        .map((e) => e.matchedLocation);
-
-    if (routerState.matchedLocation == location ||
-        routerStack.contains(location)) {
-      return;
-    }
-    router.push(location, extra: extra);
-  }
-
-  static void pushNamed(
-    BuildContext context,
-    String name, {
-    Object? extra,
-    Map<String, String> pathParameters = const {},
-    Map<String, String> queryParameters = const {},
-  }) {
-    final router = GoRouter.of(context);
-    final routerState = GoRouterState.of(context);
-    final routerStack = router.routerDelegate.currentConfiguration.matches
-        .map((e) => e.matchedLocation);
-
-    final nameLocation = routerState.namedLocation(
-      name,
-      pathParameters: pathParameters,
-      queryParameters: queryParameters,
-    );
-
-    if (routerState.matchedLocation == nameLocation ||
-        routerStack.contains(nameLocation)) {
-      return;
-    }
-    router.pushNamed(
-      name,
-      pathParameters: pathParameters,
-      queryParameters: queryParameters,
-      extra: extra,
-    );
-  }
-
   static DateTime parseSpotifyAlbumDate(AlbumSimple? album) {
     if (album == null || album.releaseDate == null) {
       return DateTime.parse("1975-01-01");

pubspec.lock

@@ -142,6 +142,22 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "0.1.21"
+  auto_route:
+    dependency: "direct main"
+    description:
+      name: auto_route
+      sha256: "1d1bd908a1fec327719326d5d0791edd37f16caff6493c01003689fb03315ad7"
+      url: "https://pub.dev"
+    source: hosted
+    version: "9.3.0+1"
+  auto_route_generator:
+    dependency: "direct dev"
+    description:
+      name: auto_route_generator
+      sha256: c9086eb07271e51b44071ad5cff34e889f3156710b964a308c2ab590769e79e6
+      url: "https://pub.dev"
+    source: hosted
+    version: "9.0.0"
   auto_size_text:
     dependency: "direct main"
     description:
@@ -1073,14 +1089,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.1.2"
-  go_router:
-    dependency: "direct main"
-    description:
-      name: go_router
-      sha256: "2fd11229f59e23e967b0775df8d5948a519cd7e1e8b6e849729e010587b46539"
-      url: "https://pub.dev"
-    source: hosted
-    version: "14.6.2"
   google_fonts:
     dependency: "direct main"
     description:

pubspec.yaml

@@ -19,6 +19,7 @@ dependencies:
   audio_service: ^0.18.13
   audio_service_mpris: ^0.2.0
   audio_session: ^0.1.19
+  auto_route: ^9.3.0+1
   auto_size_text: ^3.0.0
   bonsoir: ^5.1.10
   cached_network_image: ^3.3.1
@@ -70,7 +71,6 @@ dependencies:
   freezed_annotation: ^2.4.1
   fuzzywuzzy: ^1.1.6
   gap: ^3.0.1
-  go_router: ^14.2.7
   google_fonts: ^6.2.1
   hive: ^2.2.3
   hive_flutter: ^1.1.0
@@ -161,6 +161,7 @@ dev_dependencies:
   xml: ^6.5.0
   io: ^1.0.4
   drift_dev: ^2.21.0
+  auto_route_generator: ^9.0.0
 
 dependency_overrides:
   bonsoir_android: