redux.ts

function rootReducer(state, action) {
	return {
		part1: part1Reducer(state.part1, action),
		part2: part2Reducer(state.part2, action)
	}
}

function part1Reducer(state, action) {
	return {
		part1A: part1AReducer(state.A, action),
		part1B: part1BReducer(state.B, action)
	}
}

function part1AReducer(state, action) {
	return 'bar';
}

function part1BReducer(state, action) {
	return 'baz'
}

function part2Reducer(state, action) {
	return 'foo';
}


const state = {};
const action = {type: 'my action'};

const next = rootReducer(state, action);

` result looks like:
{
	part1: {
		part1A: 'bar',
		part1B: 'baz'
	},
	part2: 'foo'	
}
`

// rootReducer knows about part1, part2
// part1 knows about part1A, part1B
// this is a "top down" architecture