git.apps.os.sepia.ceph.com Git - ceph-ci.git/blob

   1 <ng-container *ngIf="!dropDownOnly; else dropDownOnlyTpl">
   2   <button *ngIf="currentAction"
   3           type="button"
   4           [cdsButton]="currentAction.buttonKind"
   5           title="{{ useDisableDesc(currentAction) }}"
   6           (click)="useClickAction(currentAction)"
   7           [disabled]="disableSelectionAction(currentAction)"
   8           [routerLink]="useRouterLink(currentAction)"
   9           [attr.aria-label]="currentAction.name"
  10           [preserveFragment]="currentAction.preserveFragment ? '' : null"
  11           data-testid="primary-action">
  12     <span i18n>{{ currentAction.name }}</span>
  13     <svg class="cds--btn__icon"
  14          cdsIcon="add"
  15          size="16"></svg>
  16   </button>
  17   <ng-container *ngIf="primaryDropDown">
  18     <button class="primary-dropdown-btn"
  19             [attr.aria-label]="dropDownOnly"
  20             [offset]="{ x: -210, y: 65 }"
  21             [cdsOverflowMenu]="overflowMenuTpl"
  22             data-testid="table-action-btn">
  23       <svg class="cds--btn__icon"
  24            cdsIcon="caret--down"
  25            size="16"></svg>
  26     </button>
  27     <ng-template #overflowMenuTpl>
  28       <ng-container *ngFor="let action of dropDownActions">
  29         <cds-overflow-menu-option *ngIf="currentAction !== action"
  30                                   class="{{ toClassName(action) }}"
  31                                   title="{{ useDisableDesc(action) }}"
  32                                   (click)="useClickAction(action)"
  33                                   [routerLink]="useRouterLink(action)"
  34                                   [preserveFragment]="action.preserveFragment ? '' : null"
  35                                   [disabled]="disableSelectionAction(action)"
  36                                   [attr.aria-label]="action.name"
  37                                   data-testid="table-action-option-btn"
  38                                   i18n>
  39         {{ action.name }}
  40         </cds-overflow-menu-option>
  41       </ng-container>
  42     </ng-template>
  43   </ng-container>
  44 </ng-container>
  45
  46 <ng-template #caret>
  47   <button [cdsButton]="currentAction.buttonKind"
  48           class="caret-btn">
  49     <svg class="cds--btn__icon"
  50          cdsIcon="caret--down"
  51          size="16"></svg>
  52   </button>
  53 </ng-template>
  54
  55 <ng-template #dropDownOnlyTpl>
  56   <cds-overflow-menu [customTrigger]="customTrigger"
  57                      [flip]="true"
  58                      [offset]="{ x: 105, y: 0 }"
  59                      data-testid="table-action-btn"
  60                      class="d-flex justify-content-end">
  61     <ng-container *ngFor="let action of dropDownActions">
  62       <cds-overflow-menu-option *ngIf="currentAction !== action"
  63                                 class="{{ toClassName(action) }}"
  64                                 title="{{ useDisableDesc(action) }}"
  65                                 (click)="useClickAction(action)"
  66                                 [routerLink]="useRouterLink(action)"
  67                                 [preserveFragment]="action.preserveFragment ? '' : null"
  68                                 [disabled]="disableSelectionAction(action)"
  69                                 [attr.aria-label]="action.name"
  70                                 data-testid="table-action-option-btn"
  71                                 i18n>
  72       {{ action.name }}
  73       </cds-overflow-menu-option>
  74     </ng-container>
  75   </cds-overflow-menu>
  76 </ng-template>
  77
  78 <ng-template #customTrigger>
  79   <button cdsButton="tertiary">
  80     <span i18n>{{ dropDownOnly }}</span>
  81     <svg class="cds--btn__icon"
  82          cdsIcon="caret--down"
  83          size="16"></svg>
  84   </button>
  85 </ng-template>