Compare different organization

manageVariationList.js

/*
Background:
We have a component with two buttons, one button for adding a new empty fee variation, another for duplicating an existing fee variation.

for example:

button(click='uiModel.addVariation()') Add New
button(click='uiModel.duplicateVariation(seed)') Duplicate

There are four different implementations:

1. v1 original
2. v2a complete separation
3. v2a-alt complete separation with extraction
4. v2b merged
*/

// v1 original
const uiModel = {
  addVariation(duplicatedVariationModel = null) {
    var newEntry = duplicatedVariationModel || new FeeVariationModel({
      context: this
    })
    this.variations.push(newEntry)
    this.formValidator.setDirty()
  },

  duplicateVariation(variationModel) {
    const duplicatedVariationModel = new FeeVariationModel({
      data: variationModel.clone(),
      context: this
    })

    this.addVariation(duplicatedVariationModel)
    this.formValidator.setDirty()
  }
}

// v2a complete separation
const uiModel = {
  addVariation() {
    var newEntry = new FeeVariationModel({
      context: this
    })
    this.variations.push(newEntry)
    this.formValidator.setDirty()
  },

  duplicateVariation(variationModel) {
    const duplicatedVariationModel = new FeeVariationModel({
      data: variationModel.clone(),
      context: this
    })
    this.variations.push(duplicatedVariationModel)
    this.formValidator.setDirty()
  }
}

// v2a-alt complete separation with extraction
const uiModel = {
  add(model) { // this feels awkward, so have logic specific function to be on the same domain as the rest of ui action functions.
    this.variations.push(newEntry)
    this.formValidator.setDirty()
  },
  
  createVariation() {
    var newEntry = new FeeVariationModel({
      context: this
    })
    this.add(newEntry)
  },

  duplicateVariation(variationModel) {
    const duplicatedVariationModel = new FeeVariationModel({
      data: variationModel.clone(),
      context: this
    })
    this.add(duplicatedVariationModel)
  }
}

// v2b merged
const uiModel = {
  addVariation(seed = null) {
    const newEntry = new FeeVariationModel({
      data: isDefined(seed) ? seed.clone() : null,
      context: this
    })
    this.variations.push(newEntry)
    this.formValidator.setDirty()
  }
}