Hierarchical models with Choo

child-model.js

// Note: Child model is NOT registered with choo.model()
const model = {

    state: {
    	name:	 '',
    	x:	 0,
    	y:	 0,
    	width:	 0,
    	height:	 0,
    },
    
    reducers: {

    	resizeNode: (data, state) => {
    	    // ...
    	    return { ...state, width: w, height: h };
    	}

    }
}

export default (name, x, y) => { return { ...model, state: { ... model.state, name, x, y } } }

parent-model.js

import newTask from 'models/task'

export default {
    namespace: 'project',
    state: {
	  tasks: [
	    newTask('task', 100, 100),
	    newTask('task', 250, 100),
  	]},
    reducers: {
    	addTask: (data, state) => {
    	    ///...
    	    state.tasks.push(newTask(name, x, y))
    	    return state;
    	},
    
    	reduceAtTask: (data, state) => {
    	    let task = state.tasks[data.index];
    	    let reducer = task.reducers[data.reducer];
    	    let index = data.index;
    
    	    delete data.reducer;
    	    delete data.index;
    
    	    let newState = reducer(data, task.state);
    	    let tasks = state.tasks.slice();
    	    tasks[index].state = newState;
    	    return { ...state, tasks };
    	}
    }
}

wathes*