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

import '../data/wallet_repository.dart';

/// Écran du portefeuille électronique — solde et historique.
class WalletScreen extends ConsumerWidget {
  const WalletScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final walletAsync = ref.watch(walletProvider);
    final transactionsAsync = ref.watch(walletTransactionsProvider);
    final currencyFormat = NumberFormat.currency(locale: 'fr_FR', symbol: '€');

    return Scaffold(
      appBar: AppBar(title: const Text('Mon portefeuille')),
      body: RefreshIndicator(
        onRefresh: () async {
          ref.invalidate(walletProvider);
          ref.invalidate(walletTransactionsProvider);
        },
        child: ListView(
          padding: const EdgeInsets.all(16),
          children: [
            walletAsync.when(
              loading: () => const Card(
                child: Padding(
                  padding: EdgeInsets.all(24),
                  child: Center(child: CircularProgressIndicator()),
                ),
              ),
              error: (error, _) => Card(
                child: Padding(
                  padding: const EdgeInsets.all(16),
                  child: Text('Erreur solde : $error'),
                ),
              ),
              data: (wallet) => Card(
                child: Padding(
                  padding: const EdgeInsets.all(24),
                  child: Column(
                    children: [
                      Text(
                        'Solde disponible',
                        style: Theme.of(context).textTheme.titleMedium,
                      ),
                      const SizedBox(height: 8),
                      Text(
                        currencyFormat.format(wallet.currentBalance),
                        style: Theme.of(context).textTheme.displaySmall?.copyWith(
                              color: Theme.of(context).colorScheme.primary,
                              fontWeight: FontWeight.bold,
                            ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
            const SizedBox(height: 24),
            Text(
              'Historique',
              style: Theme.of(context).textTheme.titleMedium,
            ),
            const SizedBox(height: 8),
            transactionsAsync.when(
              loading: () => const Center(child: CircularProgressIndicator()),
              error: (error, _) => Text('Erreur historique : $error'),
              data: (transactions) {
                if (transactions.isEmpty) {
                  return const Text('Aucune transaction pour le moment');
                }

                return Column(
                  children: transactions.map((tx) {
                    final isCredit = tx.type == 'credit' || tx.type == 'refund';
                    return Card(
                      child: ListTile(
                        leading: Icon(
                          isCredit ? Icons.add_circle_outline : Icons.remove_circle_outline,
                          color: isCredit ? Colors.green : Colors.red,
                        ),
                        title: Text(tx.type),
                        subtitle: tx.createdAt != null
                            ? Text(DateFormat('dd/MM/yyyy HH:mm').format(tx.createdAt!))
                            : null,
                        trailing: Text(
                          '${isCredit ? '+' : '-'}${currencyFormat.format(tx.amount)}',
                          style: TextStyle(
                            fontWeight: FontWeight.bold,
                            color: isCredit ? Colors.green : Colors.red,
                          ),
                        ),
                      ),
                    );
                  }).toList(),
                );
              },
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: () {
          ScaffoldMessenger.of(context).showSnackBar(
            const SnackBar(content: Text('Rechargement — à connecter à l\'API')),
          );
        },
        icon: const Icon(Icons.add),
        label: const Text('Recharger'),
      ),
    );
  }
}