import { useEffect, useState } from 'react'
import { DateRange, Matcher } from 'react-day-picker'
import { compareAsc, endOfDay, format, isAfter, parseISO } from 'date-fns'
import {
  DisableCalendarDates,
  RangeContext,
} from 'src/core/components/calendar/CalendarTypes'

type Props = {
  onSubmit: (val: any) => void
  setToggleCalendar: (val: boolean) => void
  noActiveSelection?: boolean
  toggleCalendar?: boolean
  outerRangeContext?: RangeContext
  outerDisableCalendarDates?: DisableCalendarDates
}

export const useFilterCalendar = ({
  onSubmit,
  setToggleCalendar,
  noActiveSelection,
  toggleCalendar,
  outerRangeContext,
  outerDisableCalendarDates,
}: Props) => {
  // State
  const [calendarRange, setCalendarRange] = useState<DateRange | undefined>()
  const [rangeContext, setRangeContext] = useState<RangeContext | undefined>(
    outerRangeContext
  )
  const [initialCalendarRange, setInitialCalendarRange] = useState<
    DateRange | undefined
  >()
  const [disabledDates, setDisabledDates] = useState<Matcher[]>([])
  const [updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation] =
    useState<boolean>(false)
  const [updateCalendarDefaultMonth, setUpdateCalendarDefaultMonth] =
    useState<number>(0)

  const [calendarHasError, setCalendarHasError] = useState<boolean>(false)

  const [updatedForSubmit, setUpdatedForSubmit] = useState<boolean>(false)
  const [disableCalendarDates, setDisableCalendarDates] =
    useState<DisableCalendarDates>()

  // Lifecycle

  // Handle update component with new data
  useEffect(() => {
    if (outerDisableCalendarDates?.availableDates) {
      setDisableCalendarDates({
        availableDates: [
          ...outerDisableCalendarDates.availableDates.sort((a, b) =>
            compareAsc(a.checkIn, b.checkIn)
          ),
        ],
        disabledDates: outerDisableCalendarDates.disabledDates
          ? [
              ...outerDisableCalendarDates.disabledDates.sort((a, b) =>
                compareAsc(a.from, b.from)
              ),
            ]
          : [],
      })
    }

    if (disabledDates && !!outerDisableCalendarDates?.disabledDates?.length) {
      setDisabledDates({
        ...disabledDates,
        ...outerDisableCalendarDates.disabledDates,
      })
    }
  }, [outerDisableCalendarDates])

  // Handle Range Context initial selections
  useEffect(() => {
    if (typeof window === 'undefined') return

    const urlSearchParams = new URLSearchParams(window.location.search)

    const startDateParam = urlSearchParams.get('startDate')
    const endDateParam = urlSearchParams.get('endDate')

    if (startDateParam && endDateParam) {
      if (noActiveSelection) {
        handleClearDates()
        setUpdateCalendarDefaultMonth((prev) => prev + 1)
        setUpdatedForSubmit(false)
        setRangeContext(outerRangeContext)
        setInitialCalendarRange({
          from: new Date(startDateParam),
          to: new Date(endDateParam),
        })
        setCalendarRange({
          from: new Date(startDateParam),
          to: new Date(endDateParam),
        })
      } else {
        setCalendarRange({
          from: new Date(startDateParam),
          to: new Date(endDateParam),
        })
      }
    }
  }, [toggleCalendar])

  // Handle submit dates
  useEffect(() => {
    const formatString = 'dd.MM.yyyy'
    const initialRangeTo = initialCalendarRange?.to
      ? format(initialCalendarRange.to, formatString)
      : null
    const initialRangeFrom = initialCalendarRange?.from
      ? format(initialCalendarRange.from, formatString)
      : null
    const calendarRangeTo = calendarRange?.to
      ? format(calendarRange.to, formatString)
      : null
    const calendarRangeFrom = calendarRange?.from
      ? format(calendarRange.from, formatString)
      : null

    if (!!(calendarRangeTo && calendarRangeFrom && updatedForSubmit)) {
      if (
        !!(calendarRangeTo !== initialRangeTo) ||
        !!(calendarRangeFrom !== initialRangeFrom)
      ) {
        handleSubmit()
      } else {
        setToggleCalendar(false)
      }
    }
  }, [calendarRange])

  // Methods
  const handleSubmit = () => {
    setToggleCalendar(false)
    return onSubmit(calendarRange)
  }

  const handleClearDates = () => {
    setDisabledDates([])
    setCalendarRange(undefined)
    setCalendarHasError(false)
    setInitialCalendarRange(undefined)
  }

  return {
    handleSubmit,
    handleClearDates,
    setCalendarRange,
    setUpdateCalendarMonthNavigation,
    calendarRange,
    disabledDates,
    updateCalendarMonthNavigation,
    updateCalendarDefaultMonth,
    calendarHasError,
    setCalendarHasError,
    setUpdatedForSubmit,
    rangeContext,
    disableCalendarDates,
  }
}