import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:intl/intl.dart';
import 'package:month_picker_dialog/month_picker_dialog.dart';

class ThemedMonthField extends StatefulWidget {
  const ThemedMonthField({
    super.key,
    this.hintText,
    this.txtwidth,
    this.txtheight,
    this.backgroundColor,
    this.borderColor,
    this.highlightColor,
    this.errorBorderColor,
    this.onDateSelected,
    this.controller,
    this.validator, // ✅ new
  });

  final String? hintText;
  final double? txtwidth;
  final double? txtheight;
  final Color? backgroundColor;
  final Color? borderColor;
  final Color? errorBorderColor;
  final Color? highlightColor;
  final TextEditingController? controller;
  final Function(DateTime)? onDateSelected;
  final String? Function(String? value)? validator; // ✅ new

  @override
  State<ThemedMonthField> createState() => _ThemedMonthFieldState();
}

class _ThemedMonthFieldState extends State<ThemedMonthField> {
  DateTime? selectedDate;

  Future<void> pickDate(
    BuildContext context,
    FormFieldState<String> field,
  ) async {
    final pickedDate = await showMonthPicker(
      context: context,
      initialDate: selectedDate ?? DateTime.now(),
      firstDate: DateTime(2000),
      lastDate: DateTime(2100),
    );

    if (pickedDate != null) {
      setState(() => selectedDate = pickedDate);

      final formattedDate = DateFormat('MMM yyyy').format(pickedDate);
      widget.controller?.text = formattedDate;
      widget.onDateSelected?.call(pickedDate);

      field.didChange(formattedDate); // ✅ notify form validation
    }
  }

  @override
  Widget build(BuildContext context) {
    return FormField<String>(
      validator: widget.validator,
      initialValue: widget.controller?.text,
      builder: (field) {
        final hasError = field.hasError;
        return Container(
          width: widget.txtwidth ?? MediaQuery.of(context).size.width,
          height: widget.txtheight,
          child: InkWell(
            onTap: () => pickDate(context, field),
            borderRadius: BorderRadius.circular(10),
            child: Container(
              padding: const EdgeInsets.symmetric(vertical: 1, horizontal: 15),
              decoration: BoxDecoration(
                color: widget.backgroundColor ?? Colors.white,
                borderRadius: BorderRadius.circular(10),

                border: Border.all(
                  color: hasError
                      ? (widget.errorBorderColor ?? Colors.red)
                      : (widget.borderColor ?? Colors.grey.shade50),
                  width: 1,
                ),
              ),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Expanded(
                    child: Text(
                      widget.controller?.text.isNotEmpty == true
                          ? widget.controller!.text
                          : widget.hintText ?? "Select Date",
                      style: GoogleFonts.inter(
                        fontSize: 11,
                        color: hasError ? Colors.red : Colors.black,
                      ),
                      overflow: TextOverflow.ellipsis,
                    ),
                  ),
                  const Icon(
                    Icons.calendar_today,
                    size: 12,
                    color: Colors.black,
                  ),
                ],
              ),
            ),
          ),
        );
      },
    );
  }
}