From 738c1ff2c813015512f51232f4dedb8b2630a387 Mon Sep 17 00:00:00 2001
From: Fahri Gedik <fahrican9978@gmail.com>
Date: Fri, 3 Oct 2025 05:55:21 +0300
Subject: [PATCH] Fix column width handling in extensible table

Refactors how column widths are computed and applied in ExtensibleTableComponent. The actions column now uses a dedicated method for width, and property columns use a corrected index for width assignment, improving alignment and configurability.
---
 .../extensible-table/extensible-table.component.html   | 10 +++++-----
 .../extensible-table/extensible-table.component.ts     |  7 +------
 2 files changed, 6 insertions(+), 11 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 bfedbe8a44b..fd7fddfada8 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
@@ -40,9 +40,9 @@
   @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {
     <ngx-datatable-column
       [name]="actionsText | abpLocalization"
-      [maxWidth]="columnWidths[0] ?? undefined"
-      [width]="columnWidths[0] ?? 200"
-      [canAutoResize]="!columnWidths[0]"
+      [maxWidth]="_actionsColumnWidth() ?? undefined"
+      [width]="_actionsColumnWidth() ?? 200"
+      [canAutoResize]="!_actionsColumnWidth()"
       [sortable]="false"
     >
       <ng-template let-row="row" let-i="rowIndex" ngx-datatable-cell-template>
@@ -60,8 +60,8 @@
   @for (prop of propList; track prop.name; let i = $index) {
     <ngx-datatable-column
       *abpVisible="prop.columnVisible(getInjected)"
-      [width]="columnWidths[i + 1] ?? 200"
-      [canAutoResize]="!columnWidths[i + 1]"
+      [width]="columnWidths[i] ?? 200"
+      [canAutoResize]="!columnWidths[i]"
       [name]="(prop.isExtra ? '::' + prop.displayName : prop.displayName) | abpLocalization"
       [prop]="prop.name"
       [sortable]="prop.sortable"
diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts
index fdb19e553d0..c32372c4246 100644
--- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts
+++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts
@@ -130,12 +130,7 @@ export class ExtensibleTableComponent<R = any> implements OnChanges, AfterViewIn
   private readonly _actionsColumnWidth = signal<number | undefined>(DEFAULT_ACTIONS_COLUMN_WIDTH);
 
   readonly columnWidths = computed(() => {
-    const actionsColumn = this._actionsColumnWidth();
-    const widths = [actionsColumn];
-    this.propList.forEach(({ value: prop }) => {
-      widths.push(prop.columnWidth);
-    });
-    return widths;
+    return this.propList.toArray().map(prop => prop.columnWidth);
   });
 
   constructor() {