{{! template-lint-disable triple-curlies }}
<td>
  {{#if canAppealTrack}}
    <div class="checkmark {{unless track.reasonForAppealing 'inactive'}}"></div>
  {{/if}}
</td>

<td>
  <span class="title">{{track.title}}</span>
  <span class="artist sub-text">{{track.performer}}</span>
</td>

<td>
  <p>{{offsetFormatted}}</p>
</td>
<td>
  <p class="appeal-status">{{{track.track_appeal.status}}}</p>
</td>
<td>
  {{#if canAppealTrack}}
    {{!-- if reason has not been selected yet --}}
    {{#unless track.reasonForAppealing}}
      <a {{action "toggleIsSelectingReason"}} class="button drop">{{{selectedReason}}}</a>
    {{/unless}}

    {{!-- if reason has been selected before appeal --}}
    {{#if track.reasonForAppealing}}
      <p class="selected-reason">{{track.reasonForAppealing.description}}</p>
      <a {{action "clearReasonSelector"}} class="clear-reason {{unless track.reasonForAppealing 'hidden'}}">{{partial 'svg/close'}}</a>
    {{/if}}
    {{#if isSelectingReason}}
      {{video/appeals/reason-selector selectReason="selectReason" stopSelectingReason="stopSelectingReason"}}
    {{/if}}
  {{else}}
    {{selectedReason}}
  {{/if}}
</td>
