// ignore_for_file: prefer_final_fields

import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:lba/gen/assets.gen.dart';
import 'package:lba/res/colors.dart';

class Interests extends StatefulWidget {
  final String icon;
  final String title;
  final List<String> options;

  const Interests({
    super.key,
    required this.icon,
    required this.title,
    required this.options,
  });

  @override
  State<Interests> createState() => _InterestsState();
}

class _InterestsState extends State<Interests> {
  bool _isExpanded = false;
  List<String> _selectedOptions = [];

  void _onOptionToggled(String option) {
    setState(() {
      if (_selectedOptions.contains(option)) {
        _selectedOptions.remove(option);
      } else {
        _selectedOptions.add(option);
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.fromLTRB(24, 8, 24, 8),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          InkWell(
            onTap: () {
              setState(() {
                _isExpanded = !_isExpanded;
              });
            },
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    SvgPicture.asset(widget.icon),
                    const SizedBox(width: 5),
                    Text(
                      widget.title,
                      style: const TextStyle(fontWeight: FontWeight.w500),
                    ),
                  ],
                ),
                SvgPicture.asset(Assets.icons.arrowDown.path)
              ],
            ),
          ),
          if (_isExpanded)
            optionSelect()
        ],
      ),
    );
  }

  Padding optionSelect() {
    return Padding(
      padding: EdgeInsets.fromLTRB(0, 15, 0, 10),
      child: Wrap(
        spacing: 10,
        runSpacing: 10,
        children: widget.options.map((option) {
          final isSelected = _selectedOptions.contains(option);
          return GestureDetector(
            onTap: () => _onOptionToggled(option),
            child: Container(
              padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 12),
              decoration: BoxDecoration(
                color: isSelected ? AppColors.slectedTitle : Colors.transparent,
                borderRadius: BorderRadius.circular(20),
                border: Border.all(color: isSelected ? Colors.transparent : AppColors.divider),
              ),
              child: Text(
                option,
                style: TextStyle(
                  color: isSelected ? AppColors.slectedText : AppColors.textSecondary,
                  fontWeight: FontWeight.bold
                ),
              ),
            ),
          );
        }).toList(),
      ),
    );
  }
}