iptv-ren/lib/widgets/simple_countries_sidebar.dart

import 'package:flutter/material.dart';

class SimpleCountriesSidebar extends StatelessWidget {
  final List<String> countries;
  final String selectedCountry;
  final ValueChanged<String> onCountrySelected;
  final bool isLoading;
  final bool isOrganizing;
  final bool showFootballCategory;
  final VoidCallback? onFootballSelected;

  const SimpleCountriesSidebar({
    super.key,
    required this.countries,
    required this.selectedCountry,
    required this.onCountrySelected,
    this.isLoading = false,
    this.isOrganizing = false,
    this.showFootballCategory = false,
    this.onFootballSelected,
  });

  static const String _footballCategoryName = 'Fútbol Argentino';

  @override
  Widget build(BuildContext context) {
    print('🔥 SIDEBAR BUILD ============================================');
    print('🔥 SIDEBAR BUILD - Countries count: ${countries.length}');
    print('🔥 SIDEBAR BUILD - Is Loading: $isLoading');
    print('🔥 SIDEBAR BUILD - Is Organizing: $isOrganizing');
    print('🔥 SIDEBAR BUILD - Countries list: $countries');
    print('🔥 SIDEBAR BUILD - Selected country: "$selectedCountry"');
    
    if (countries.isNotEmpty) {
      print('🔥 SIDEBAR BUILD - First 10 countries:');
      for (int i = 0; i < countries.length && i < 10; i++) {
        print('🔥 SIDEBAR BUILD   [${i + 1}] "${countries[i]}"');
      }
    }
    print('🔥 SIDEBAR BUILD ============================================');
    
    return Container(
      width: 250,
      color: Colors.grey[900],
      child: Column(
        children: [
          // Header
          Container(
            padding: const EdgeInsets.all(16),
            color: Colors.red,
            child: const Row(
              children: [
                Icon(Icons.public, color: Colors.white),
                SizedBox(width: 8),
                Text(
                  'PAÍSES',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ],
            ),
          ),
          
          // List
          Expanded(
            child: isOrganizing || (isLoading && countries.isEmpty)
                ? const Center(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        CircularProgressIndicator(color: Colors.red),
                        SizedBox(height: 16),
                        Text(
                          'Organizando países...',
                          style: TextStyle(color: Colors.white),
                        ),
                      ],
                    ),
                  )
                : countries.isEmpty
                    ? const Center(
                        child: Text(
                          'No hay países',
                          style: TextStyle(color: Colors.white54),
                        ),
                      )
                    : ListView.builder(
                        padding: const EdgeInsets.symmetric(vertical: 8),
                        itemCount: _getItemCount(),
                        itemBuilder: (context, index) {
                          return _buildItemAtIndex(context, index);
                        },
                      ),
          ),
        ],
      ),
    );
  }
  
  Widget _buildCountryItem(String name, bool isSelected, VoidCallback onTap) {
    return InkWell(
      onTap: onTap,
      child: Container(
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
        decoration: BoxDecoration(
          color: isSelected ? Colors.red : Colors.transparent,
          border: Border(
            left: BorderSide(
              color: isSelected ? Colors.white : Colors.transparent,
              width: 4,
            ),
          ),
        ),
        child: Text(
          name,
          style: TextStyle(
            color: Colors.white,
            fontSize: 14,
            fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
          ),
        ),
      ),
    );
  }

  int _getItemCount() {
    int count = countries.length + 1; // +1 for "Todos"
    if (showFootballCategory) {
      count += 1; // +1 for "Fútbol Argentino"
    }
    return count;
  }

  Widget _buildItemAtIndex(BuildContext context, int index) {
    if (index == 0) {
      return _buildCountryItem(
        'Todos',
        selectedCountry.isEmpty,
        () => onCountrySelected(''),
      );
    }

    // Find insertion point for "Fútbol Argentino" (after Perú)
    final peruIndex = countries.indexOf('Perú');
    final footballInsertIndex = peruIndex >= 0 ? peruIndex + 1 : countries.length;

    if (showFootballCategory) {
      // Adjust for "Todos" at index 0 and "Fútbol Argentino" after Perú
      if (index == footballInsertIndex + 1) {
        return _buildFootballItem();
      }

      // Map the adjusted index to the actual country list
      int countryIndex;
      if (index <= footballInsertIndex) {
        // Before football item
        countryIndex = index - 1;
      } else {
        // After football item
        countryIndex = index - 2;
      }

      if (countryIndex >= 0 && countryIndex < countries.length) {
        final country = countries[countryIndex];
        return _buildCountryItem(
          country,
          selectedCountry == country,
          () => onCountrySelected(country),
        );
      }
    } else {
      // Normal behavior without football category
      final country = countries[index - 1];
      return _buildCountryItem(
        country,
        selectedCountry == country,
        () => onCountrySelected(country),
      );
    }

    return const SizedBox.shrink();
  }

  Widget _buildFootballItem() {
    final isSelected = selectedCountry == _footballCategoryName;
    return InkWell(
      onTap: onFootballSelected,
      child: Container(
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
        decoration: BoxDecoration(
          color: isSelected ? Colors.green[700] : Colors.green[900]?.withOpacity(0.3),
          border: Border(
            left: BorderSide(
              color: isSelected ? Colors.white : Colors.green[400]!,
              width: 4,
            ),
          ),
        ),
        child: Row(
          children: [
            Icon(
              Icons.sports_soccer,
              color: Colors.white,
              size: 20,
            ),
            const SizedBox(width: 12),
            Expanded(
              child: Text(
                _footballCategoryName,
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 14,
                  fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}