From f60d3e68c09e674d18c17999d463785f37cf31f6 Mon Sep 17 00:00:00 2001
From: allrude <allrude@gmail.com>
Date: Mon, 2 Mar 2026 11:56:23 +0100
Subject: [PATCH] Fix JavaScript TypeError: columns initialized as object
 instead of array

Problem:
- columns was initialized as an empty object {} in grid-component-type.phtml
- columns-selector-component-partial.phtml calls this.columns.forEach()
- Object.forEach() is not a function, causing TypeError and page hang
- Backend GridViewModel.getColumns() returns array of Column objects

Solution:
1. Changed columns: {} to columns: [] in grid-component-type.phtml:20
   to match expected array type from backend
2. Added Array.isArray(this.columns) safety check before forEach()
   in columns-selector-component-partial.phtml:15 to prevent future errors

Scan Results:
- Reviewed all .phtml files in the module for similar patterns
- All other object/array initializations are correct for their usage
- gridFilters: {} correctly used as object with bracket notation
- filters: [] correctly initialized as array in filters-component-partial
- No other array method calls on object-initialized properties found

This fix prevents the grid component from crashing when the columns
selector is initialized.
---
 .../columns-selector-component-partial.phtml              | 8 +++++---
 .../script/component-type/grid-component-type.phtml       | 2 +-
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/view/adminhtml/templates/script/component-partial/columns-selector-component-partial.phtml b/view/adminhtml/templates/script/component-partial/columns-selector-component-partial.phtml
index 3de5de2..3a8ac54 100644
--- a/view/adminhtml/templates/script/component-partial/columns-selector-component-partial.phtml
+++ b/view/adminhtml/templates/script/component-partial/columns-selector-component-partial.phtml
@@ -12,9 +12,11 @@ use Magento\Framework\View\Element\Template;
         activeColumns: null,
         initActiveColumns() {
             this.activeColumns = new Set();
-            this.columns.forEach(column => {
-                this.activeColumns.add(column.code);
-            })
+            if (Array.isArray(this.columns)) {
+                this.columns.forEach(column => {
+                    this.activeColumns.add(column.code);
+                })
+            }
         },
         isColumnActive() {
             const columnName = this.$el.getAttribute('data-column');
diff --git a/view/adminhtml/templates/script/component-type/grid-component-type.phtml b/view/adminhtml/templates/script/component-type/grid-component-type.phtml
index de4ef0d..6e34d3f 100644
--- a/view/adminhtml/templates/script/component-type/grid-component-type.phtml
+++ b/view/adminhtml/templates/script/component-type/grid-component-type.phtml
@@ -17,7 +17,7 @@ use Magento\Framework\View\Element\Template;
         ...LokiAdminFiltersComponentPartial,
         ...LokiAdminMassActionsComponentPartial,
         ...LokiComponentType,
-        columns: {},
+        columns: [],
         columnPositions: {},
         showOtherActions: false,
         gridFilters: {},