import DatePicker from "@/components/ui/DatePicker";
import React from "react";

interface PlacementDatePickerProps<T extends string = string> {
  placementdate: string;
  setplacementdate: (value: string) => void;
  clearError: (field: T) => void;
  errors: { placementdate?: string };
  handleFieldBlur: (field: T, validateField: (field: T) => string | undefined) => void;
  validateField: (field: T) => string | undefined;
  formatDateToString: (date: Date) => string;
}

const PlacementDatePicker = <T extends string = string>({
  placementdate,
  setplacementdate,
  clearError,
  errors,
  handleFieldBlur,
  validateField,
  formatDateToString,
}: PlacementDatePickerProps<T>) => {
  return (
    <div className="group transition-all duration-200">
      <DatePicker
        label="Placement Date"
        value={placementdate}
        onChange={(date: Date) => {
          setplacementdate(formatDateToString(date));
          clearError("placementdate" as T);
        }}
        error={errors.placementdate}
        onBlur={() => handleFieldBlur("placementdate" as T, validateField)}
        className="text-sm transition-all duration-200 group-hover:border-[#428B4D]/50"
      />
    </div>
  );
};

export default PlacementDatePicker;