compose chain-able

[danielkcz]

With TypeScript I've run into a current limitation of compose function being defined with 2 additional models only. I definitely would like to compose more models together as it supports separation of concerns and easier testability.

I don't think that proper solution here is to keep adding overloads when someone needs more. What I want to suggest is basically expose cloneAndEnhance function on the model (probably renamed to something else) and accepting a single model type only. That will remove the problematic limitation with Typescript and allow for more robust composition approach.

[danielkcz]

I don't see how that's related to the issue at hand :) What I want to simply do is types.compose(Model1, Model2, Model3 ... ModelN). The named is just for ... well naming models, it has nothing to do with an actual composition or is I missing something here?

There is also mention of union method which could serve to this needs, but that kinda suffers with a similar problem, there are overloads for 10 models at max.

[robinfehr]

yes sorry - misread your question in the beginning :)

you're looking for something like this right? i guess that'd be quite doable. @mweststrate @mattiamanzati

const TestModel = types.model('Test', { testProperty: types.string })
const AnotherModel = types.model('Another', { someProp: types.string })
const ComposedModel = TestModel.compose('Composed', AnotherModel).compose(...

[robinfehr]

on the todo list now.

[coolsoftwaretyler]

Looks like this was completed at some point but never closed out. Works great here: https://codesandbox.io/p/sandbox/651-composed-types-lysw59?file=%2Fsrc%2Findex.ts%3A9%2C21

import { t } from "mobx-state-tree";

const TypeA = t.model("A", { propa: "here" });
const TypeB = t.model("B", { propb: "here" });
const TypeC = t.model("C", { propc: "here" });
const TypeD = t.model("D", { propd: "here" });
const TypeE = t.model("E", { prope: "here" });

const Composition = t.compose(TypeA, TypeB, TypeC, TypeD, TypeE);

const result = Composition.create();

console.log(result);