fix

lib/features/categories/presentation/pages/category_detail_page.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import '../../domain/entities/category.dart';
+import '../providers/categories_provider.dart';
 import '../../../products/presentation/providers/products_provider.dart';
 import '../../../products/presentation/widgets/product_card.dart';
 import '../../../products/presentation/widgets/product_list_item.dart';
@@ -10,11 +11,11 @@ enum ViewMode { grid, list }
 
 /// Category detail page showing products in the category
 class CategoryDetailPage extends ConsumerStatefulWidget {
-  final Category category;
+  final String categoryId;
 
   const CategoryDetailPage({
     super.key,
-    required this.category,
+    required this.categoryId,
   });
 
   @override
@@ -26,80 +27,178 @@ class _CategoryDetailPageState extends ConsumerState<CategoryDetailPage> {
 
   @override
   Widget build(BuildContext context) {
+    final categoriesAsync = ref.watch(categoriesProvider);
     final productsAsync = ref.watch(productsProvider);
 
-    return Scaffold(
-      appBar: AppBar(
-        title: Text(widget.category.name),
-        actions: [
-          // View mode toggle
-          IconButton(
-            icon: Icon(
-              _viewMode == ViewMode.grid
-                  ? Icons.view_list_rounded
-                  : Icons.grid_view_rounded,
-            ),
-            onPressed: () {
-              setState(() {
-                _viewMode =
-                    _viewMode == ViewMode.grid ? ViewMode.list : ViewMode.grid;
-              });
-            },
-            tooltip: _viewMode == ViewMode.grid
-                ? 'Switch to list view'
-                : 'Switch to grid view',
-          ),
-        ],
-      ),
-      body: productsAsync.when(
-        data: (products) {
-          // Filter products by category
-          final categoryProducts = products
-              .where((product) => product.categoryId == widget.category.id)
-              .toList();
+    return categoriesAsync.when(
+      data: (categories) {
+        // Find the category by ID
+        Category? category;
+        try {
+          category = categories.firstWhere((c) => c.id == widget.categoryId);
+        } catch (e) {
+          // Category not found
+          category = null;
+        }
 
-          if (categoryProducts.isEmpty) {
-            return Center(
+        // Handle category not found
+        if (category == null) {
+          return Scaffold(
+            appBar: AppBar(
+              title: const Text('Category Not Found'),
+            ),
+            body: Center(
               child: Column(
                 mainAxisAlignment: MainAxisAlignment.center,
                 children: [
                   Icon(
-                    Icons.inventory_2_outlined,
+                    Icons.error_outline,
                     size: 64,
-                    color: Theme.of(context).colorScheme.onSurfaceVariant,
+                    color: Theme.of(context).colorScheme.error,
                   ),
                   const SizedBox(height: 16),
                   Text(
-                    'No products in this category',
-                    style: Theme.of(context).textTheme.titleMedium?.copyWith(
-                          color: Theme.of(context).colorScheme.onSurfaceVariant,
-                        ),
+                    'Category not found',
+                    style: Theme.of(context).textTheme.titleMedium,
                   ),
                   const SizedBox(height: 8),
                   Text(
-                    'Products will appear here once added',
-                    style: Theme.of(context).textTheme.bodySmall?.copyWith(
-                          color: Theme.of(context).colorScheme.onSurfaceVariant,
-                        ),
+                    'The category you are looking for does not exist',
+                    style: Theme.of(context).textTheme.bodySmall,
+                    textAlign: TextAlign.center,
+                  ),
+                  const SizedBox(height: 16),
+                  FilledButton.icon(
+                    onPressed: () {
+                      Navigator.of(context).pop();
+                    },
+                    icon: const Icon(Icons.arrow_back),
+                    label: const Text('Go Back'),
                   ),
                 ],
               ),
-            );
-          }
-
-          return RefreshIndicator(
-            onRefresh: () async {
-              await ref.read(productsProvider.notifier).syncProducts();
-            },
-            child: _viewMode == ViewMode.grid
-                ? _buildGridView(categoryProducts)
-                : _buildListView(categoryProducts),
+            ),
           );
-        },
-        loading: () => const Center(
+        }
+
+        return Scaffold(
+          appBar: AppBar(
+            title: Text(category.name),
+            actions: [
+              // View mode toggle
+              IconButton(
+                icon: Icon(
+                  _viewMode == ViewMode.grid
+                      ? Icons.view_list_rounded
+                      : Icons.grid_view_rounded,
+                ),
+                onPressed: () {
+                  setState(() {
+                    _viewMode =
+                        _viewMode == ViewMode.grid ? ViewMode.list : ViewMode.grid;
+                  });
+                },
+                tooltip: _viewMode == ViewMode.grid
+                    ? 'Switch to list view'
+                    : 'Switch to grid view',
+              ),
+            ],
+          ),
+          body: productsAsync.when(
+            data: (products) {
+              // Filter products by category
+              final categoryProducts = products
+                  .where((product) => product.categoryId == category!.id)
+                  .toList();
+
+              if (categoryProducts.isEmpty) {
+                return Center(
+                  child: Column(
+                    mainAxisAlignment: MainAxisAlignment.center,
+                    children: [
+                      Icon(
+                        Icons.inventory_2_outlined,
+                        size: 64,
+                        color: Theme.of(context).colorScheme.onSurfaceVariant,
+                      ),
+                      const SizedBox(height: 16),
+                      Text(
+                        'No products in this category',
+                        style: Theme.of(context).textTheme.titleMedium?.copyWith(
+                              color: Theme.of(context).colorScheme.onSurfaceVariant,
+                            ),
+                      ),
+                      const SizedBox(height: 8),
+                      Text(
+                        'Products will appear here once added',
+                        style: Theme.of(context).textTheme.bodySmall?.copyWith(
+                              color: Theme.of(context).colorScheme.onSurfaceVariant,
+                            ),
+                      ),
+                    ],
+                  ),
+                );
+              }
+
+              return RefreshIndicator(
+                onRefresh: () async {
+                  await ref.read(productsProvider.notifier).syncProducts();
+                },
+                child: _viewMode == ViewMode.grid
+                    ? _buildGridView(categoryProducts)
+                    : _buildListView(categoryProducts),
+              );
+            },
+            loading: () => const Center(
+              child: CircularProgressIndicator(),
+            ),
+            error: (error, stack) => Center(
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Icon(
+                    Icons.error_outline,
+                    size: 64,
+                    color: Theme.of(context).colorScheme.error,
+                  ),
+                  const SizedBox(height: 16),
+                  Text(
+                    'Error loading products',
+                    style: Theme.of(context).textTheme.titleMedium,
+                  ),
+                  const SizedBox(height: 8),
+                  Text(
+                    error.toString(),
+                    style: Theme.of(context).textTheme.bodySmall,
+                    textAlign: TextAlign.center,
+                  ),
+                  const SizedBox(height: 16),
+                  FilledButton.icon(
+                    onPressed: () {
+                      ref.invalidate(productsProvider);
+                    },
+                    icon: const Icon(Icons.refresh),
+                    label: const Text('Retry'),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        );
+      },
+      loading: () => Scaffold(
+        appBar: AppBar(
+          title: const Text('Loading...'),
+        ),
+        body: const Center(
           child: CircularProgressIndicator(),
         ),
-        error: (error, stack) => Center(
+      ),
+      error: (error, stack) => Scaffold(
+        appBar: AppBar(
+          title: const Text('Error'),
+        ),
+        body: Center(
           child: Column(
             mainAxisAlignment: MainAxisAlignment.center,
             children: [
@@ -110,7 +209,7 @@ class _CategoryDetailPageState extends ConsumerState<CategoryDetailPage> {
               ),
               const SizedBox(height: 16),
               Text(
-                'Error loading products',
+                'Error loading category',
                 style: Theme.of(context).textTheme.titleMedium,
               ),
               const SizedBox(height: 8),
@@ -122,7 +221,7 @@ class _CategoryDetailPageState extends ConsumerState<CategoryDetailPage> {
               const SizedBox(height: 16),
               FilledButton.icon(
                 onPressed: () {
-                  ref.invalidate(productsProvider);
+                  ref.invalidate(categoriesProvider);
                 },
                 icon: const Icon(Icons.refresh),
                 label: const Text('Retry'),

lib/features/categories/presentation/providers/categories_provider.dart

@@ -6,7 +6,8 @@ import '../../../../core/providers/providers.dart';
 part 'categories_provider.g.dart';
 
 /// Provider for categories list with online-first approach
-@riverpod
+/// keepAlive ensures data persists when switching tabs
+@Riverpod(keepAlive: true)
 class Categories extends _$Categories {
   @override
   Future<List<Category>> build() async {

lib/features/categories/presentation/providers/categories_provider.g.dart

@@ -9,21 +9,24 @@ part of 'categories_provider.dart';
 // GENERATED CODE - DO NOT MODIFY BY HAND
 // ignore_for_file: type=lint, type=warning
 /// Provider for categories list with online-first approach
+/// keepAlive ensures data persists when switching tabs
 
 @ProviderFor(Categories)
 const categoriesProvider = CategoriesProvider._();
 
 /// Provider for categories list with online-first approach
+/// keepAlive ensures data persists when switching tabs
 final class CategoriesProvider
     extends $AsyncNotifierProvider<Categories, List<Category>> {
   /// Provider for categories list with online-first approach
+  /// keepAlive ensures data persists when switching tabs
   const CategoriesProvider._()
     : super(
         from: null,
         argument: null,
         retry: null,
         name: r'categoriesProvider',
-        isAutoDispose: true,
+        isAutoDispose: false,
         dependencies: null,
         $allTransitiveDependencies: null,
       );
@@ -36,9 +39,10 @@ final class CategoriesProvider
   Categories create() => Categories();
 }
 
-String _$categoriesHash() => r'33c33b08f8926e5bbbd112285591c74a3ff0f61c';
+String _$categoriesHash() => r'c26eb4b4a76ce796eb65b7843a390805528dec4a';
 
 /// Provider for categories list with online-first approach
+/// keepAlive ensures data persists when switching tabs
 
 abstract class _$Categories extends $AsyncNotifier<List<Category>> {
   FutureOr<List<Category>> build();

lib/features/categories/presentation/widgets/category_card.dart

@@ -1,6 +1,6 @@
 import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
 import '../../domain/entities/category.dart';
-import '../pages/category_detail_page.dart';
 
 /// Category card widget
 class CategoryCard extends StatelessWidget {
@@ -22,12 +22,7 @@ class CategoryCard extends StatelessWidget {
       child: InkWell(
         onTap: () {
           // Navigate to category detail page
-          Navigator.push(
-            context,
-            MaterialPageRoute(
-              builder: (context) => CategoryDetailPage(category: category),
-            ),
-          );
+          context.push('/categories/${category.id}');
         },
         child: Padding(
           padding: const EdgeInsets.all(16.0),