<c8y-title>{{ 'Localization' | translate }}</c8y-title>

@if (isLoading) {
  <c8y-loading></c8y-loading>
} @else {
  <c8y-action-bar-item placement="right">
    <button
      class="btn btn-link"
      (click)="addEntry()"
      data-cy="c8y-translation-editor--add-translation"
    >
      <i c8yIcon="plus-circle"></i>
      <span translate>Add translation</span>
    </button>
  </c8y-action-bar-item>

  <c8y-action-bar-item placement="right">
    <button
      class="btn btn-link"
      (click)="saveTranslations()"
      data-cy="c8y-translation-editor--save-and-apply"
    >
      <i c8yIcon="save"></i>
      <span translate>Save and apply</span>
    </button>
  </c8y-action-bar-item>

  <c8y-help src="/docs/standard-tenant/changing-settings/#localization"></c8y-help>

  <c8y-data-grid
    class="content-fullpage d-flex d-col"
    [title]="'Translations' | translate"
    [columns]="columns"
    [actionControls]="actionControls"
    [pagination]="pagination"
    [displayOptions]="displayOptions"
    (onReload)="refresh()"
    [rows]="items"
  ></c8y-data-grid>
}