import { getType } from 'typesafe-actions'; import { Step, StepsModalState } from '../../types/steps-modal'; import { UI } from '../../types/ui'; import * as actions from '../actions'; import { RootAction } from '../reducers'; const initialStepsModalState: StepsModalState = { doneSteps: [], currentStep: null, pendingSteps: [], }; const initialState: UI = { stepsModal: initialStepsModalState } export function stepsModal(state: StepsModalState = initialStepsModalState, action: RootAction): StepsModalState { switch (action.type) { case getType(actions.setStepsModalDoneSteps): return { ...state, doneSteps: action.payload }; case getType(actions.setStepsModalPendingSteps): return { ...state, pendingSteps: action.payload }; case getType(actions.setStepsModalCurrentStep): return { ...state, currentStep: action.payload }; case getType(actions.stepsModalAdvanceStep): const { doneSteps, currentStep, pendingSteps } = state; // This first condition may happen in async scenarios if (currentStep === null && pendingSteps.length === 0) { return state; } else if (pendingSteps.length === 0 && currentStep !== null) { return { ...state, doneSteps: doneSteps.concat([currentStep as Step]), currentStep: null, }; } else { return { ...state, pendingSteps: pendingSteps.slice(1), doneSteps: doneSteps.concat([currentStep as Step]), currentStep: pendingSteps[0] as Step, }; } case getType(actions.stepsModalReset): return initialStepsModalState; default: return state; } } export default function uiReducer(state: UI = initialState, action: RootAction): UI { switch (action.type) { default: return { ...state, stepsModal: stepsModal(state.stepsModal, action), }; } }