action-details-template.hbs

// app/components/action-details/template.hbs

<h5>Change action status</h5>
{{#sc-select
  options=STATUSES
  selected=model.status
  onChange=(action "setStatus") as |status|}}
  {{status.label}}
{{/sc-select}}

action-model-after.js

// app/models/action.js

import Model from 'ember-data/model';
import attr from 'ember-data/attr';
export default Model.extend({
  label: attr('string'),
  status: attr('action-status') // before it was attr('number')
});

action-status-transform.js

// app/transforms/action-status.js

import Transform from 'ember-data/transform';
import { STATUSES } from '../constants/actions';
export default Transform.extend({
  deserialize(serialized) {
    return STATUSES.findBy('value', serialized);
  },
  serialize(deserialized = {}) {
    return deserialized.value;
  }
});

actions-constants-0.js

// app/constants/actions.js

const STATUS_TO_DO = { value: 0 };
const STATUS_IN_PROGRESS = { value: 10 };
const STATUS_DONE = { value: 50 };
const STATUS_CANT_DO = { value: 60 };
const STATUS_OVERDUE = { value: -1 };
const STATUSES = [STATUS_TO_DO, STATUS_IN_PROGRESS, STATUS_DONE, STATUS_CANT_DO];

export {
  STATUS_TO_DO, STATUS_IN_PROGRESS, STATUS_DONE, STATUS_CANT_DO, STATUS_OVERDUE, STATUSES
}

actions-constants-1.js

// app/constants/actions.js

const STATUS_TO_DO = { value: 0, label: 'To Do' };
const STATUS_IN_PROGRESS = { value: 10, label: 'In Progress' };
const STATUS_DONE = { value: 50, label: 'Done' };
const STATUS_CANT_DO = { value: 60, label: 'Can\'t Do' };
const STATUS_OVERDUE = { value: -1, label: 'Overdue' };

...

js-before.js

// app/componets/action-details/component.js

setStatus(newStatus) {
  const model = get(this, 'model');
  
  if ([0, 10].includes(get(model, 'status')) && [50, 60].includes(newStatus)) {
    set(model, 'completedAt', new Date());
  }
  
  set(model, 'status', newStatus);
  
  model.save();
}

template-after.hbs

{{#if (eq model.status STATUS_TO_DO)}}
  {{#sc-button onClick=(action "startAction")}}Mark As In Progress{{/sc-button}}
{{else if (eq model.status STATUS_IN_PROGRESS)}}
  {{#sc-button onClick=(action "setStatus" STATUS_DONE)}}Mark As Done{{/sc-button}}
{{/if}}

template-before.hbs

{{#if (eq model.status 0)}}
  {{#sc-button onClick=(action "startAction")}}Mark As In Progress{{/sc-button}}
{{else if (eq model.status 10)}}
  {{#sc-button onClick=(action "setStatus" 50)}}Mark As Done{{/sc-button}}
{{/if}}