import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:intl/intl.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/home/presentation/home_screen.dart';

class KwTimeSlotInput extends StatefulWidget {
  const KwTimeSlotInput({
    super.key,
    required this.label,
    required this.onChange,
    required this.initialValue,
  });

  static final _timeFormat = DateFormat('h:mma');

  final String label;
  final Function(DateTime value) onChange;
  final DateTime initialValue;

  @override
  State<KwTimeSlotInput> createState() => _KwTimeSlotInputState();
}

class _KwTimeSlotInputState extends State<KwTimeSlotInput> {
  late DateTime _currentValue = widget.initialValue;

  @override
  void didChangeDependencies() {
    _currentValue = widget.initialValue;
    super.didChangeDependencies();
  }

  @override
  void didUpdateWidget(covariant KwTimeSlotInput oldWidget) {
    _currentValue = widget.initialValue;
    super.didUpdateWidget(oldWidget);
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: [
        Padding(
          padding: const EdgeInsets.only(left: 16, bottom: 4),
          child: Text(
            widget.label,
            style: AppTextStyles.bodyTinyReg.copyWith(
              color: AppColors.blackGray,
            ),
          ),
        ),
        Material(
          color: Colors.transparent,
          child: InkWell(
            borderRadius: const BorderRadius.all(
              Radius.circular(24),
            ),
            onTap: () {
              showModalBottomSheet(
                context: homeContext!,
                isScrollControlled: false,
                builder: (context) {
                  return Container(
                    alignment: Alignment.topCenter,
                    height: 216 + 48, //_kPickerHeight + 24top+24bot
                    child: CupertinoDatePicker(
                      mode: CupertinoDatePickerMode.time,
                      initialDateTime: _currentValue,
                      minuteInterval: 10,
                      itemExtent: 36,
                      onDateTimeChanged: (DateTime value) {
                        setState(() => _currentValue = value);
                        widget.onChange.call(value);
                      },
                    ),
                  );
                },
              );
            },
            child: Container(
              height: 48,
              alignment: Alignment.centerLeft,
              decoration: BoxDecoration(
                border: Border.all(color: AppColors.grayStroke),
                borderRadius: BorderRadius.circular(24),
              ),
              child: Padding(
                padding: const EdgeInsets.only(left: 16, right: 16),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      KwTimeSlotInput._timeFormat.format(_currentValue),
                      style: AppTextStyles.bodyMediumReg,
                    ),
                    Assets.images.icons.caretDown.svg(
                      height: 16,
                      width: 16,
                      colorFilter: const ColorFilter.mode(
                        AppColors.blackBlack,
                        BlendMode.srcIn,
                      ),
                    )
                  ],
                ),
              ),
            ),
          ),
        ),
      ],
    );
  }
}
