import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../providers/cart_provider.dart';
import '../providers/cart_total_provider.dart';
import 'cart_item_card.dart';
import '../../../../shared/widgets/price_display.dart';
import '../../../../core/widgets/empty_state.dart';

/// Cart summary widget
class CartSummary extends ConsumerWidget {
  const CartSummary({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final cartAsync = ref.watch(cartProvider);
    final totalData = ref.watch(cartTotalProvider);

    return Container(
      decoration: BoxDecoration(
        border: Border(
          top: BorderSide(
            color: Theme.of(context).dividerColor,
            width: 1,
          ),
        ),
      ),
      child: Column(
        children: [
          Padding(
            padding: const EdgeInsets.all(16.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  'Shopping Cart',
                  style: Theme.of(context).textTheme.titleLarge,
                ),
                if (cartAsync.value?.isNotEmpty ?? false)
                  TextButton.icon(
                    onPressed: () {
                      ref.read(cartProvider.notifier).clearCart();
                    },
                    icon: const Icon(Icons.delete_sweep),
                    label: const Text('Clear'),
                  ),
              ],
            ),
          ),
          Expanded(
            child: cartAsync.when(
              loading: () => const Center(child: CircularProgressIndicator()),
              error: (error, stack) => Center(child: Text('Error: $error')),
              data: (items) {
                if (items.isEmpty) {
                  return const EmptyState(
                    message: 'Cart is empty',
                    subMessage: 'Add products to get started',
                    icon: Icons.shopping_cart_outlined,
                  );
                }

                return ListView.builder(
                  itemCount: items.length,
                  itemBuilder: (context, index) {
                    final item = items[index];
                    return CartItemCard(
                      item: item,
                      onRemove: () {
                        ref.read(cartProvider.notifier).removeItem(item.productId);
                      },
                      onQuantityChanged: (quantity) {
                        ref.read(cartProvider.notifier).updateQuantity(
                              item.productId,
                              quantity,
                            );
                      },
                    );
                  },
                );
              },
            ),
          ),
          Container(
            padding: const EdgeInsets.all(16.0),
            decoration: BoxDecoration(
              color: Theme.of(context).colorScheme.surfaceContainerHighest,
            ),
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      'Total:',
                      style: Theme.of(context).textTheme.titleLarge,
                    ),
                    PriceDisplay(
                      price: totalData.total,
                      style: Theme.of(context).textTheme.headlineSmall?.copyWith(
                            fontWeight: FontWeight.bold,
                          ),
                    ),
                  ],
                ),
                const SizedBox(height: 16),
                SizedBox(
                  width: double.infinity,
                  child: ElevatedButton.icon(
                    onPressed: (cartAsync.value?.isNotEmpty ?? false)
                        ? () {
                            // TODO: Implement checkout
                          }
                        : null,
                    icon: const Icon(Icons.payment),
                    label: const Text('Checkout'),
                    style: ElevatedButton.styleFrom(
                      padding: const EdgeInsets.all(16),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}