import React, { useState, useEffect } from 'react';
import { faCircleInfo } from '@fortawesome/free-solid-svg-icons/faCircleInfo';
import { Input } from '../input';
import { FIELD_BOUNDARIES } from './constants';
import { stringToArrayOfNumbersOrAll } from './utils';
import { jsx as _jsx } from "react/jsx-runtime";
export function AdvancedScheduler({
  onUpdateSchedule,
  initialSchedule,
  validateArrayOfRangedNumbersOrAll,
  labelTexts,
  infoTexts,
  isDisabled = false
}) {
  const [minute, setMinute] = useState({
    value: initialSchedule?.minute?.join(','),
    validity: validateArrayOfRangedNumbersOrAll({
      ...FIELD_BOUNDARIES.minute,
      values: initialSchedule.minute
    })
  });
  const [hour, setHour] = useState({
    value: initialSchedule?.hour?.join(','),
    validity: validateArrayOfRangedNumbersOrAll({
      ...FIELD_BOUNDARIES.hour,
      values: initialSchedule.hour
    })
  });
  const [dayOfMonth, setDayOfMonth] = useState({
    value: initialSchedule?.dayOfMonth?.join(','),
    validity: validateArrayOfRangedNumbersOrAll({
      ...FIELD_BOUNDARIES.dayOfMonth,
      values: initialSchedule.dayOfMonth
    })
  });
  const [month, setMonth] = useState({
    value: initialSchedule?.month?.join(','),
    validity: validateArrayOfRangedNumbersOrAll({
      ...FIELD_BOUNDARIES.month,
      values: initialSchedule.month
    })
  });
  const [dayOfWeek, setDayOfWeek] = useState({
    value: initialSchedule?.dayOfWeek?.join(','),
    validity: validateArrayOfRangedNumbersOrAll({
      ...FIELD_BOUNDARIES.dayOfWeek,
      values: initialSchedule.dayOfWeek
    })
  });

  // Update the schedule upstream if no fields have validation errors
  useEffect(function () {
    const result = {
      newSchedule: {
        minute: stringToArrayOfNumbersOrAll(minute.validity?.validValues ?? minute.value),
        hour: stringToArrayOfNumbersOrAll(hour.validity?.validValues ?? hour.value),
        dayOfMonth: stringToArrayOfNumbersOrAll(dayOfMonth.validity?.validValues ?? dayOfMonth.value),
        month: stringToArrayOfNumbersOrAll(month.validity?.validValues ?? month.value),
        dayOfWeek: stringToArrayOfNumbersOrAll(dayOfWeek.validity?.validValues ?? dayOfWeek.value)
      },
      errors: [{
        ...minute.validity,
        field: 'minute'
      }, {
        ...hour.validity,
        field: 'hour'
      }, {
        ...dayOfMonth.validity,
        field: 'dayOfMonth'
      }, {
        ...month.validity,
        field: 'month'
      }, {
        ...dayOfWeek.validity,
        field: 'dayOfWeek'
      }].filter(item => item.type) // remove any fields without error
    };
    onUpdateSchedule(result);
  }, [minute, hour, dayOfMonth, month, dayOfWeek]);
  function handleFieldUpdate({
    value,
    min,
    max,
    setter
  }) {
    const values = value.split(',').filter(item => item);
    const validity = validateArrayOfRangedNumbersOrAll({
      min,
      max,
      values
    });
    setter({
      value,
      validity
    });
  }
  const INPUTS = [{
    id: 'minute',
    label: labelTexts.minute,
    boundaries: FIELD_BOUNDARIES.minute,
    stateValue: minute,
    stateSetter: setMinute,
    infoText: infoTexts.minute
  }, {
    id: 'hour',
    label: labelTexts.hour,
    boundaries: FIELD_BOUNDARIES.hour,
    stateValue: hour,
    stateSetter: setHour,
    infoText: infoTexts.hour
  }, {
    id: 'day-of-month',
    label: labelTexts.dayOfMonth,
    boundaries: FIELD_BOUNDARIES.dayOfMonth,
    stateValue: dayOfMonth,
    stateSetter: setDayOfMonth,
    infoText: infoTexts.dayOfMonth
  }, {
    id: 'month',
    label: labelTexts.month,
    boundaries: FIELD_BOUNDARIES.month,
    stateValue: month,
    stateSetter: setMonth,
    infoText: infoTexts.month
  }, {
    id: 'day-of-week',
    label: labelTexts.dayOfWeek,
    boundaries: FIELD_BOUNDARIES.dayOfWeek,
    stateValue: dayOfWeek,
    stateSetter: setDayOfWeek,
    infoText: infoTexts.dayOfWeek
  }];
  return /*#__PURE__*/_jsx("div", {
    className: "advanced-scheduler-form",
    "test-id": "advanced-scheduler",
    children: INPUTS.map(input => /*#__PURE__*/_jsx(Input, {
      id: input.id,
      name: input.id,
      "test-id": `${input.id}-input`,
      label: input.label,
      labelTestId: `${input.id}-label`,
      onChange: e => {
        handleFieldUpdate({
          ...input.boundaries,
          value: e.target.value,
          setter: input.stateSetter
        });
      },
      value: input.stateValue.value,
      validity: input.stateValue.validity,
      validationTestId: `${input.id}-validation`,
      isDisabled: isDisabled,
      ...(input.infoText ? {
        labelIcon: faCircleInfo,
        labelIconTooltipText: input.infoText,
        labelIconTestId: `${input.id}-label-info-icon`
      } : {})
    }, input.id))
  });
}