parent
fb590aacea
commit
98b9dbe6ea
@ -0,0 +1,533 @@
|
||||
import 'dart:typed_data';
|
||||
import 'package:flutter/material.dart';
|
||||
import '../../core/service_locator.dart';
|
||||
import '../../core/logger.dart';
|
||||
import '../../data/recipes/recipe_service.dart';
|
||||
import '../../data/recipes/models/bookmark_category_model.dart';
|
||||
import '../../data/recipes/models/recipe_model.dart';
|
||||
import '../add_recipe/add_recipe_screen.dart';
|
||||
import '../photo_gallery/photo_gallery_screen.dart';
|
||||
|
||||
/// Screen displaying recipes in a specific bookmark category.
|
||||
class BookmarkCategoryRecipesScreen extends StatefulWidget {
|
||||
final BookmarkCategory category;
|
||||
|
||||
const BookmarkCategoryRecipesScreen({
|
||||
super.key,
|
||||
required this.category,
|
||||
});
|
||||
|
||||
@override
|
||||
State<BookmarkCategoryRecipesScreen> createState() => _BookmarkCategoryRecipesScreenState();
|
||||
}
|
||||
|
||||
class _BookmarkCategoryRecipesScreenState extends State<BookmarkCategoryRecipesScreen> {
|
||||
List<RecipeModel> _recipes = [];
|
||||
bool _isLoading = false;
|
||||
String? _errorMessage;
|
||||
RecipeService? _recipeService;
|
||||
String _searchQuery = '';
|
||||
final TextEditingController _searchController = TextEditingController();
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_initializeService();
|
||||
_loadRecipes();
|
||||
_searchController.addListener(() {
|
||||
setState(() {
|
||||
_searchQuery = _searchController.text.toLowerCase();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_searchController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
Future<void> _initializeService() async {
|
||||
try {
|
||||
_recipeService = ServiceLocator.instance.recipeService;
|
||||
if (_recipeService == null) {
|
||||
throw Exception('RecipeService not available in ServiceLocator');
|
||||
}
|
||||
} catch (e) {
|
||||
Logger.error('Failed to initialize RecipeService', e);
|
||||
if (mounted) {
|
||||
setState(() {
|
||||
_errorMessage = 'Failed to initialize recipe service: $e';
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _loadRecipes() async {
|
||||
if (_recipeService == null) return;
|
||||
|
||||
setState(() {
|
||||
_isLoading = true;
|
||||
_errorMessage = null;
|
||||
});
|
||||
|
||||
try {
|
||||
final recipes = await _recipeService!.getRecipesByCategory(widget.category.id);
|
||||
|
||||
if (mounted) {
|
||||
setState(() {
|
||||
_recipes = recipes;
|
||||
_isLoading = false;
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
Logger.error('Failed to load recipes', e);
|
||||
if (mounted) {
|
||||
setState(() {
|
||||
_isLoading = false;
|
||||
_errorMessage = 'Failed to load recipes: $e';
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Color _parseColor(String hexColor) {
|
||||
try {
|
||||
return Color(int.parse(hexColor.replaceAll('#', '0xFF')));
|
||||
} catch (e) {
|
||||
return Colors.blue;
|
||||
}
|
||||
}
|
||||
|
||||
List<RecipeModel> _getFilteredRecipes() {
|
||||
if (_searchQuery.isEmpty) {
|
||||
return _recipes;
|
||||
}
|
||||
return _recipes.where((recipe) =>
|
||||
recipe.title.toLowerCase().contains(_searchQuery) ||
|
||||
(recipe.description?.toLowerCase().contains(_searchQuery) ?? false)).toList();
|
||||
}
|
||||
|
||||
void _viewRecipe(RecipeModel recipe) {
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(
|
||||
builder: (context) => AddRecipeScreen(
|
||||
recipe: recipe,
|
||||
viewMode: true,
|
||||
),
|
||||
),
|
||||
).then((_) {
|
||||
// Reload recipes when returning from recipe view
|
||||
_loadRecipes();
|
||||
});
|
||||
}
|
||||
|
||||
void _openPhotoGallery(List<String> imageUrls, int initialIndex) {
|
||||
if (imageUrls.isEmpty) return;
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(
|
||||
builder: (context) => PhotoGalleryScreen(
|
||||
imageUrls: imageUrls,
|
||||
initialIndex: initialIndex,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final categoryColor = widget.category.color != null
|
||||
? _parseColor(widget.category.color!)
|
||||
: Theme.of(context).primaryColor;
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Bookmarks',
|
||||
style: Theme.of(context).textTheme.bodySmall?.copyWith(
|
||||
color: Colors.grey.shade600,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
widget.category.name,
|
||||
style: Theme.of(context).textTheme.titleLarge?.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
elevation: 0,
|
||||
),
|
||||
body: RefreshIndicator(
|
||||
onRefresh: _loadRecipes,
|
||||
child: _isLoading
|
||||
? const Center(child: CircularProgressIndicator())
|
||||
: _errorMessage != null
|
||||
? Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.error_outline,
|
||||
size: 64,
|
||||
color: Colors.red.shade300,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
'Oops! Something went wrong',
|
||||
style: Theme.of(context).textTheme.titleLarge,
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
_errorMessage!,
|
||||
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
|
||||
color: Colors.grey.shade600,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
ElevatedButton.icon(
|
||||
onPressed: _loadRecipes,
|
||||
icon: const Icon(Icons.refresh),
|
||||
label: const Text('Retry'),
|
||||
style: ElevatedButton.styleFrom(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
)
|
||||
: _getFilteredRecipes().isEmpty
|
||||
? Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.restaurant_menu,
|
||||
size: 100,
|
||||
color: Colors.grey.shade300,
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Text(
|
||||
_searchQuery.isNotEmpty
|
||||
? 'No recipes found'
|
||||
: 'No recipes in this bookmark',
|
||||
style: Theme.of(context).textTheme.headlineSmall?.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.grey.shade700,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
_searchQuery.isNotEmpty
|
||||
? 'Try a different search term'
|
||||
: 'Bookmark some recipes to see them here',
|
||||
style: Theme.of(context).textTheme.bodyLarge?.copyWith(
|
||||
color: Colors.grey.shade600,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
)
|
||||
: CustomScrollView(
|
||||
slivers: [
|
||||
// Search bar
|
||||
SliverToBoxAdapter(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 8, 16, 8),
|
||||
child: TextField(
|
||||
controller: _searchController,
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search recipes...',
|
||||
prefixIcon: const Icon(Icons.search),
|
||||
suffixIcon: _searchQuery.isNotEmpty
|
||||
? IconButton(
|
||||
icon: const Icon(Icons.clear),
|
||||
onPressed: () {
|
||||
_searchController.clear();
|
||||
},
|
||||
)
|
||||
: null,
|
||||
filled: true,
|
||||
fillColor: Theme.of(context).brightness == Brightness.dark
|
||||
? Colors.grey[800]
|
||||
: Colors.grey[100],
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderSide: BorderSide.none,
|
||||
),
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
// Recipes list
|
||||
SliverPadding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
sliver: SliverList(
|
||||
delegate: SliverChildBuilderDelegate(
|
||||
(context, index) {
|
||||
final recipe = _getFilteredRecipes()[index];
|
||||
return _BookmarkRecipeItem(
|
||||
recipe: recipe,
|
||||
onTap: () => _viewRecipe(recipe),
|
||||
onPhotoTap: (index) => _openPhotoGallery(
|
||||
recipe.imageUrls,
|
||||
index,
|
||||
),
|
||||
);
|
||||
},
|
||||
childCount: _getFilteredRecipes().length,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Widget for displaying a recipe item in a bookmark category.
|
||||
class _BookmarkRecipeItem extends StatelessWidget {
|
||||
final RecipeModel recipe;
|
||||
final VoidCallback onTap;
|
||||
final ValueChanged<int> onPhotoTap;
|
||||
|
||||
const _BookmarkRecipeItem({
|
||||
required this.recipe,
|
||||
required this.onTap,
|
||||
required this.onPhotoTap,
|
||||
});
|
||||
|
||||
/// Builds an image widget using ImmichService for authenticated access.
|
||||
Widget _buildRecipeImage(String imageUrl) {
|
||||
final mediaService = ServiceLocator.instance.mediaService;
|
||||
if (mediaService == null) {
|
||||
return Container(
|
||||
width: 60,
|
||||
height: 60,
|
||||
color: Colors.grey.shade200,
|
||||
child: const Icon(Icons.image, size: 32),
|
||||
);
|
||||
}
|
||||
|
||||
// Try to extract asset ID from Immich URL (format: .../api/assets/{id}/original)
|
||||
final assetIdMatch = RegExp(r'/api/assets/([^/]+)/').firstMatch(imageUrl);
|
||||
String? assetId;
|
||||
|
||||
if (assetIdMatch != null) {
|
||||
assetId = assetIdMatch.group(1);
|
||||
} else {
|
||||
// For Blossom URLs, use the full URL
|
||||
assetId = imageUrl;
|
||||
}
|
||||
|
||||
if (assetId != null) {
|
||||
return FutureBuilder<Uint8List?>(
|
||||
future: mediaService.fetchImageBytes(assetId, isThumbnail: true),
|
||||
builder: (context, snapshot) {
|
||||
if (snapshot.connectionState == ConnectionState.waiting) {
|
||||
return Container(
|
||||
color: Colors.grey.shade200,
|
||||
child: const Center(
|
||||
child: CircularProgressIndicator(),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
if (snapshot.hasError || !snapshot.hasData || snapshot.data == null) {
|
||||
return Container(
|
||||
color: Colors.grey.shade200,
|
||||
child: const Icon(Icons.broken_image, size: 32),
|
||||
);
|
||||
}
|
||||
|
||||
return Image.memory(
|
||||
snapshot.data!,
|
||||
fit: BoxFit.cover,
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
return Image.network(
|
||||
imageUrl,
|
||||
fit: BoxFit.cover,
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
errorBuilder: (context, error, stackTrace) {
|
||||
return Container(
|
||||
color: Colors.grey.shade200,
|
||||
child: const Icon(Icons.broken_image, size: 32),
|
||||
);
|
||||
},
|
||||
loadingBuilder: (context, child, loadingProgress) {
|
||||
if (loadingProgress == null) return child;
|
||||
return Container(
|
||||
color: Colors.grey.shade200,
|
||||
child: Center(
|
||||
child: CircularProgressIndicator(
|
||||
value: loadingProgress.expectedTotalBytes != null
|
||||
? loadingProgress.cumulativeBytesLoaded /
|
||||
loadingProgress.expectedTotalBytes!
|
||||
: null,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
Color _getRatingColor(double rating) {
|
||||
if (rating >= 4.5) return Colors.green;
|
||||
if (rating >= 3.5) return Colors.orange;
|
||||
if (rating >= 2.5) return Colors.amber;
|
||||
return Colors.red;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Card(
|
||||
margin: const EdgeInsets.only(bottom: 12),
|
||||
elevation: 2,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: InkWell(
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Recipe image
|
||||
recipe.imageUrls.isNotEmpty
|
||||
? GestureDetector(
|
||||
onTap: () => onPhotoTap(0),
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
child: Container(
|
||||
width: 80,
|
||||
height: 80,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.grey.shade200,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: _buildRecipeImage(recipe.imageUrls.first),
|
||||
),
|
||||
),
|
||||
)
|
||||
: Container(
|
||||
width: 80,
|
||||
height: 80,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.grey.shade200,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Icon(
|
||||
Icons.restaurant_menu,
|
||||
color: Colors.grey.shade400,
|
||||
size: 32,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
// Recipe info
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
recipe.title,
|
||||
style: Theme.of(context).textTheme.titleMedium?.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
if (recipe.description != null && recipe.description!.isNotEmpty) ...[
|
||||
const SizedBox(height: 6),
|
||||
Text(
|
||||
recipe.description!,
|
||||
style: Theme.of(context).textTheme.bodySmall?.copyWith(
|
||||
color: Colors.grey.shade600,
|
||||
),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
],
|
||||
const SizedBox(height: 8),
|
||||
Row(
|
||||
children: [
|
||||
// Rating badge
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 8,
|
||||
vertical: 4,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: _getRatingColor(recipe.rating.toDouble()).withOpacity(0.15),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.star,
|
||||
size: 14,
|
||||
color: Colors.amber,
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
recipe.rating.toString(),
|
||||
style: Theme.of(context).textTheme.labelSmall?.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: _getRatingColor(recipe.rating.toDouble()),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
if (recipe.isFavourite) ...[
|
||||
const SizedBox(width: 8),
|
||||
Icon(
|
||||
Icons.favorite,
|
||||
size: 16,
|
||||
color: Colors.red.shade400,
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
// Chevron icon
|
||||
Icon(
|
||||
Icons.chevron_right,
|
||||
color: Colors.grey.shade400,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in new issue