import Button, { ButtonSize, ButtonStyleType } from "../Button/Button";
import Input, { InputType } from "../Input/Input";
import InBetween from "../../../Types/BaseDatabase/InBetween";
import OneUptimeDate from "../../../Types/Date";
import React, { useEffect } from "react";
export var StartAndEndDateType;
(function (StartAndEndDateType) {
    StartAndEndDateType["Date"] = "Date";
    StartAndEndDateType["DateTime"] = "DateTime";
})(StartAndEndDateType || (StartAndEndDateType = {}));
const StartAndEndDate = (props) => {
    var _a, _b;
    const [startDateError, setStartDateError] = React.useState("");
    const [endDateError, setEndDateError] = React.useState("");
    let inputType = InputType.TEXT;
    if (props.type === StartAndEndDateType.Date) {
        inputType = InputType.DATE;
    }
    else if (props.type === StartAndEndDateType.DateTime) {
        inputType = InputType.DATETIME_LOCAL;
    }
    const startDateTime = (_a = props.value) === null || _a === void 0 ? void 0 : _a.startValue;
    const endDateTime = (_b = props.value) === null || _b === void 0 ? void 0 : _b.endValue;
    useEffect(() => {
        if (endDateTime && startDateTime) {
            // check if start date is after end date
            if (!OneUptimeDate.isAfter(endDateTime, startDateTime)) {
                setStartDateError("Start date should be before end date");
                setEndDateError("End date should be after start date");
                return;
            }
            setStartDateError("");
            setEndDateError("");
            return;
        }
        if (startDateTime && !endDateTime) {
            setStartDateError("");
            setEndDateError("End date is required");
        }
        else if (!startDateTime && endDateTime) {
            setEndDateError("");
            setStartDateError("Start date is required");
        }
        else {
            setStartDateError("");
            setEndDateError("");
        }
    }, [props.value]);
    // difference between both dates is 60 mins.
    const is1Hour = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMinutes(startDateTime, endDateTime) === 60;
    // difference between both dates is 3 hours.
    const is3Hours = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMinutes(startDateTime, endDateTime) === 180;
    // difference between both dates is 1 day.
    const is1Day = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMinutes(startDateTime, endDateTime) === 1440;
    // difference between both dates is 1 week.
    const is1Week = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMinutes(startDateTime, endDateTime) === 10080;
    // difference between both dates is 2 weeks.
    const is2Weeks = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMinutes(startDateTime, endDateTime) === 20160;
    // difference between both dates is 3 weeks.
    const is3Weeks = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMinutes(startDateTime, endDateTime) === 30240;
    // difference between both dates is 1 month.
    const is1Month = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMonths(startDateTime, endDateTime) === 1;
    // difference between both dates is 3 months.
    const is3Months = props.type === StartAndEndDateType.DateTime &&
        startDateTime &&
        endDateTime &&
        OneUptimeDate.getDifferenceInMonths(startDateTime, endDateTime) === 3;
    if (props.type === StartAndEndDateType.Date ||
        props.type === StartAndEndDateType.DateTime) {
        return (React.createElement("div", null,
            React.createElement("div", { className: "flex flex-col md:flex-row md:space-x-3 space-y-3 md:space-y-0 mt-1" },
                React.createElement("div", { className: "w-full md:w-1/2" },
                    React.createElement("div", { className: "text-xs text-gray-500" }, "From:"),
                    React.createElement("div", null,
                        React.createElement(Input, { error: startDateError, onChange: (changedValue) => {
                                var _a, _b;
                                if (!changedValue) {
                                    (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(OneUptimeDate.getCurrentDate(), endDateTime || OneUptimeDate.getCurrentDate()));
                                }
                                if (changedValue &&
                                    (props.type === StartAndEndDateType.Date ||
                                        props.type === StartAndEndDateType.DateTime)) {
                                    (_b = props.onValueChanged) === null || _b === void 0 ? void 0 : _b.call(props, new InBetween(OneUptimeDate.fromString(changedValue), endDateTime || OneUptimeDate.getCurrentDate()));
                                }
                            }, value: startDateTime || "", placeholder: `Start Date`, type: inputType, showSecondsForDateTime: props.type === StartAndEndDateType.DateTime }))),
                React.createElement("div", { className: "w-full md:w-1/2" },
                    React.createElement("div", { className: "text-xs text-gray-500" }, "To:"),
                    React.createElement("div", null,
                        React.createElement(Input, { error: endDateError, onChange: (changedValue) => {
                                var _a, _b;
                                if (!changedValue) {
                                    (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDateTime || OneUptimeDate.getCurrentDate(), OneUptimeDate.getCurrentDate()));
                                }
                                if (changedValue &&
                                    (props.type === StartAndEndDateType.Date ||
                                        props.type === StartAndEndDateType.DateTime)) {
                                    (_b = props.onValueChanged) === null || _b === void 0 ? void 0 : _b.call(props, new InBetween(startDateTime || OneUptimeDate.getCurrentDate(), OneUptimeDate.fromString(changedValue)));
                                }
                            }, value: endDateTime || "", placeholder: `End Date`, type: inputType, showSecondsForDateTime: props.type === StartAndEndDateType.DateTime })))),
            !props.hideTimeButtons && (React.createElement("div", { className: "mt-1 flex space-x-2 -ml-3" },
                props.type === StartAndEndDateType.DateTime && (React.createElement(Button, { buttonStyle: is1Hour ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 1 hour
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveHours(endDate, -1);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "1 hour" })),
                props.type === StartAndEndDateType.DateTime && (React.createElement(Button, { buttonStyle: is3Hours ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 3 hour
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveHours(endDate, -3);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "3 hours", className: "hidden md:block" })),
                React.createElement(Button, { buttonStyle: is1Day ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 1 day
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveDays(endDate, -1);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "1 day" }),
                React.createElement(Button, { buttonStyle: is1Week ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 1 week
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveDays(endDate, -7);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "1 week" }),
                React.createElement(Button, { buttonStyle: is2Weeks ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 2 weeks
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveDays(endDate, -14);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "2 weeks", className: "hidden md:block" }),
                React.createElement(Button, { buttonStyle: is3Weeks ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 3 weeks
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveDays(endDate, -21);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "3 weeks", className: "hidden md:block" }),
                React.createElement(Button, { buttonStyle: is1Month ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 1 month
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveMonths(endDate, -1);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "1 month", className: "hidden md:block" }),
                React.createElement(Button, { buttonStyle: is3Months ? ButtonStyleType.PRIMARY : ButtonStyleType.NORMAL, buttonSize: ButtonSize.Small, onClick: () => {
                        var _a;
                        // set it to past 3 months
                        const endDate = OneUptimeDate.resetSecondsAndMilliseconds(OneUptimeDate.getCurrentDate());
                        const startDate = OneUptimeDate.addRemoveMonths(endDate, -3);
                        (_a = props.onValueChanged) === null || _a === void 0 ? void 0 : _a.call(props, new InBetween(startDate, endDate));
                    }, title: "3 months", className: "hidden md:block" })))));
    }
    return React.createElement(React.Fragment, null);
};
export default StartAndEndDate;
//# sourceMappingURL=StartAndEndDate.js.map