import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

import '../../../core/api/api_error_mapper.dart';
import '../../../core/ui/async_state_views.dart';
import '../data/recipe_providers.dart';

class RecipesScreen extends ConsumerWidget {
  const RecipesScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final recipesAsync = ref.watch(recipesProvider);
    return recipesAsync.when(
      loading: () => const LoadingStateView(label: 'Laddar recept...'),
      error: (error, _) => ErrorStateView(
        message: mapErrorToUserMessage(error),
        onRetry: () => ref.invalidate(recipesProvider),
      ),
      data: (recipes) {
        if (recipes.isEmpty) {
          return const EmptyStateView(
            title: 'Inga recept hittades',
            description: 'Lagg till ett recept for att komma igang.',
          );
        }

        return ListView.builder(
          itemCount: recipes.length,
          itemBuilder: (context, index) {
            final recipe = recipes[index];
            return ListTile(
              leading: recipe.imageUrl != null
                  ? Image.network(recipe.imageUrl!, width: 56, fit: BoxFit.cover)
                  : const Icon(Icons.restaurant),
              title: Text(recipe.title),
              subtitle: recipe.description != null
                  ? Text(
                      recipe.description!,
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                    )
                  : null,
            );
          },
        );
      },
    );
  }
}