@wavemaker/app-ng-runtime 11.14.1-6.6324 → 11.14.1-8.6337

package/components/data/table/bundles/index.umd.js

@@ -186,8 +186,15 @@
                     this.setDataGridOption('colDefs', i2.getClonedObject(this.fieldDefs));
                 }
                 // If data and colDefs are present, call on before data render event
+                // Note: Errors in beforedatarender should not prevent table rendering
                 if (!this.isdynamictable && !lodashEs.isEmpty(newValue) && gridOptions.colDefs.length) {
-                    this.invokeEventCallback('beforedatarender', { $data: this._gridData, $columns: this.columns, data: this._gridData, columns: this.columns });
+                    try {
+                        this.invokeEventCallback('beforedatarender', { $data: this._gridData, $columns: this.columns, data: this._gridData, columns: this.columns });
+                    }
+                    catch (error) {
+                        // Log error but continue with rendering - beforedatarender errors should not block table rendering
+                        console.warn('Error in beforedatarender event callback, continuing with table rendering:', error);
+                    }
                 }
                 this.setDataGridOption('data', i2.getClonedObject(this._gridData));
             }
@@ -580,7 +587,7 @@
                     this.prevData = i2.getClonedObject(row);
                 },
                 afterRowUpdate: (row, e, callBack, options) => {
-                    this.updateRecord(lodashEs.extend({}, options, { row, 'prevData': this.prevData, 'event': e, 'callBack': callBack }));
+                    this.updateRecord(lodashEs.extend({}, options, { row, 'prevData': options.rowindex ? options.rowindex : this.prevData, 'event': e, 'callBack': callBack }));
                 },
                 onBeforeRowUpdate: (row, e, options) => {
                     return this.invokeEventCallback('beforerowupdate', { $event: e, $data: row, row, options: options });
@@ -1234,6 +1241,10 @@
             return this.actualPageSize || 5;
         }
         watchVariableDataSet(newVal) {
+            // Guard against component destruction
+            if (this.isDestroyed) {
+                return;
+            }
             let result;
             // Check for Variable filters if applied
             if (this.gridOptions.isNavTypeScrollOrOndemand()) {
@@ -1291,6 +1302,12 @@
             }
             /*Return if data is invalid.*/
             if (!this.isDataValid()) {
+                // If data is invalid and variableInflight is still true, clear loading state
+                // This prevents tables from getting stuck in loading when data is invalid
+                if (this.variableInflight) {
+                    this.variableInflight = false;
+                    this.setGridData([]);
+                }
                 return;
             }
             // If value is empty or in studio mode, dont enable the navigation
@@ -1318,7 +1335,13 @@
             // @ts-ignore
             if (!lodashEs.isObject(newVal) || newVal === '' || (newVal && newVal.dataValue === '')) {
                 if (!this.variableInflight) {
-                    // If variable has finished loading and resultSet is empty, ender empty data
+                    // If variable has finished loading and resultSet is empty, render empty data
+                    this.setGridData([]);
+                }
+                else {
+                    // If variableInflight is still true but we have invalid/empty data, clear loading state
+                    // This handles cases where data never arrives or is invalid
+                    this.variableInflight = false;
                     this.setGridData([]);
                 }
                 return;
@@ -1328,13 +1351,143 @@
             }
         }
         ngOnDestroy() {
+            // MEMORY LEAK FIX: Remove document click listener
             document.removeEventListener('click', this.documentClickBind);
+            // MEMORY LEAK FIX: Unsubscribe from navigator watches
             if (this.navigatorResultWatch) {
                 this.navigatorResultWatch.unsubscribe();
+                this.navigatorResultWatch = null;
             }
             if (this.navigatorMaxResultWatch) {
                 this.navigatorMaxResultWatch.unsubscribe();
+                this.navigatorMaxResultWatch = null;
+            }
+            // MEMORY LEAK FIX: Clear all ViewContainerRef embedded views
+            // These hold references to row data, custom expressions, and inline widgets
+            if (this.customExprViewRef) {
+                this.customExprViewRef.clear();
+            }
+            if (this.rowActionsViewRef) {
+                this.rowActionsViewRef.clear();
+            }
+            if (this.filterViewRef) {
+                this.filterViewRef.clear();
+            }
+            if (this.inlineEditViewRef) {
+                this.inlineEditViewRef.clear();
+            }
+            if (this.inlineEditNewViewRef) {
+                this.inlineEditNewViewRef.clear();
+            }
+            if (this.rowDetailViewRef) {
+                this.rowDetailViewRef.clear();
             }
+            if (this.rowExpansionActionViewRef) {
+                this.rowExpansionActionViewRef.clear();
+            }
+            if (this.dynamicTableRef) {
+                this.dynamicTableRef.clear();
+            }
+            // MEMORY LEAK FIX: Clear compiled template caches
+            this.rowActionsCompiledTl = {};
+            this.rowFilterCompliedTl = {};
+            this.inlineCompliedTl = {};
+            this.inlineNewCompliedTl = {};
+            this.customExprCompiledTl = {};
+            this.customExprCompiledSummaryTl = {};
+            this.rowDefInstances = {};
+            this.rowDefMap = {};
+            this.rowExpansionActionTl = {};
+            // MEMORY LEAK FIX: Clear dynamic context
+            if (this._dynamicContext) {
+                Object.keys(this._dynamicContext).forEach(key => {
+                    delete this._dynamicContext[key];
+                });
+                this._dynamicContext = null;
+            }
+            // MEMORY LEAK FIX: Clear data arrays
+            this._gridData = [];
+            this.items = [];
+            this.selectedItems = [];
+            this.fieldDefs = [];
+            this.fullFieldDefs = [];
+            this.gridData = [];
+            this.__fullData = null;
+            // MEMORY LEAK FIX: Destroy jQuery datatable widget before clearing gridOptions
+            if (this.datagridElement && this.datagridElement.datatable) {
+                try {
+                    this.datagridElement.datatable('destroy');
+                }
+                catch (e) {
+                    // Ignore errors during destroy
+                }
+            }
+            // MEMORY LEAK FIX: Clear gridOptions to release all function closures and data
+            // gridOptions holds many closures that capture 'this' and prevent GC
+            if (this.gridOptions) {
+                // Clear data array
+                if (this.gridOptions.data) {
+                    this.gridOptions.data = [];
+                }
+                // Clear column definitions
+                if (this.gridOptions.colDefs) {
+                    this.gridOptions.colDefs = [];
+                }
+                // Clear row actions
+                if (this.gridOptions.rowActions) {
+                    this.gridOptions.rowActions = [];
+                }
+                // Clear header config
+                if (this.gridOptions.headerConfig) {
+                    this.gridOptions.headerConfig = [];
+                }
+                // Nullify all function references to break closures
+                Object.keys(this.gridOptions).forEach(key => {
+                    if (typeof this.gridOptions[key] === 'function') {
+                        this.gridOptions[key] = null;
+                    }
+                });
+            }
+            // MEMORY LEAK FIX: Clear other data structures
+            this.columns = {};
+            this.formfields = {};
+            this.rowFilter = {};
+            this.actions = [];
+            this._actions = { header: [], footer: [] };
+            this.exportOptions = [];
+            this.headerConfig = [];
+            this.rowActions = [];
+            // MEMORY LEAK FIX: Clear all @ContentChildren QueryLists holding template references
+            // These QueryLists hold TemplateRef instances that create circular references to the parent LView
+            if (this.rowActionTmpl) {
+                this.rowActionTmpl.reset([]);
+            }
+            if (this.filterTmpl) {
+                this.filterTmpl.reset([]);
+            }
+            if (this.inlineWidgetTmpl) {
+                this.inlineWidgetTmpl.reset([]);
+            }
+            if (this.inlineWidgetNewTmpl) {
+                this.inlineWidgetNewTmpl.reset([]);
+            }
+            if (this.customExprTmpl) {
+                this.customExprTmpl.reset([]);
+            }
+            if (this.rowExpansionActionTmpl) {
+                this.rowExpansionActionTmpl.reset([]);
+            }
+            // MEMORY LEAK FIX: Clear @ContentChild template reference
+            this.rowExpansionTmpl = null;
+            // MEMORY LEAK FIX: Complete and clear subjects
+            if (this.selectedItemChange) {
+                this.selectedItemChange.complete();
+                this.selectedItemChange = null;
+            }
+            // MEMORY LEAK FIX: Clear ViewChild references
+            this.dataNavigator = null;
+            this._tableElement = null;
+            // console.log("table component destroyed");
             super.ngOnDestroy();
         }
         addRowIndex(row) {
@@ -1405,6 +1558,9 @@
                 if (!key.endsWith('_filter') && ((key.endsWith('_new') && newRow) || (!key.endsWith('_new') && !newRow))) {
                     ctrls[key].setValue('');
                     this.resetFormControl(ctrls[key]);
+                    // MEMORY LEAK FIX: Clear validators to release references
+                    ctrls[key].clearValidators();
+                    ctrls[key].clearAsyncValidators();
                 }
             });
         }
