Concrete implementation of MVP with “dumb” view

  softwareengineering

I recently started designing my first MVP-app. I like the idea of having a “dumb” view to be able to cover as much of the code with unit tests.

The app I build will be an app to create offers (besides other functionality). So the UI shold have a list of positions (with prices) and these positions can be part of a category (a category shows the price of all it’s positions). The positions should be able to change their location inside their category, so I need an ID which holds the place of the positions and categories.

My questions

  • What is your opinion on this implementation of MVP? Are there any problems I don’t see yet?
  • Is this the idea of a “dumb view” or does it make sense to make it
    even more “dumb”? I could also pass the value of the dropdown
    box to the presenter and then save it there instead of handling this
    in the view.

Code and Example

An example of the list:

/button and dropdown menu to add position or category (there may be positions outside a category)

Cat. Materials (total price 200.-) /button to add position

  • position A 100.- /button to add other position
  • position B 100.- /button to add other position

Cat. Work done (total price 400.-) /same buttons as in cat. before

  • position C 100.-
  • position C 300.-

total price: 600.-

Here is the P and V code to add a position or category (it’s in JS. The code does not work, it’s just to get an idea of how this could be implemented):

View:

init(presenter){
    this._presenter = presenter;
   //all add-buttons call the same method
    addButton.addEventListener("click", this._onClickAddCatOrPosition.bind(this));
}

_onClickAddCatOrPosition(){
    switch(dropdownMenu.type){
        case "position":
            this._presenter.addPosition(idOfPrevItem, parentId, name, this.addPositionAt.bind(this));
            break;
        case "category":
            this._presenter.addCategory(idOfPrevItem, parentId,name, this.addCategoryAt.bind(this));
            break;
    }
}

addPositionAt(name, id, idOfPrevItem, parentId){
    //add new position after idOfPrevItem and save it's parentId and id
}

addCategoryAt(name, id, idOfPrevItem, parentId){}

Presenter:

addPosition(idOfPrevItem, parentId, name, onAdded){
    let newId = this._modelMain.addPositionAt(idOfPrevItem, parentId, name);

    onAdded(name, newId, idOfPrevItem, parentId);
}

addCategory(idOfPrevItem, parentId, name, onAdded){
    let newId = this._modelMain.addCategoryAt(idOfPrevItem, parentId, name);

    onAdded(name, newId, idOfPrevItem, parentId);
}

New contributor

Ennio is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.

LEAVE A COMMENT