import type { DateInput } from "@mantine/dates";
import type { ComponentProps } from "react";

import { bankDateInputValue } from "../model/form-validation";
import { bankDateSchema } from "../model/form.schema";

type DateField = {
	onBlur: () => void;
	onChange: (value: string) => void;
	value: string;
};

function bankDateField(field: DateField) {
	const dateParser: ComponentProps<typeof DateInput>["dateParser"] = (value) => {
		const parsed = bankDateInputValue(value);

		return bankDateSchema.safeParse(parsed).success ? parsed : null;
	};

	const onBlur: ComponentProps<typeof DateInput>["onBlur"] = (event) => {
		field.onChange(bankDateInputValue(event.currentTarget.value));
		field.onBlur();
	};

	const onInput: ComponentProps<typeof DateInput>["onInput"] = event =>
		field.onChange(bankDateInputValue(event.currentTarget.value));

	return {
		dateParser,
		onBlur,
		onChange: (value: null | string) => field.onChange(value ?? ""),
		onInput,
		value: bankDateSchema.safeParse(field.value).success
			? field.value
			: undefined,
	};
}

export { bankDateField };