From d149ee8effca9fe34b3c58b5cd3c3b6c42551541 Mon Sep 17 00:00:00 2001
From: muhammedaltug <muhammetaltug@gmail.com>
Date: Thu, 18 Nov 2021 10:16:28 +0300
Subject: [PATCH] Remove ngbDropdownItem directive from single abp grid action
 button

---
 .../grid-actions/grid-actions.component.html  | 41 ++++++++++++++-----
 1 file changed, 30 insertions(+), 11 deletions(-)

diff --git a/npm/ng-packs/packages/theme-shared/extensions/src/lib/components/grid-actions/grid-actions.component.html b/npm/ng-packs/packages/theme-shared/extensions/src/lib/components/grid-actions/grid-actions.component.html
index 6172cacd20..e3a17f0cc1 100644
--- a/npm/ng-packs/packages/theme-shared/extensions/src/lib/components/grid-actions/grid-actions.component.html
+++ b/npm/ng-packs/packages/theme-shared/extensions/src/lib/components/grid-actions/grid-actions.component.html
@@ -5,12 +5,12 @@
     aria-haspopup="true"
     ngbDropdownToggle
   >
-    <i [ngClass]="icon" [class.mr-1]="icon"></i>{{ text | abpLocalization }}
+    <i [ngClass]="icon" [class.me-1]="icon"></i>{{ text | abpLocalization }}
   </button>
   <div ngbDropdownMenu>
     <ng-container
       *ngFor="let action of actionList; trackBy: trackByFn"
-      [ngTemplateOutlet]="btnItem"
+      [ngTemplateOutlet]="dropDownBtnItemTmp"
       [ngTemplateOutletContext]="{ $implicit: action }"
     >
     </ng-container>
@@ -19,25 +19,44 @@
 
 <ng-container
   *ngIf="actionList.length === 1"
-  [ngTemplateOutlet]="btnItem"
+  [ngTemplateOutlet]="btnTmp"
   [ngTemplateOutletContext]="{ $implicit: actionList.get(0).value }"
 ></ng-container>
 
-<ng-template #btnItem let-action>
+<ng-template #dropDownBtnItemTmp let-action>
   <ng-container *ngIf="action.visible(data)">
     <button
       ngbDropdownItem
       *abpPermission="action.permission"
       (click)="action.action(data)"
       type="button"
-      class="{{ actionList.length === 1 ? 'btn btn-primary' : '' }}"
-      [class.text-center]="actionList.length === 1"
     >
-      <i [ngClass]="action.icon" [class.mr-1]="action.icon"></i>
-      <span *ngIf="action.icon; else ellipsis">{{ action.text | abpLocalization }}</span>
-      <ng-template #ellipsis>
-        <div abpEllipsis>{{ action.text | abpLocalization }}</div>
-      </ng-template>
+      <ng-container
+        *ngTemplateOutlet="buttonContentTmp; context: { $implicit: action }"
+      ></ng-container>
+    </button>
+  </ng-container>
+</ng-template>
+
+<ng-template #buttonContentTmp let-action>
+  <i [ngClass]="action.icon" [class.me-1]="action.icon"></i>
+  <span *ngIf="action.icon; else ellipsis">{{ action.text | abpLocalization }}</span>
+  <ng-template #ellipsis>
+    <div abpEllipsis>{{ action.text | abpLocalization }}</div>
+  </ng-template>
+</ng-template>
+
+<ng-template #btnTmp let-action>
+  <ng-container *ngIf="action.visible(data)">
+    <button
+      *abpPermission="action.permission"
+      (click)="action.action(data)"
+      type="button"
+      class="btn btn-primary text-center"
+    >
+      <ng-container
+        *ngTemplateOutlet="buttonContentTmp; context: { $implicit: action }"
+      ></ng-container>
     </button>
   </ng-container>
 </ng-template>