export const TAG_TEMPLATE = `
<confirmation-dialog #confirmationDialog (confirmAction)="confirmDeletion($event)"></confirmation-dialog>
<clr-modal [(clrModalOpen)]="showTagManifestOpened" [clrModalStaticBackdrop]="staticBackdrop" [clrModalClosable]="closable">
  <h3 class="modal-title">{{ manifestInfoTitle | translate }}</h3>
  <div class="modal-body">
    <div class="row col-md-12">
        <textarea rows="3" (click)="selectAndCopy($event)">{{tagID}}</textarea>
    </div>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-primary" (click)="showTagManifestOpened = false">{{'BUTTON.OK' | translate}}</button>
  </div>
</clr-modal>
<h2 class="sub-header-title">{{repoName}}</h2>
<clr-datagrid>
    <clr-dg-column>{{'REPOSITORY.TAG' | translate}}</clr-dg-column>
    <clr-dg-column>{{'REPOSITORY.PULL_COMMAND' | translate}}</clr-dg-column>
    <clr-dg-column *ngIf="withNotary">{{'REPOSITORY.SIGNED' | translate}}</clr-dg-column>
    <clr-dg-column>{{'REPOSITORY.AUTHOR' | translate}}</clr-dg-column>
    <clr-dg-column>{{'REPOSITORY.CREATED' | translate}}</clr-dg-column>
    <clr-dg-column>{{'REPOSITORY.DOCKER_VERSION' | translate}}</clr-dg-column>
    <clr-dg-column>{{'REPOSITORY.ARCHITECTURE' | translate}}</clr-dg-column>
    <clr-dg-column>{{'REPOSITORY.OS' | translate}}</clr-dg-column>
    <clr-dg-row *clrDgItems="let t of tags" [clrDgItem]='t'>
      <clr-dg-action-overflow>
        <button class="action-item" (click)="showTagID('tag', t)">{{'REPOSITORY.COPY_ID' | translate}}</button>
        <button class="action-item" (click)="showTagID('parent', t)">{{'REPOSITORY.COPY_PARENT_ID' | translate}}</button>
        <button class="action-item" [hidden]="!hasProjectAdminRole" (click)="deleteTag(t)">{{'REPOSITORY.DELETE' | translate}}</button>
      </clr-dg-action-overflow>
      <clr-dg-cell>{{t.tag}}</clr-dg-cell>
      <clr-dg-cell>{{t.pullCommand}}</clr-dg-cell>
      <clr-dg-cell *ngIf="withNotary"  [ngSwitch]="t.signed">
        <clr-icon shape="check" *ngSwitchCase="1" style="color: #1D5100;"></clr-icon>
        <clr-icon shape="close" *ngSwitchCase="0" style="color: #C92100;"></clr-icon>
        <a href="javascript:void(0)" *ngSwitchDefault role="tooltip" aria-haspopup="true" class="tooltip tooltip-top-right">
          <clr-icon shape="help" style="color: #565656;" size="16"></clr-icon>
          <span class="tooltip-content">{{'REPOSITORY.NOTARY_IS_UNDETERMINED' | translate}}</span>
        </a>
      </clr-dg-cell>
      <clr-dg-cell>{{t.author}}</clr-dg-cell>
      <clr-dg-cell>{{t.created}}</clr-dg-cell>
      <clr-dg-cell>{{t.dockerVersion}}</clr-dg-cell>
      <clr-dg-cell>{{t.architecture}}</clr-dg-cell>
      <clr-dg-cell>{{t.os}}</clr-dg-cell>
    </clr-dg-row>
    <clr-dg-footer>{{tags ? tags.length : 0}} {{'REPOSITORY.ITEMS' | translate}}</clr-dg-footer>
</clr-datagrid>`;