export const OVERLAY_SHOW = 'OVERLAY_SHOW';
export const overlayShow = () => ({
  type: OVERLAY_SHOW,
});

export const OVERLAY_HIDE = 'OVERLAY_HIDE';
export const overlayHide = () => ({
  type: OVERLAY_HIDE,
});

export const OVERLAY_HIDE_ALL = 'OVERLAY_HIDE_ALL';
export const overlayHideAll = () => ({
  type: OVERLAY_HIDE_ALL,
});

const INITIAL_STATE = {
  activeOverlays: [],
};

export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case OVERLAY_SHOW: {
      const id = state.activeOverlays.length;
      return {
        ...state,
        activeOverlays: [...state.activeOverlays, id],
      };
    }

    case OVERLAY_HIDE: {
      return {
        ...state,
        activeOverlays: state.activeOverlays.slice(0, -1),
      };
    }

    case OVERLAY_HIDE_ALL: {
      return {
        ...state,
        activeOverlays: [],
      };
    }

    default:
      return state;
  }
};
