<div class="course-objective-list-item-parents grid-item" data-test-objective-list-item-parents>
  {{#if @isManaging}}
    <button
      type="button"
      class="bigadd"
      {{on "click" @save}}
      disabled={{@isSaving}}
      aria-label={{t "general.save"}}
      data-test-save
    >
      {{#if @isSaving}}
        <FaIcon @icon="spinner" @spin={{true}} />
      {{else}}
        <FaIcon @icon="check" />
      {{/if}}
    </button>
    <button
      type="button"
      class="bigcancel"
      {{on "click" @cancel}}
      aria-label={{t "general.cancel"}}
      data-test-cancel
    >
      <FaIcon @icon="arrow-rotate-left" />
    </button>
  {{else}}
    <ul>
      {{#each (sort-by "title" @parents) as |parent|}}
        {{#if @editable}}
          <li data-test-parent>
            <button
              type="button"
              class="link-button"
              {{on "click" @manage}}
              data-test-manage
              >
                {{html-safe (remove-html-tags parent.title)}}
            </button>
          </li>
        {{else}}
          <li data-test-parent>
            {{html-safe (remove-html-tags parent.title)}}
          </li>
        {{/if}}
      {{else}}
        <li>
          {{#if @editable}}
            <button type="button" {{on "click" @manage}} data-test-manage>
              {{t "general.addNew"}}
            </button>
          {{else}}
            {{t "general.none"}}
          {{/if}}
        </li>
      {{/each}}
    </ul>
  {{/if}}
</div>
