fix
This commit is contained in:
Phuoc Nguyen
@@ -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'),
|
||||
|
||||
Reference in New Issue
Block a user