@switch (buttonType) {
  @case ('icon') {
    <button mat-icon-button color="primary" [matMenuTriggerFor]="commandMenu" [disabled]="disabled">
      <mat-icon>{{ icon }}</mat-icon>
    </button>
  }
  @case ('text') {
    <button class="action-button" [disabled]="clientData.length === 0 || disabled" [matMenuTriggerFor]="commandMenu">
      {{ buttonText }}
    </button>
  }
  @case ('menu-item') {
    <button mat-menu-item [matMenuTriggerFor]="commandMenu" [disabled]="disabled">
      <mat-icon>{{ icon }}</mat-icon>
      <span>{{ buttonText }}</span>
    </button>
  }
}

<mat-menu #commandMenu="matMenu">
  @for (command of arrayCommands; track command.slug) {
    <button mat-menu-item [disabled]="command.disabled || (command.slug === 'create-image' && clientData.length > 1)"
      (click)="onCommandSelect(command.slug)">
      {{ command.translationKey | translate }}
    </button>
  }
</mat-menu>