Added rounting mechanism

mobile/lib/pages/collections/albums/albums_collection.page.dart

@@ -7,6 +7,13 @@ class AlbumsCollectionPage extends HookConsumerWidget {
   const AlbumsCollectionPage({super.key});
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    return Container();
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text('albums_collection_page_title'),
+      ),
+      body: const Center(
+        child: Text('albums_collection_page_content'),
+      ),
+    );
   }
 }

mobile/lib/pages/collections/albums/local_albums_collection.page.dart

@@ -7,6 +7,13 @@ class LocalAlbumsCollectionPage extends HookConsumerWidget {
   const LocalAlbumsCollectionPage({super.key});
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    return Container();
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text('on_this_device'),
+      ),
+      body: const Center(
+        child: Text('on_this_device_content'),
+      ),
+    );
   }
 }

mobile/lib/pages/collections/albums/people_collection.page.dart

@@ -7,6 +7,13 @@ class PeopleCollectionPage extends HookConsumerWidget {
   const PeopleCollectionPage({super.key});
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    return Container();
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text('people'),
+      ),
+      body: const Center(
+        child: Text('people'),
+      ),
+    );
   }
 }

mobile/lib/pages/collections/albums/places_collection.part.dart

@@ -7,6 +7,13 @@ class PlacesCollectionPage extends HookConsumerWidget {
   const PlacesCollectionPage({super.key});
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    return Container();
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text('places'),
+      ),
+      body: const Center(
+        child: Text('places'),
+      ),
+    );
   }
 }

mobile/lib/pages/collections/collections.page.dart

@@ -87,7 +87,9 @@ class PeopleCollectionCard extends ConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     final people = ref.watch(getAllPeopleProvider);
     final size = MediaQuery.of(context).size.width * 0.5 - 20;
-    return Column(
+    return GestureDetector(
+      onTap: () => context.pushRoute(const PeopleCollectionRoute()),
+      child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           Container(
@@ -122,6 +124,7 @@ class PeopleCollectionCard extends ConsumerWidget {
             child: Text('People', style: context.textTheme.labelLarge),
           ),
         ],
+      ),
     );
   }
 }
@@ -137,7 +140,11 @@ class AlbumsCollectionCard extends ConsumerWidget {
         ? ref.watch(albumProvider).where((album) => album.isLocal)
         : ref.watch(albumProvider).where((album) => album.isRemote);
     final size = MediaQuery.of(context).size.width * 0.5 - 20;
-    return Column(
+    return GestureDetector(
+      onTap: () => context.pushRoute(isLocal
+          ? const LocalAlbumsCollectionRoute()
+          : const AlbumsCollectionRoute()),
+      child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           Container(
@@ -169,6 +176,7 @@ class AlbumsCollectionCard extends ConsumerWidget {
             ),
           ),
         ],
+      ),
     );
   }
 }
@@ -178,7 +186,9 @@ class PlacesCollectionCard extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final size = MediaQuery.of(context).size.width * 0.5 - 20;
-    return Column(
+    return GestureDetector(
+      onTap: () => context.pushRoute(const PlacesCollectionRoute()),
+      child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           Container(
@@ -196,7 +206,8 @@ class PlacesCollectionCard extends StatelessWidget {
                   -157.91959,
                 ),
                 showAttribution: false,
-              themeMode: context.isDarkTheme ? ThemeMode.dark : ThemeMode.light,
+                themeMode:
+                    context.isDarkTheme ? ThemeMode.dark : ThemeMode.light,
               ),
             ),
           ),
@@ -205,6 +216,7 @@ class PlacesCollectionCard extends StatelessWidget {
             child: Text('Places', style: context.textTheme.labelLarge),
           ),
         ],
+      ),
     );
   }
 }

mobile/lib/routing/router.dart

@@ -240,21 +240,25 @@ class AppRouter extends RootStackRouter {
       page: HeaderSettingsRoute.page,
       guards: [_duplicateGuard],
     ),
-    AutoRoute(
+    CustomRoute(
       page: PeopleCollectionRoute.page,
       guards: [_authGuard, _duplicateGuard],
+      transitionsBuilder: TransitionsBuilders.slideLeft,
     ),
-    AutoRoute(
+    CustomRoute(
       page: AlbumsCollectionRoute.page,
       guards: [_authGuard, _duplicateGuard],
+      transitionsBuilder: TransitionsBuilders.slideLeft,
     ),
-    AutoRoute(
+    CustomRoute(
       page: LocalAlbumsCollectionRoute.page,
       guards: [_authGuard, _duplicateGuard],
+      transitionsBuilder: TransitionsBuilders.slideLeft,
     ),
-    AutoRoute(
+    CustomRoute(
       page: PlacesCollectionRoute.page,
       guards: [_authGuard, _duplicateGuard],
+      transitionsBuilder: TransitionsBuilders.slideLeft,
     ),
   ];
 }