@@ -1724,7 +1880,14 @@
             defaultFieldDefs.forEach(col => {
                 this.columns[col.field] = col;
             });
-            this.invokeEventCallback('beforedatarender', { $data: data, $columns: this.columns, data: data, columns: this.columns });
+            // Note: Errors in beforedatarender should not prevent table rendering
+            try {
+                this.invokeEventCallback('beforedatarender', { $data: data, $columns: this.columns, data: data, columns: this.columns });
+            }
+            catch (error) {
+                // Log error but continue with rendering - beforedatarender errors should not block table rendering
+                console.warn('Error in beforedatarender event callback, continuing with table rendering:', error);
+            }
             defaultFieldDefs = [];
             // Apply the changes made by the user
             lodashEs.forEach(this.columns, val => {
@@ -1763,23 +1926,30 @@
             return sortExp || '';
         }
         onPropertyChange(key, nv, ov) {
+            // Guard against property changes after component destruction
+            if (this.isDestroyed) {
+                return;
+            }
             let enableNewRow;
             switch (key) {
                 case 'datasource':
                     // Fix for [WMS-23653] when startUpdate is false (request on page load property is unchecked),
                     // then set status msg as "No data found"
-                    if (this.allowpagesizechange) {
+                    if (this.allowpagesizechange && this.datasource) {
                         this.datasource.maxResults = this.pagesize || this.datasource.maxResults;
                     }
-                    if (nv.startUpdate === false) {
+                    if (nv && nv.startUpdate === false) {
                         this.variableInflight = false;
                         this.callDataGridMethod('setStatus', 'nodata', this.nodatamessage);
                     }
-                    if (lodashEs.get(this.datasource, 'category') !== 'wm.Variable') {
+                    if (this.datasource && lodashEs.get(this.datasource, 'category') !== 'wm.Variable') {
                         this.headerselectall = false;
                         this.setDataGridOption("headerselectall", false);
                     }
-                    this.watchVariableDataSet(this.dataset);
+                    // Process dataset when datasource is set, especially if dataset was previously skipped
+                    if (this.datasource && this.dataset !== undefined) {
+                        this.watchVariableDataSet(this.dataset);
+                    }
                     this.onDataSourceChange();
                     break;
                 case 'dataset':
@@ -1787,6 +1957,12 @@
                         this.gridOptions.setIsNextPageData(false);
                     }
                     if (this.binddatasource && !this.datasource) {
+                        // If datasource is not set yet, clear loading state and show no data
+                        // This prevents tables from being stuck in loading state
+                        if (this.variableInflight) {
+                            this.variableInflight = false;
+                            this.callDataGridMethod('setStatus', 'nodata', this.nodatamessage);
+                        }
                         return;
                     }
                     // if table is inside list then table dataset will be set as "item.XXX" and there is no datasource.
@@ -1890,9 +2066,11 @@
                     this.allowpagesizechange = nv;
                     break;
                 case 'pagesizeoptions':
-                    this.gridOptions.pagesizeoptions = nv;
-                    this.pagesizeoptions = nv;
-                    this.setDefaultPageSize(nv);
+                    this.prevPagesizeoptions = this.sanitizeCommaSeparatedIntegers(ov);
+                    this.gridOptions.pagesizeoptions = this.sanitizeCommaSeparatedIntegers(nv);
+                    this.pagesizeoptions = this.sanitizeCommaSeparatedIntegers(nv);
+                    if (this.allowpagesizechange)
+                        this.setDefaultPageSize(nv);
                     break;
                 case 'multiselecttitle':
                     this.setDataGridOption('multiselecttitle', nv);
@@ -1936,12 +2114,41 @@
                     this.pagesize = nv;
                 }
                 this.updatedPageSize = nv;
+                if (this.isPageSizeOptionsChanged()) {
+                    this.dataNavigator.defaultPageSizeOptions = this.pagesizeoptions?.split(',').map(Number).sort((a, b) => a - b) || [];
+                    this.dataNavigator.pageSizeOptions = [...this.dataNavigator.defaultPageSizeOptions];
+                }
             }
             this.dataNavigator.options = {
                 maxResults: nv
             };
             this.dataNavigator.widget.maxResults = nv;
             this.dataNavigator.maxResults = nv;
+            if (this.datasource) {
+                this.datasource.maxResults = this.pagesize || this.datasource.maxResults;
+            }
+        }
+        isPageSizeOptionsChanged() {
+            return !lodashEs.isEqual(this.prevPagesizeoptions, this.pagesizeoptions);
+        }
+        selectPageSize(pagesize) {
+            if (!this.allowpagesizechange && !pagesize)
+                return;
+            if (pagesize < this.dataNavigator.pageSizeOptions[0] || pagesize > this.dataNavigator.pageSizeOptions[this.dataNavigator.pageSizeOptions.length - 1]
+                || !this.dataNavigator.pageSizeOptions.includes(Number(pagesize))) {
+                pagesize = this.dataNavigator.pageSizeOptions[0];
+            }
+            this.dataNavigator.onPageSizeChange(undefined, pagesize);
+        }
+        sanitizeCommaSeparatedIntegers(input) {
+            if (!input)
+                return "";
+            const uniqueNumbers = Array.from(new Set(input
+                .split(",")
+                .map(v => v.trim())
+                .filter(v => /^-?\d+$/.test(v))
+                .map(v => Math.abs(parseInt(v, 10)))));
+            return uniqueNumbers.join(",");
         }
         onDataSourceChange() {
             this.fieldDefs.forEach(col => {
@@ -2467,7 +2674,7 @@
                     this.updateVariable(response, options.callBack);
                 }
                 else if (!this.table.datasource.execute(i2.DataSource.Operation.IS_API_AWARE)) {
-                    this.table.initiateSelectItem('current', response, undefined, false, options.callBack);
+                    this.table.initiateSelectItem('current', response, undefined, this.table.datasource.category === 'wm.Variable', options.callBack);
                 }
                 i2.triggerFn(options.success, response);
                 this.table.invokeEventCallback('rowupdate', { $event: options.event, $data: response, row: response });
@@ -3029,6 +3236,12 @@
         // Function that checks if a given string is a valid date and returns the timestamp if it is, or NaN if it's not.
         parseDateString(dateString) {
             const timestamp = Date.parse(dateString);
+            // handling case when string starts with string and end with number
+            const trimmed = dateString.trim();
+            const monthRegex = /\b(?:Jan(?:uary)?|Feb(?:ruary)?|Mar(?:ch)?|Apr(?:il)?|May|Jun(?:e)?|Jul(?:y)?|Aug(?:ust)?|Sep(?:t(?:ember)?)?|Oct(?:ober)?|Nov(?:ember)?|Dec(?:ember)?)\b/i;
+            if (/^[A-Za-z]+/.test(trimmed) && /\d+$/.test(trimmed) && !monthRegex.test(trimmed)) {
+                return NaN;
+            }
             if (!isNaN(timestamp)) {
                 return timestamp;
             }
@@ -3043,7 +3256,7 @@
                 const fieldValue = lodashEs.get(lodashEs.find(data, sortObj.field), sortObj.field);
                 const isValidDateString = typeof fieldValue === 'string' ? this.parseDateString(fieldValue) : NaN;
                 if (!isNaN(isValidDateString)) { // if the field is a date string
-                    data = lodashEs.orderBy(data, [(item) => this.parseDateString(item[sortObj.field])], [sortObj.direction]);
+                    data = lodashEs.orderBy(data, [(item) => this.parseDateString(lodashEs.get(item, sortObj.field))], [sortObj.direction]);
                 }
                 else if (sortObj.sortBy ? this.table.columns[sortObj.sortBy]?.caseinsensitive : this.table.columns[sortObj.field]?.caseinsensitive) {
                     //Fix for [WMS-27505]: Added case-insensitive sorting so that uppercase and lowercase letters are treated the same when sorting.