<my-table
  #table
  key="FollowersListComponent"
  [defaultColumns]="columns"
  i18n-paginatorText
  paginatorText="followers per page"
  [dataLoader]="dataLoader"
  columnConfig="false"
  [bulkActions]="bulkActions"
  >
  <ng-template #totalTitle let-totalRecords>
    <ng-container i18n>{ totalRecords, plural, =0 {No follower} =1 {1 follower} other {{{ totalRecords | myNumberFormatter }} followers}}</ng-container>
  </ng-template>

  <ng-template #captionRight>
    <my-advanced-input-filter [filters]="searchFilters" (search)="table.onSearch($event)"></my-advanced-input-filter>
  </ng-template>

  <ng-template #tableCells let-follow>
    <td>
      <a [href]="follow.follower.url" i18n-title title="Open actor page in a new tab" target="_blank" rel="noopener noreferrer">
        {{ buildFollowerName(follow) }}
        <my-global-icon iconName="external-link"></my-global-icon>
      </a>
    </td>

    <td>
      @if (follow.state === 'accepted') {
        <span class="pt-badge badge-green" i18n>Accepted</span>
      } @else if (follow.state === 'pending') {
        <span class="pt-badge badge-yellow" i18n>Pending</span>
      } @else if (follow.state === 'rejected') {
        <span class="pt-badge badge-red" i18n>Rejected</span>
      }
    </td>

    <td>{{ follow.score / 10000 * 100 }}%</td>
    <td>{{ follow.createdAt | ptDate: 'short' }}</td>
  </ng-template>

  <ng-template #actionCell let-follow>
    @if (follow.state !== 'accepted') {
      <my-button i18n-title title="Accept" icon="tick" (click)="acceptFollower([ follow ])"></my-button>
    }
    @if (follow.state !== 'rejected') {
      <my-button i18n-title title="Reject" icon="cross" (click)="rejectFollower([ follow ])"></my-button>
    }

    @if (follow.state === 'rejected') {
      <my-delete-button (click)="deleteFollowers([ follow ])"></my-delete-button>
    }
  </ng-template>

  <ng-template #noResults let-search>
    @if (search) {
      <ng-container i18n>No follower found matching current filters.</ng-container>
    } @else {
      <ng-container i18n>Your instance doesn't have any follower.</ng-container>
    }
  </ng-template>
</my-table>

