import * as React from 'react';
import { Box } from 'rebass';
import { CheckBox } from '../../../components/CheckBox';
import FormLayout, { FormRow } from '../../../components/FormLayout';
import Radio from '../../../components/Radio';
import { Tabs } from '../../../components/Tabs';
import ArrayExtensions from '../../../Utilities/Extensions/ArrayExtensions';
import AdaptableInput from '../../Components/AdaptableInput';
import { useOnePageAdaptableWizardContext } from '../../Wizard/OnePageAdaptableWizard';
export const isScheduleValid = (schedule, isOneOff) => {
    if (!schedule.Schedule) {
        return 'Schedule is not specified';
    }
    if (schedule.Schedule.Hour === null || schedule.Schedule.Minute === null) {
        return 'Schedule Time is not specified';
    }
    if (isOneOff && !schedule.Schedule.OneOffDate) {
        return 'Schedule Date is not specified';
    }
    if (!isOneOff && ArrayExtensions.IsEmpty(schedule?.Schedule?.DaysOfWeek)) {
        return 'Schedule Days are not specified';
    }
    return true;
};
const daysMap = [
    {
        label: 'Monday',
        value: 'Monday',
    },
    {
        label: 'Tuesday',
        value: 'Tuesday',
    },
    {
        label: 'Wednesday',
        value: 'Wednesday',
    },
    {
        label: 'Thursday',
        value: 'Thursday',
    },
    {
        label: 'Friday',
        value: 'Friday',
    },
    {
        label: 'Saturday',
        value: 'Saturday',
    },
    {
        label: 'Sunday',
        value: 'Sunday',
    },
];
export const ScheduleScheduleWizard = (props) => {
    const { data } = useOnePageAdaptableWizardContext();
    const handleIsOneOfChange = (isOneOffNew) => {
        props.onSetIsOneOff(isOneOffNew);
        const OneOffDate = !isOneOffNew ? null : data?.Schedule?.OneOffDate;
        const DaysOfWeek = isOneOffNew ? [] : data?.Schedule?.DaysOfWeek;
        props.onChange({
            ...data,
            Schedule: {
                ...data.Schedule,
                OneOffDate,
                DaysOfWeek,
            },
        });
    };
    const handleTimeChange = (event) => {
        const [hours, minutes] = (event.target.value || '00:00')
            ?.split(':')
            ?.map((item) => parseInt(item, 10));
        props.onChange({
            ...data,
            Schedule: {
                ...data.Schedule,
                Hour: hours,
                Minute: minutes,
            },
        });
    };
    const handleDayChange = (checked, day) => {
        let newDays = data.Schedule.DaysOfWeek || [];
        if (checked) {
            newDays = [...newDays, day];
        }
        else {
            newDays = newDays.filter((previousDay) => previousDay !== day);
        }
        props.onChange({
            ...data,
            Schedule: {
                ...data.Schedule,
                DaysOfWeek: newDays,
            },
        });
    };
    const handleOneOfDateChange = (event) => {
        props.onChange({
            ...data,
            Schedule: {
                ...data.Schedule,
                OneOffDate: event.target.value,
            },
        });
    };
    let timeValue = '00:00';
    if (typeof data.Schedule?.Hour === 'number' || typeof data?.Schedule?.Minute === 'number') {
        const hours = `${data.Schedule?.Hour}` || '00';
        const minute = `${data.Schedule?.Minute}` || '00';
        timeValue = `${hours.padStart(2, '0')}:${minute.padStart(2, '0')}`;
    }
    return (React.createElement(Box, { "data-name": "schedule-setup" },
        React.createElement(Tabs, { autoFocus: false },
            React.createElement(Tabs.Tab, null, "Schedule"),
            React.createElement(Tabs.Content, null,
                React.createElement(FormLayout, null,
                    React.createElement(FormRow, { label: "Frequency" },
                        React.createElement(Radio, { "data-name": "frequency-recurring", mr: 2, value: "recurring", checked: !props.isOneOff, onChange: (checked) => checked && handleIsOneOfChange(false) }, "Recurring Days"),
                        React.createElement(Radio, { "data-name": "frequency-one-off", checked: props.isOneOff, value: "oneoff", onChange: (checked) => checked && handleIsOneOfChange(true) }, "One-Off Date")),
                    props.isOneOff ? (React.createElement(FormRow, { label: "Date" },
                        React.createElement(AdaptableInput, { "data-name": "one-off-date", width: 300, type: "date", placeholder: "Date", onChange: handleOneOfDateChange, value: data.Schedule?.OneOffDate || '' }))) : (React.createElement(FormRow, { label: "Days" }, daysMap.map((day) => (React.createElement(CheckBox, { "data-name": `day-${day.value}`, width: "33%", ml: 2, value: day.value, checked: data.Schedule?.DaysOfWeek?.includes(day.value), key: day.value, onChange: (checked) => handleDayChange(checked, day.value) }, day.label))))),
                    React.createElement(FormRow, { label: "Time" },
                        React.createElement(AdaptableInput, { "data-name": "time", width: 300, value: timeValue, type: "time", onChange: handleTimeChange })))))));
};
