From e2c4f5c5ff1b23dca723c0613d0bbc2f270d19fa Mon Sep 17 00:00:00 2001
From: Fahri Gedik <fahrican9978@gmail.com>
Date: Tue, 1 Jul 2025 13:51:48 +0300
Subject: [PATCH] Enable column header click sorting in extensible table

Adds click handlers and pointer cursor styling to sortable column headers in the extensible table component. This allows users to sort columns by clicking on the header, improving table usability.
---
 .../extensible-table/extensible-table.component.html  | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.html b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.html
index 85eb36ffee..9555c58f4b 100644
--- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.html
+++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.html
@@ -64,17 +64,24 @@
       [prop]="prop.name"
       [sortable]="prop.sortable"
     >
-      <ng-template ngx-datatable-header-template let-column="column">
+      <ng-template ngx-datatable-header-template let-column="column" let-sortFn="sortFn">
         @if (prop.tooltip) {
           <span
             [ngbTooltip]="prop.tooltip.text | abpLocalization"
             [placement]="prop.tooltip.placement || 'auto'"
             container="body"
+            [class.pointer]="prop.sortable"
+            (click)="prop.sortable && sortFn(column)"
           >
             {{ column.name }} <i class="fa fa-info-circle" aria-hidden="true"></i>
           </span>
         } @else {
-          {{ column.name }}
+          <span
+            [class.pointer]="prop.sortable"
+            (click)="prop.sortable && sortFn(column)"
+          >
+            {{ column.name }}
+          </span>
         }
       </ng-template>
       <ng-template let-row="row" let-i="index" ngx-datatable-cell-template>