// lib/features/routes/presentation/widgets/routes_list.dart

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../providers/routes_provider.dart';
import '../../domain/entities/route_entities.dart';

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

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final rutasAsync = ref.watch(allRoutesProvider);

    return rutasAsync.when(
      loading: () => const Center(child: CircularProgressIndicator()),
      error: (e, _) => Center(child: Text('Error: $e')),
      data: (rutas) => ListView.separated(
        padding: const EdgeInsets.all(16),
        itemCount: rutas.length,
        separatorBuilder: (_, __) => const SizedBox(height: 8),
        itemBuilder: (context, i) => _RouteTile(ruta: rutas[i]),
      ),
    );
  }
}

class _RouteTile extends StatelessWidget {
  final TruckRoute ruta;

  const _RouteTile({required this.ruta});

  @override
  Widget build(BuildContext context) {
    return Card(
      child: ListTile(
        leading: CircleAvatar(
          backgroundColor: const Color(0xFF1B5E20).withOpacity(0.1),
          child: Text(
            ruta.routeId.replaceAll('RUTA-', ''),
            style: const TextStyle(
              color: Color(0xFF1B5E20),
              fontWeight: FontWeight.w700,
              fontSize: 12,
            ),
          ),
        ),
        title: Text(
          ruta.name,
          style: const TextStyle(
            fontWeight: FontWeight.w600,
            fontSize: 14,
          ),
        ),
        subtitle: Text(
          '${ruta.positions.length - 1} paradas · Camión ${ruta.truckId}',
          style: TextStyle(fontSize: 12, color: Colors.grey[600]),
        ),
        trailing: _StatusBadge(status: ruta.status),
      ),
    );
  }
}

class _StatusBadge extends StatelessWidget {
  final String status;

  const _StatusBadge({required this.status});

  @override
  Widget build(BuildContext context) {
    final (color, icon) = switch (status) {
      'EN_RUTA'   => (Colors.green, Icons.check_circle),
      'AVERIADA'  => (Colors.red, Icons.error),
      'RETRASADA' => (Colors.orange, Icons.schedule),
      _           => (Colors.grey, Icons.help_outline),
    };

    return Icon(icon, color: color, size: 20);
  }
}