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

class CategoriesRow1 extends StatelessWidget {
  final List<CategoryData> categories;
  final bool isColapsed;
  final double topPadding;
  final double rightPadding;
  final void Function(CategoryData data) onSelected;
  const CategoriesRow1({
    Key? key,
    required this.categories,
    required this.isColapsed,
    required this.onSelected,
    required this.topPadding,
    required this.rightPadding,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final MediaQueryData d = MediaQuery.of(context);
    return AnimatedPositioned(
      curve: Curves.easeIn,
      duration: DesignConfig.mediumAnimationDuration,
      top: isColapsed ? -60 : topPadding + d.padding.top,
      left: isColapsed ? -rightPadding : 0,
      right: isColapsed ? rightPadding : 0,
      child: Row(
        children: categories
            .sublist(0, 3)
            .map(
              (category) => Expanded(
                child: Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 6),
                  child: CategoryItem(
                    category: category,
                    isColapsed: isColapsed,
                    onSelected: () => onSelected(category),
                  ),
                ),
              ),
            )
            .toList(),
      ),
    );
  }
}

class CategoriesRow2 extends StatelessWidget {
  final List<CategoryData> categories;
  final bool isColapsed;
  final void Function(CategoryData data) onSelected;

  const CategoriesRow2({
    Key? key,
    required this.categories,
    required this.isColapsed,
    required this.onSelected,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final MediaQueryData d = MediaQuery.of(context);
    return AnimatedPositioned(
      curve: Curves.easeIn,
      duration: DesignConfig.mediumAnimationDuration,
      top: isColapsed ? 12 : 92 + d.padding.top,
      left: isColapsed ? -d.size.width : 0,
      right: isColapsed ? d.size.width : 0,
      child: Row(
        children: categories
            .sublist(3, 6)
            .map(
              (category) => Expanded(
                child: CategoryItem(
                  category: category,
                  onSelected: () => onSelected(category),
                  isColapsed: isColapsed,
                ),
              ),
            )
            .toList(),
      ),
    );
  }
}
