import { handleDateAction } from "./DatepickerAction";
import { ON_SET_DATE, ON_SET_MONTH, ON_SET_YEAR } from './Datepicker.actionConstants'; //import { DateTimeWidgetPropTypes } from "../../Components.manifest";

import SkeletonThemeWrapper from "../../../customization-cornor/skeletonCustomization";
/*
function Datepicker(props){
    let {customComponent,hour,minute,noon,applyHook,date,month,year,monthNames,onSelectDate,selectMonth,selectYear,closePopupOnly,onSubmit,isDateTime}=props
    //let[isTimeView,setTimeView]=useState(isDateTime);
    let[tyear,tmonth,tdate,tsetYear,tsetMonth,tsetDate]=handleDateAction({date:date,month:month,year:year})
    //let [thour,tminute,tnoon,tsetHour,tsetMinute,tsetNoon]=handleTimeChange({hour:hour,minute:minute,noon:noon},applyHook)
    let prevMonth=(tmonth==0)?monthNames.length-1:tmonth-1,
    nextMonth=(tmonth==11)?0:tmonth+1
    let renderProps={
        //isTimeView,
        year:tyear,
        month:tmonth,
        date:tdate,
        // hour:thour,
        // minute:tminute,
        // noon:tnoon,
        // setHours:(e)=>tsetHour(e,ON_SET_HOUR),
        // setMinutes:(e)=>tsetMinute(e,ON_SET_MINUTE),
        // setNoon:(e)=>tsetNoon(e,ON_SET_NOON),
        selectYear:(e)=>{tsetYear(e,ON_SET_YEAR,selectYear(e))},
        selectMonth:(e)=>{tsetMonth(e,ON_SET_MONTH,selectMonth(e))},
        onSelectDate:(e)=>{
            (tsetDate(e,ON_SET_DATE),onSelectDate(e))
        },
        onPrev:(e)=>{
            if(tmonth==0){
                tsetMonth(monthNames.length-1,ON_SET_MONTH,selectMonth(prevMonth))
                tsetYear(tyear-1,ON_SET_YEAR,selectYear(tyear-1))
            }
            else{
                tsetMonth(tmonth-1,ON_SET_MONTH,selectMonth(prevMonth))
            }
        },
        onNext:(e)=>{
            if(tmonth==11){
                tsetMonth(0,ON_SET_MONTH,selectMonth(nextMonth))
                tsetYear(tyear+1,ON_SET_YEAR,selectYear(tyear+1))
            }
            else{
                tsetMonth(tmonth+1,ON_SET_MONTH,selectMonth(nextMonth))
            }
        },
        // onSubmit:(e)=>{
        //     tsetHour(thour,ON_SET_HOUR),
        //     tsetMinute(tminute,ON_SET_MINUTE),
        //     tsetNoon(tnoon,ON_SET_NOON),
        //     onSubmit(thour,tminute,tnoon)
        // },
        onClose:closePopupOnly,
        popupGroup:'Datetime'
    }
    return(
        CustomizeSkeleton(props,renderProps,DateTimeWidgetImplementation,customComponent)
    )
}

Datepicker.propTypes=DateTimeWidgetPropTypes()
Datepicker.docs={
    componentGroup:'DateTime',
    folderName:'DateWidget'
}
Datepicker.constants=datetimeConstants()
Datepicker.defaultProps={
    dayNames:dateFormat.dayNames,

}*/
//export default Datepicker

export default (props => {
  let {
    applyHook,
    date,
    month,
    year,
    monthNames,
    onSelectDate,
    selectMonth,
    selectYear,
    closePopupOnly
  } = props;
  let [tyear, tmonth, tdate, tsetYear, tsetMonth, tsetDate] = handleDateAction({
    date: date,
    month: month,
    year: year
  }, applyHook);
  let prevMonth = tmonth == 0 ? monthNames.length - 1 : tmonth - 1,
      nextMonth = tmonth == 11 ? 0 : tmonth + 1;
  let renderProps = {
    year: tyear,
    month: tmonth,
    date: tdate,
    selectYear: e => {
      tsetYear(e, ON_SET_YEAR, selectYear(e));
    },
    selectMonth: e => {
      tsetMonth(e, ON_SET_MONTH, selectMonth(e));
    },
    onSelectDate: val => {
      console.log(val);
      return tsetDate({
        date: val.date,
        month: val.month,
        year: val.year,
        day: val.day
      }, ON_SET_DATE), onSelectDate({
        date: val.date,
        month: val.month,
        year: val.year,
        day: val.day
      });
    },
    onPrev: e => {
      if (tmonth == 0) {
        tsetMonth(monthNames.length - 1, ON_SET_MONTH, selectMonth(prevMonth));
        tsetYear(tyear - 1, ON_SET_YEAR, selectYear(tyear - 1));
      } else {
        tsetMonth(tmonth - 1, ON_SET_MONTH, selectMonth(prevMonth));
      }
    },
    onNext: e => {
      if (tmonth == 11) {
        tsetMonth(0, ON_SET_MONTH, selectMonth(nextMonth));
        tsetYear(tyear + 1, ON_SET_YEAR, selectYear(tyear + 1));
      } else {
        tsetMonth(tmonth + 1, ON_SET_MONTH, selectMonth(nextMonth));
      }
    },
    onClose: closePopupOnly,
    popupGroup: 'Datetime'
  };
  let {
    renderComponent,
    ...basicProps
  } = props;
  return /*#__PURE__*/React.createElement(SkeletonThemeWrapper, {
    basicProps: basicProps,
    renderProps: renderProps,
    component: renderComponent
  });
});