import React from "react";
import { FormFieldProps } from "react-compose-form";
import { FormFieldContext, FormItem, FormLabel, FormControl, FormMessage } from "@/components/ui/form";
import { DateTimePicker } from "@/components/ui/date-time-picker";

export type DateTimeFieldProps = FormFieldProps<{
    label?: string;
}>;

export const DateTimeField: React.FC<DateTimeFieldProps> = (props) => {
    const {
        label,
        name,
        ...rest
    } = props;

    return (
      <FormFieldContext
        value={{
          name: name as string
        }}
      >
        <FormItem>
          {label && <FormLabel>{label}</FormLabel>}
          <FormControl>
            <DateTimePicker {...rest} />
          </FormControl>
          <FormMessage />
        </FormItem>
      </FormFieldContext>
    );
};