import React, { useReducer } from 'react'

export const AppContext = React.createContext()

export const ACTIONS = {
  SET_MULTIPLE_DAYS: 'setMultipleDays',
  SET_DATE: 'setDate',
  SET_FOCUSED_INPUT: 'setFocusedInput',
  SET_PICKUP_TIME: 'setPickupTime',
  SET_DROPOFF_TIME: 'setDropoffTime',
}

function reducer(state, action) {
  switch (action.type) {
    case ACTIONS.SET_MULTIPLE_DAYS:
      return {
        ...state,
        multipleDays: action.payload,
        focusedInput: undefined,
        startDate: undefined,
        endDate: undefined,
      }
    case ACTIONS.SET_DATE:
      return {
        ...state,
        startDate: action.payload.startDate,
        endDate: action.payload.endDate,
      }
    case ACTIONS.SET_FOCUSED_INPUT:
      return { ...state, focusedInput: action.payload }
    case ACTIONS.SET_PICKUP_TIME:
      return { ...state, pickupTime: action.payload }
    case ACTIONS.SET_DROPOFF_TIME:
      return { ...state, dropoffTime: action.payload }
    default:
      throw new Error(`Unkown Action type ${action.type}`)
  }
}

function debugReducer(state, action) {
  console.debug('applying action', action)
  const newState = reducer(state, action)
  console.debug(newState)
  return newState
}

const initialState = {
  multipleDays: null,
  bookedOn: [
    '2020-07-10',
    '2020-07-11',
    '2020-07-12',
    '2020-07-23',
    '2020-08-01',
  ],
}

export default function AppStore({ children }) {
  const [state, dispatch] = useReducer(debugReducer, initialState)

  return (
    <AppContext.Provider value={{ state, dispatch }}>
      {children}
    </AppContext.Provider>
  )
}