import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../providers/event_detail_provider.dart';
import '../widgets/loading_indicator.dart';

class EventDetailScreen extends StatefulWidget {
  final String gameId;
  final String account;
  final String eventTitle;

  const EventDetailScreen({
    super.key,
    required this.gameId,
    required this.account,
    required this.eventTitle,
  });

  @override
  State<EventDetailScreen> createState() => _EventDetailScreenState();
}

class _EventDetailScreenState extends State<EventDetailScreen> {
  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) {
      context.read<EventDetailProvider>().loadEventDetail(
        widget.gameId,
        widget.account,
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.eventTitle),
      ),
      body: Consumer<EventDetailProvider>(
        builder: (context, provider, child) {
          if (provider.isLoading) {
            return const LoadingIndicator();
          }

          if (provider.error != null) {
            return Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    provider.error!,
                    style: const TextStyle(color: Colors.red),
                  ),
                  ElevatedButton(
                    onPressed: () => provider.loadEventDetail(
                      widget.gameId,
                      widget.account,
                    ),
                    child: const Text('Reessayer'),
                  ),
                ],
              ),
            );
          }

          final detail = provider.eventDetail;
          if (detail == null) {
            return const Center(child: Text('Aucune donnee disponible'));
          }

          final hasPlayers = detail.convocation.available.isNotEmpty;
          final hasStaff = detail.convocation.staff.isNotEmpty;

          return SingleChildScrollView(
            padding: const EdgeInsets.all(16),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                // Recap card
                Card(
                  child: Padding(
                    padding: const EdgeInsets.all(16),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text('Type: ${detail.type}'),
                        Text('Lieu: ${detail.place}'),
                        Text('Heure: ${detail.timeStart} - ${detail.timeEnd}'),
                      ],
                    ),
                  ),
                ),
                const SizedBox(height: 16),

                // No convocation at all
                if (!hasPlayers && !hasStaff) ...[
                  const Card(
                    color: Colors.amber,
                    child: Padding(
                      padding: EdgeInsets.all(16),
                      child: Text(
                        'Aucun joueur ni personnel convoque',
                        style: TextStyle(fontWeight: FontWeight.bold),
                      ),
                    ),
                  ),
                ],

                // Players section
                if (hasPlayers) ...[
                  Text(
                    'Joueurs (${detail.convocation.available.length})',
                    style: Theme.of(context).textTheme.titleLarge,
                  ),
                  const SizedBox(height: 8),
                  ...detail.convocation.available.map((player) {
                    final position = player.position ?? 'N/A';
                    final number = player.number ?? 'N/A';
                    return Card(
                      child: ListTile(
                        title: Text('[$position] #$number - ${player.fname} ${player.lname}'),
                        subtitle: Text('DOB: ${player.dob}'),
                      ),
                    );
                  }),
                  const SizedBox(height: 16),
                ],

                // Staff section
                if (hasStaff) ...[
                  Text(
                    'Personnel',
                    style: Theme.of(context).textTheme.titleLarge,
                  ),
                  const SizedBox(height: 8),
                  ...detail.convocation.staff.map((staff) {
                    return Card(
                      child: ListTile(
                        title: Text('${staff.role}: ${staff.fname} ${staff.lname}'),
                      ),
                    );
                  }),
                ],
              ],
            ),
          );
        },
      ),
    );
  }
}