trying to understand reducers for Redux in an Angular 4 app

A file full of reducers like so:

import { YinAction, YangAction } from './yin-yang.actions';
import { BigPictureModel } from '../whatever/big-picture.model';
 
const myState = new BigPictureModel();
type actiony = YinAction | YangAction;
 
export function myReducer(stuff: BigPictureModel = initialState, action: actiony): BigPictureModel {
   switch (action.type) {
      case "yinUpdate":
         const initialState = <YinAction>actiony;
         return {
            ...initialState,
            status: "lucky"
         };
      case "yangUpdate":
         const initialState = <YangAction>actiony;
         return {
            ...initialState,
            activeStep: 13
         };
      default:
         return state;
   }
}

 
 

... has sister file full of actions. yin-yang.actions.ts is gonna look something like this:

import { Action } from '@ngrx/store';
import { BigPictureModel } from '../whatever/big-picture.model';
 
export class YinAction implements Action {
   readonly type: string = "yinUpdate";
   constructor(public status: PlanStatusModel) { }
}
 
export class YangAction implements Action {
   readonly type: string = "yangUpdate";
   constructor(public activeStep: number) { }
}

 
 

I don't really understand this stuff yet. An example of a case with a map and a spread operator might be:

case "yangUpdate":
   const initialState = <YangAction>actiony;
   return {
      ...initialState,
      data: state.answers.map((datum: MyDataPoint) => {
         return (initialState.dataIds.find(d => datum.Id === d))
            ? {
               ...datum,
               finePoint: initialState.somethingErOther
            }
            : datum;
      })
   };