import 'package:didvan/config/design_config.dart';
import 'package:didvan/config/theme_data.dart';
import 'package:didvan/models/category.dart';
import 'package:didvan/views/widgets/animated_visibility.dart';
import 'package:didvan/views/widgets/didvan/text.dart';
import 'package:flutter/material.dart';

class CategoriesList extends StatefulWidget {
  final bool isColapsed;
  final bool isAppBar;
  final List<CategoryData> selectedCats;
  final List<CategoryData> categories;
  final bool disableHoushan;
  final void Function(int id) onSelected;
  final double top;
  const CategoriesList({
    Key? key,
    required this.isColapsed,
    required this.selectedCats,
    required this.categories,
    required this.onSelected,
    this.isAppBar = true,
    this.disableHoushan = false,
    required this.top,
  }) : super(key: key);

  @override
  State<CategoriesList> createState() => _CategoriesListState();
}

class _CategoriesListState extends State<CategoriesList> {
  final _scrollController = ScrollController();

  int _lastSelectedCategoryId = 0;

  @override
  void didUpdateWidget(covariant CategoriesList oldWidget) {
    if (widget.selectedCats.isNotEmpty &&
        _lastSelectedCategoryId != widget.selectedCats.first.id) {
      _lastSelectedCategoryId = widget.selectedCats.first.id;
      _scrollController.animateTo(
        widget.selectedCats.first.id * 100,
        duration: DesignConfig.lowAnimationDuration,
        curve: Curves.easeIn,
      );
    }
    super.didUpdateWidget(oldWidget);
  }

  @override
  Widget build(BuildContext context) {
    final MediaQueryData d = MediaQuery.of(context);
    final child = SingleChildScrollView(
      controller: _scrollController,
      scrollDirection: Axis.horizontal,
      padding: widget.isAppBar
          ? EdgeInsets.only(
              top: d.padding.top + 12,
              bottom: 12,
            )
          : null,
      child: Row(
        children: [
          const SizedBox(width: 12),
          if (widget.isAppBar)
            _itemBuilder(
              CategoryData(
                label: 'همه',
                id: 0,
              ),
              context,
            ),
          for (var i = 0; i < widget.categories.length; i++)
            widget.disableHoushan && widget.categories[i].label == 'هوشان'
                ? const SizedBox()
                : _itemBuilder(widget.categories[i], context),
        ],
      ),
    );
    if (widget.isAppBar) {
      return Positioned(
        top: widget.top,
        left: 0,
        right: 0,
        child: AnimatedCrossFade(
          crossFadeState: widget.isColapsed
              ? CrossFadeState.showSecond
              : CrossFadeState.showFirst,
          duration: DesignConfig.mediumAnimationDuration,
          reverseDuration: DesignConfig.lowAnimationDuration,
          sizeCurve: Curves.easeIn,
          firstChild: const SizedBox(),
          secondChild: Container(
            height: 60 + d.padding.top,
            margin: const EdgeInsets.only(bottom: 20),
            decoration: BoxDecoration(
              color: Theme.of(context).colorScheme.surface,
              boxShadow: [
                BoxShadow(
                  color: const Color(0XFF1B3C59).withValues(alpha: 0.15),
                  blurRadius: 8,
                  spreadRadius: 0,
                  offset: const Offset(0, 8),
                )
              ],
            ),
            child: AnimatedVisibility(
              isVisible: widget.isColapsed,
              duration: DesignConfig.mediumAnimationDuration,
              child: child,
            ),
          ),
        ),
      );
    }
    return child;
  }

  Widget _itemBuilder(CategoryData category, BuildContext context) {
    return GestureDetector(
      onTap: () async {
        if (widget.selectedCats.isNotEmpty &&
            widget.selectedCats.first.id == category.id) {
          return;
        }
        widget.selectedCats.clear();
        if (category.id != 0) widget.selectedCats.add(category);
        await _scrollController.animateTo(
          category.id * 100,
          duration: DesignConfig.lowAnimationDuration,
          curve: Curves.easeIn,
        );
        widget.onSelected(category.id);
      },
      child: Container(
        margin: const EdgeInsets.only(left: 12),
        width: 100,
        padding: const EdgeInsets.all(4),
        alignment: Alignment.center,
        decoration: BoxDecoration(
          color: widget.selectedCats.length == 1 &&
                      widget.selectedCats.contains(category) ||
                  category.id == 0 && widget.selectedCats.isEmpty
              ? Theme.of(context).colorScheme.splash
              : null,
          border: Border.all(
            color: Theme.of(context).colorScheme.focusedBorder,
          ),
          borderRadius: DesignConfig.lowBorderRadius,
        ),
        child: FittedBox(
          fit: BoxFit.scaleDown,
          child: DidvanText(
            category.label,
            fontWeight: FontWeight.w600,
            color: Theme.of(context).colorScheme.focusedBorder,
          ),
        ),
      ),
    );
  }
}
