import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:krow/core/presentation/gen/assets.gen.dart';
import 'package:krow/core/presentation/styles/kw_text_styles.dart';
import 'package:krow/core/presentation/styles/theme.dart';
import 'package:krow/features/shifts/domain/shift_entity.dart';

class ShiftAdditionalDetails extends StatefulWidget {
  final ShiftEntity viewModel;

  const ShiftAdditionalDetails({super.key, required this.viewModel});

  @override
  State<ShiftAdditionalDetails> createState() => _ShiftAdditionalDetailsState();
}

class _ShiftAdditionalDetailsState extends State<ShiftAdditionalDetails> {
  bool expanded = false;

  @override
  Widget build(BuildContext context) {
    if (widget.viewModel.additionalData?.isEmpty ?? true) {
      return const Gap(12);
    }
    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: [
        const Gap(12),
        Container(
          margin: const EdgeInsets.symmetric(horizontal: 20),
          height: 1,
          color: AppColors.grayTintStroke,
        ),
        const Gap(12),
        GestureDetector(
          onTap: () {
            setState(() {
              expanded = !expanded;
            });
          },
          child: Container(
            margin: const EdgeInsets.symmetric(horizontal: 20),
            height: 16,
            color: Colors.transparent,
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Text('additional_details'.tr(),
                    style: AppTextStyles.captionReg),
                const Spacer(),
                AnimatedRotation(
                    duration: const Duration(milliseconds: 150),
                    turns: expanded ? -0.5 : 0,
                    child: Assets.images.icons.caretDown.svg(
                        width: 16,
                        height: 16,
                        colorFilter: const ColorFilter.mode(
                            AppColors.blackBlack, BlendMode.srcIn))),
              ],
            ),
          ),
        ),
        if (widget.viewModel.additionalData?.isNotEmpty ?? false) ...[
          const Gap(12),
          _buildExpandedDetails(),
        ]
      ],
    );
  }

  _buildExpandedDetails() {
    return AnimatedContainer(
      duration: const Duration(milliseconds: 200),
      clipBehavior: Clip.antiAlias,
      height: expanded ? widget.viewModel.additionalData!.length * 28 + 12 : 0,
      padding: const EdgeInsets.only(left: 20, right: 20, bottom: 12),
      decoration: const BoxDecoration(
        color: AppColors.graySecondaryFrame,
        borderRadius: BorderRadius.vertical(bottom: Radius.circular(12)),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          ...widget.viewModel.additionalData?.map(
                (e) {
                  return Padding(
                    padding: const EdgeInsets.only(top: 12),
                    child: Row(
                      children: [
                        Text(e.name ?? '',
                            style: AppTextStyles.bodySmallReg
                                .copyWith(color: AppColors.blackGray)),
                        const Spacer(),
                         Text('yes'.tr(), style: AppTextStyles.bodySmallReg),
                      ],
                    ),
                  );
                },
              ) ??
              [],
        ],
      ),
    );
  }
}
