<DModalBody @title="admin.badges.badge_groupings.modal_title" @class="badge-groupings-modal">
  <div class="badge-groupings">
    <ul class="badge-groupings-list">
      {{#each this.workingCopy as |wc|}}
        <li class="badge-grouping-item">
          <div class="badge-grouping">
            {{#if wc.editing}}
              <Input @value={{wc.name}} class="badge-grouping-name-input" />
              <DButton @action={{action "save" wc}} @icon="check" />
            {{else}}
              <span>{{wc.displayName}}</span>
            {{/if}}
          </div>
          <div class="actions">
            <DButton @action={{action "edit" wc}} @disabled={{wc.system}} @icon="pencil-alt" />
            <DButton @action={{action "up" wc}} @icon="chevron-up" />
            <DButton @action={{action "down" wc}} @icon="chevron-down" />
            <DButton @action={{action "delete" wc}} @disabled={{wc.system}} @icon="times" />
          </div>
        </li>
      {{/each}}
    </ul>
  </div>
  <DButton @action={{action "add"}} @label="admin.badges.new" />
</DModalBody>

<div class="modal-footer">
  <DButton @action={{action "saveAll"}} @label="admin.badges.save" @class="btn-primary" @disabled={{this.submitDisabled}} />
  <DModalCancel @close={{route-action "closeModal"}} />
</div>