Merge pull request #1592 from alexed1/datatable-w25-fix

Datatable w25 fix
alexed1 · Oct 12, 2024 · d20366e · d20366e
2 parents 7b4860b + bd27bb7
commit d20366e
Show file tree

Hide file tree

Showing 6 changed files with 51 additions and 34 deletions.
diff --git a/flow_screen_components/datatable/README.md b/flow_screen_components/datatable/README.md
@@ -51,8 +51,8 @@ https://unofficialsf.com/flow-action-and-screen-component-basepacks/
 
 ---
 **Install Datatable**  
-[Version 4.3.0 (Production or Developer)](https://login.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz81QAA)   
-[Version 4.3.0 (Sandbox)](https://test.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz81QAA)
+[Version 4.3.1 (Production or Developer)](https://login.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz99QAA)   
+[Version 4.3.1 (Sandbox)](https://test.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz99QAA)
 
 ---
 **Starting with the Winter '21 Release, Salesforce requires that a User's Profile or Permission Set is given specific permission to access any @AuraEnabled Apex Method.**  
@@ -72,6 +72,14 @@ A Permission Set (**USF Flow Screen Component - Datatable**) is included with th
 ---
 # Release Notes 
 
+## 09/29/24 -  Eric Smith -     Version 4.3.1  
+**Updates:**   
+-   Column headers will now Clip or Wrap based on the settings for the individual column 
+-   User's can no longer manually change the width of Flex enabled columns while interacting with the datatable  
+-  
+**Bug Fixes:** 
+-   Fixed bug introduced in Winter '25 affecting columns set with Flexible Widths enabled  
+
 ## 07/22/24 -  Eric Smith -     Version 4.3.0  
 **Updates:**   
 -   Added additional output attributes for Apex Defined records (outputRemovedRowsString & outputRemainingRowsString)  

diff --git a/flow_screen_components/datatable/force-app/main/default/lwc/datatable/datatable.html b/flow_screen_components/datatable/force-app/main/default/lwc/datatable/datatable.html
@@ -165,6 +165,7 @@ <h3 class="slds-text-heading_medium">Interact with this sample datatable to conf
                                 show-row-number-column={showRowNumbers}
                                 hide-checkbox-column={hideCheckboxColumn}
                                 suppress-bottom-bar={suppressBottomBar}
+                                wrap-table-header={wrapTableHeader}
                                 onsort={updateColumnSorting}
                                 oncellchange={handleCellChange}
                                 onsave={handleSave}
@@ -263,6 +264,7 @@ <h3 class="slds-text-heading_medium">Interact with this sample datatable to conf
                             show-row-number-column={showRowNumbers}
                             hide-checkbox-column={hideCheckboxColumn}
                             suppress-bottom-bar={suppressBottomBar}
+                            wrap-table-header={wrapTableHeader}
                             onsort={updateColumnSorting}
                             oncellchange={handleCellChange}
                             onsave={handleSave}

diff --git a/flow_screen_components/datatable/force-app/main/default/lwc/datatable/datatable.js b/flow_screen_components/datatable/force-app/main/default/lwc/datatable/datatable.js
@@ -36,7 +36,7 @@ import ShowingPagePrefix from '@salesforce/label/c.ers_ShowingPagePrefix';
 import ShowingPageMiddle from '@salesforce/label/c.ers_ShowingPageMiddle';
 import ShowingPageSuffix from '@salesforce/label/c.ers_ShowingPageSuffix';
 
-const CONSTANTS = getConstants();   // From ers_datatableUtils : VERSION_NUMBER, MAXROWCOUNT, ROUNDWIDTH, MYDOMAIN, ISCOMMUNITY, ISFLOWBUILDER, MIN_SEARCH_TERM_SIZE, SEARCH_WAIT_TIME, RECORDS_PER_PAGE, SHOW_DEBUG_INFO, DEBUG_INFO_PREFIX
+const CONSTANTS = getConstants();   // From ers_datatableUtils
 
 const MYDOMAIN = CONSTANTS.MYDOMAIN;
 const ISCOMMUNITY = CONSTANTS.ISCOMMUNITY;
@@ -47,6 +47,7 @@ const SEARCH_WAIT_TIME = CONSTANTS.SEARCH_WAIT_TIME;
 const RECORDS_PER_PAGE = CONSTANTS.RECORDS_PER_PAGE;
 const SHOW_DEBUG_INFO = CONSTANTS.SHOW_DEBUG_INFO;
 const DEBUG_INFO_PREFIX = CONSTANTS.DEBUG_INFO_PREFIX;
+const DEFAULT_COL_WIDTH = CONSTANTS.DEFAULT_COL_WIDTH;
 
 export default class Datatable extends LightningElement {
 
@@ -497,6 +498,7 @@ export default class Datatable extends LightningElement {
     @track showClearButton = false;
     @track showClearFilterButton = false;
     @track tableHeightAttribute = 'height:';
+    @track wrapTableHeader = "by-column";       // v4.3.1 - Column Headers now follow column Clip/Wrap setting
 
     // Handle Selected Rows retention
     @api allSelectedRows;       // Obsolete - No longer used but can't be removed
@@ -1540,7 +1542,7 @@ export default class Datatable extends LightningElement {
             // Update Flex attribute overrides by column
             switch (this.flexAttribType) {
                 case 'cols':
-                    flexAttrib.flex = this.flexes.find(i => i['column'] == columnNumber);
+                    flexAttrib.flex = this.flexes.find(i => i['column'] == columnNumber)?.flex || false;
                     break;
                 case 'all': 
                     flexAttrib.flex = true;
@@ -1706,7 +1708,6 @@ export default class Datatable extends LightningElement {
                 flex: (flexAttrib) ? flexAttrib.flex : false
             });
 
-
             // Update Other Attributes attribute overrides by column
             this.parseAttributes('other',this.otherAttribs,columnNumber);
 
@@ -2076,8 +2077,6 @@ export default class Datatable extends LightningElement {
 
     handleRowSelection(event) {
         // Added in v4.2.1 - Pagination - Persist previously selected rows that are not displayed on the currently visible page
-        // Only used with row selection
-        // Update values to be passed back to the Flow
         let currentSelectedRows = event.detail.selectedRows;
         let otherSelectedRowIds = [];
         let currentSelectedRowIds = [];
@@ -2367,7 +2366,21 @@ export default class Datatable extends LightningElement {
     handleResize(event) {
         // Save the current column widths and update the config parameter
         this.columnWidthValues = event.detail.columnWidths;
+console.log("🚀 ~ handleResize ~ this.columnWidthValues:", this.columnWidthValues);
+        // v4.3.1 Winter '25 release now returns NaN instead of 0 for flex column width
+        let widths = [];
+        let hasNaN = false;
+        let c = 0;
+        this.columnWidthValues.forEach(w => {
+            widths.push(isNaN(w) || this.flexes.find(i => i['column'] == c)?.flex ? 0 : w);
+            hasNaN = hasNaN || isNaN(w);
+            c++;
+        });
+        this.columnWidthValues = [...widths];
         this.setWidth(this.columnWidthValues);
+        if (!hasNaN ) {
+            this.columns = [...this.columns];   // Required for API v61.0 and earlier only
+        }
     }
 
     handleRoundWidths() {
@@ -2386,8 +2399,15 @@ export default class Datatable extends LightningElement {
         let colString = '';
         let colWidthsTotal = 0;
         let colFlexWidth = 0;
+        // TODO: Refactor & condense flex width logic from v4.3.1 
         this.basicColumns.forEach(colDef => {
-            colFlexWidth = this.columns[colNum].actions?.find(a => a.name == 'flex_'+colNum)?.checked ? 0 : sizes[colNum];
+            colFlexWidth = this.columns[colNum].actions?.find(a => a.name == 'flex_'+colNum)?.checked ? 0 : (sizes[colNum] == 0 && this.isConfigMode ? DEFAULT_COL_WIDTH : sizes[colNum]);   // v4.3.1 Reset column width when Flex is toggled off
+            if (sizes[colNum] == 0 && this.isConfigMode) {
+                this.flexes.push({
+                    column: colNum,
+                    flex: false
+                });
+            }
             this.columns[colNum]['initialWidth'] = colFlexWidth;
             if (this.filterColumns) {
                 this.filterColumns[colNum]['initialWidth'] = colFlexWidth;
@@ -2890,28 +2910,6 @@ export default class Datatable extends LightningElement {
         this.dispatchEvent(new FlowAttributeChangeEvent('outputSelectedRows', this.outputSelectedRows));
         this.updateNumberOfRowsSelected(this.outputSelectedRows);   // Winter '23 Patch 12 fix
 
-/*      // Validate Edited Rows
-        let errorMessage = '';
-        this.outputEditedRows.forEach(erow => {
-            let fieldNames = Object.keys(erow);
-            fieldNames.forEach(fld => {
-                const basic = this.basicColumns.find(b => b.fieldName == fld);
-                if (basic?.type.includes("text")) {
-                    if (erow[fld]?.length > basic.length) {
-                        let errorRow = this._mydata.findIndex(d => d[this.keyField] == erow[this.keyField]) + 1;
-                        errorMessage += `The value for ${fld} in Row #${errorRow} is ${erow[fld]?.length} characters long.  The maximum allowed length is ${basic.length} characters.\n`;                        
-                    }
-                }
-            });
-        });
-        if (errorMessage) {
-            this.setIsInvalidFlag(true);
-            return { 
-                isValid: false, 
-                errorMessage: errorMessage 
-            }; 
-        } */
-
         this.dispatchOutputs();
 
         console.log(this.consoleLogPrefix+'outputSelectedRows', this.outputSelectedRows.length, (SHOW_DEBUG_INFO) ? this.outputSelectedRows : '***');

diff --git a/..._components/datatable/force-app/main/default/lwc/ers_datatableUtils/ers_datatableUtils.js b/..._components/datatable/force-app/main/default/lwc/ers_datatableUtils/ers_datatableUtils.js
@@ -33,7 +33,7 @@ console.log("DATATABLE: isCommunity, isFlowBuilder:", isCommunity, isFlowBuilder
 
 const getConstants = () => {
     return {
-        VERSION_NUMBER : '4.3.0',           // Current Source Code Version #
+        VERSION_NUMBER : '4.3.2',           // Current Source Code Version #
         MAXROWCOUNT : 2000,                 // Limit the total number of records to be handled by this component
         ROUNDWIDTH : 5,                     // Used to round off the column widths during Config Mode to nearest value
         WIZROWCOUNT : 6,                    // Number of records to display in the Column Wizard datatable
@@ -51,7 +51,8 @@ const getConstants = () => {
         REMOVE_ROW_COLOR : 'remove-icon',   // Default Color for the Remove Row button
         REMOVE_ROW_SIDE : 'Right',          // Default Side for the Remove Row button
         DEBUG_INFO_PREFIX : 'DATATABLE: ',  // Prefix to be used for debug info in the console
-        SHOW_DEBUG_INFO : false             // Set to true to show sensitive debug info in the console and debug logs
+        SHOW_DEBUG_INFO : false,            // Set to true to show sensitive debug info in the console and debug logs
+        DEFAULT_COL_WIDTH : 200             // Default width to set a column when Flex is toggled off
     }
 }
 

diff --git a/flow_screen_components/datatable/force-app/main/default/lwc/jsconfig.json b/flow_screen_components/datatable/force-app/main/default/lwc/jsconfig.json
@@ -1,6 +1,12 @@
 {
     "compilerOptions": {
-        "experimentalDecorators": true
+        "experimentalDecorators": true,
+        "baseUrl": ".",
+        "paths": {
+            "c/*": [
+                "*"
+            ]
+        }
     },
     "include": [
         "**/*",

diff --git a/flow_screen_components/datatable/sfdx-project.json b/flow_screen_components/datatable/sfdx-project.json
@@ -93,6 +93,8 @@
     "[email protected]": "04t5G000004XZknQAG",
     "[email protected]": "04t5G000004XZlHQAW",
     "[email protected]": "04t5G000004fz7wQAA",
-    "[email protected]": "04t5G000004fz81QAA"
+    "[email protected]": "04t5G000004fz81QAA",
+    "[email protected]": "04t5G000004fz99QAA",
+    "[email protected]": "04t5G000004fz9EQAQ"
   }
 }