pluriwave/lib/pantallas/pantalla_buscar.dart

import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:provider/provider.dart';

import '../estado/estado_radio.dart';
import '../tema/pluriwave_theme.dart';
import '../widgets/pluri_glass_surface.dart';
import '../widgets/pluri_icon.dart';
import '../widgets/tarjeta_emisora.dart';

const _paises = [
  ('España', 'ES'), ('USA', 'US'), ('México', 'MX'), ('Argentina', 'AR'),
  ('UK', 'GB'), ('Francia', 'FR'), ('Alemania', 'DE'), ('Italia', 'IT'),
  ('Brasil', 'BR'), ('Japón', 'JP'),
];

const _idiomas = [
  'spanish', 'english', 'french', 'german', 'portuguese',
  'italian', 'japanese', 'arabic', 'russian',
];

class PantallaBuscar extends StatefulWidget {
  const PantallaBuscar({super.key});

  @override
  State<PantallaBuscar> createState() => _PantallaBuscarState();
}

class _PantallaBuscarState extends State<PantallaBuscar> {
  final _controller = TextEditingController();
  String? _paisSeleccionado;
  String? _idiomaSeleccionado;

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void _buscar() {
    final q = _controller.text.trim();
    context.read<EstadoRadio>().buscar(
      nombre: q.isNotEmpty ? q : null,
      pais: _paisSeleccionado,
      idioma: _idiomaSeleccionado,
    );
  }

  @override
  Widget build(BuildContext context) {
    final estado = context.watch<EstadoRadio>();
    final theme = Theme.of(context);

    return Column(
      children: [
        Padding(
          padding: const EdgeInsets.fromLTRB(16, 10, 16, 0),
          child: PluriGlassSurface(
            padding: const EdgeInsets.all(10),
            child: SearchBar(
              controller: _controller,
              hintText: 'Nombre de la emisora...',
              leading: const PluriIcon(glyph: PluriIconGlyph.search, variant: PluriIconVariant.filled),
              trailing: [
                if (_controller.text.isNotEmpty)
                  IconButton(
                    icon: const Icon(Icons.clear),
                    onPressed: () {
                      _controller.clear();
                      setState(() {});
                      _buscar();
                    },
                  ),
              ],
              onSubmitted: (_) => _buscar(),
              onChanged: (_) => setState(() {}),
            ),
          ),
        ),
        _seccionFiltro('País', _paises.map((p) => (p.$1, p.$2)).toList(), _paisSeleccionado, (v) {
          setState(() => _paisSeleccionado = v);
          _buscar();
        }),
        _seccionFiltro('Idioma', _idiomas.map((i) => (i, i)).toList(), _idiomaSeleccionado, (v) {
          setState(() => _idiomaSeleccionado = v);
          _buscar();
        }),
        Expanded(child: _resultados(estado, theme)),
      ],
    );
  }

  Widget _seccionFiltro(
    String titulo,
    List<(String, String)> opciones,
    String? seleccionado,
    void Function(String?) onChanged,
  ) {
    final theme = Theme.of(context);
    return Padding(
      padding: const EdgeInsets.fromLTRB(16, 8, 16, 0),
      child: PluriGlassSurface(
        padding: const EdgeInsets.all(10),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(titulo, style: theme.textTheme.labelLarge),
            const SizedBox(height: 4),
            SizedBox(
              height: 36,
              child: ListView.separated(
                scrollDirection: Axis.horizontal,
                itemCount: opciones.length,
                separatorBuilder: (_, __) => const SizedBox(width: 6),
                itemBuilder: (_, i) {
                  final (label, value) = opciones[i];
                  final sel = seleccionado == value;
                  return FilterChip(
                    label: Text(label),
                    selected: sel,
                    visualDensity: VisualDensity.compact,
                    onSelected: (_) => onChanged(sel ? null : value),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _resultados(EstadoRadio estado, ThemeData theme) {
    if (estado.cargandoBusqueda) {
      return const Center(child: CircularProgressIndicator());
    }

    final resultados = estado.resultadosBusqueda;

    if (resultados.isEmpty) {
      final sinFiltros = _controller.text.isEmpty && _paisSeleccionado == null && _idiomaSeleccionado == null;
      return Center(
        child: PluriGlassSurface(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              const PluriIcon(glyph: PluriIconGlyph.search, variant: PluriIconVariant.activeGlow, size: 44),
              const SizedBox(height: 14),
              Text(sinFiltros ? 'Buscá una emisora' : 'Sin resultados', style: theme.textTheme.titleMedium),
            ],
          ),
        ),
      );
    }

    return ListView.separated(
      padding: const EdgeInsets.all(16),
      itemCount: resultados.length,
      separatorBuilder: (_, __) => const SizedBox(height: 6),
      itemBuilder: (context, i) => TarjetaEmisora(
        emisora: resultados[i],
        esCompacta: true,
        onTap: () => context.read<EstadoRadio>().reproducir(resultados[i]),
      ).animate().fadeIn(delay: (i * 20).ms),
    );
  }
}