Feature as controller

[pjasiun]

tl;dr: UI MVC is overcomplicated. It should be possible to create the whole code of the controller inside the feature.

Here is my use case:

I was writing a feature which takes a collection of users and displays the content of it (assume that I already have a User and Users model classes). I did not want to make it reusable.

I created UsersFeature, UsersView, UserView, UsersController and UsersController and had a feeling that it's overengineered. Also, all my controllers do is:

export default class User extends Controller {
    constructor( model, view ) {
        super( model, view );

        view.bind( 'name' ).to( model );
    }
}

And:

export default class Users extends Controller {
    constructor( model, view ) {
        super( model, view );

        this.addCollection( 'users' );
    }
}

Also, I realized that there are many such controllers in the code (both in my project and in the UI default lib).

I understand that in the UI default lib which contains reusable component it makes sense to create such structures, but in my case it was useless.

Moreover, I understand the controller as a piece of the code which binds model and view, handles the initialization and the data transformation between the model and the view.
According to this definition, It is not a real controller, because the whole code which was handling initialization and binding model with the view was in the feature.

Then, @Reinmar told me that I can avoid creating these classes controller by creating Controller class and do it this way:

const usersCotroller = new Controller( usersModel, usersView );
usersCotroller.addCollection( 'users' );

usersCotroller.collections.get( 'users' ).bind( usersModel ).as( ( userModel ) => {
    const userView = new UserView( locale );
    userView.bind( 'name' ).to( user );
    return new Controller( userModel, userView );
} );

Still, I see 2 problems here:

• I need to create instances of Controller without the clear understanding what it does,
• I need to add a collection to the first controller (usersModel has a collection of userModels and usersView has a collection of userViews, why I need add to the usersController collection of userControllers?).

I would like to write in the UsersFeature, which is a real controller, code which binds model and view without a need of creating additional Controllers. bind could be a method of the collection and I should be able to do:

usersView.users.bind( usersModel ).as( ( userModel ) => {
    const userView = new UserView( locale );
    userView.bind( 'name' ).to( user );
    return userView;
} );

As I learned the idea behind controllers was that they will handle destruction chain and prevent memory leaks. The problem is, that in this case, they are the reason for the memory leak. Before writing this post I did not realize that I have to store usersCotroller as a private property and call usersCotroller.destroy() in the feature destroy() function.

[pjasiun]

In fact, thinking about it in the more generic way, my point is that Controller should be a Controller which helps you creating a controller, not the only Controller you need to use to bind view and model. Part of its functionality should be moved as tools which you can use separately. The same way that there is a Model class you can use as a base of your class, but any class which mix Obseravbles or even fire proper events can be a model.

[Reinmar]

Fixed by ckeditor/ckeditor5-ui#95.