From 7edcb709ae7e6d03c7308d1b44cd6ea8234d2ff5 Mon Sep 17 00:00:00 2001
From: Yohannah Bautista <yohannahbautista@gmail.com>
Date: Fri, 19 Jan 2024 16:08:43 +0800
Subject: [PATCH 1/2] 8252. Added option to disable tooltip in columns

---
 .../datagrid/test-disable-tooltip-column.html | 128 ++++++++++++++++++
 docs/CHANGELOG.md                             |   1 +
 src/components/datagrid/datagrid.js           |  12 +-
 3 files changed, 138 insertions(+), 3 deletions(-)
 create mode 100644 app/views/components/datagrid/test-disable-tooltip-column.html

diff --git a/app/views/components/datagrid/test-disable-tooltip-column.html b/app/views/components/datagrid/test-disable-tooltip-column.html
new file mode 100644
index 0000000000..4ada3a82a2
--- /dev/null
+++ b/app/views/components/datagrid/test-disable-tooltip-column.html
@@ -0,0 +1,128 @@
+<div class="row">
+  <div class="twelve columns">
+    <button class="btn-secondary" type="button" id="open-modal">Open Modal</button><br><br>
+
+    <div id="modal-content" style="display: none;">
+      <div id="datagrid">
+      </div>
+    </div>
+  </div>
+</div>
+
+<script>
+  $('body').one('initialized', function () {
+    let grid;
+    const modals = {
+      'open-modal': {
+        'title': 'Open Modal',
+        'content': $('#modal-content')
+      }
+    },
+    columns = [
+      {
+        id: 'Order',
+        name: 'P.O',
+        field: 'productionOrder',
+        formatter: Soho.Formatters.Readonly,
+        align: 'left',
+      },
+      {
+        id: 'order',
+        name: 'Order',
+        field: 'orderStatus',
+        formatter: Soho.Formatters.Readonly,
+        align: 'left',
+      },
+      {
+        id: 'ItemCode',
+        name: 'Code',
+        field: 'itemCode',
+        formatter: Soho.Formatters.Readonly,
+        sortable: false,
+        align: 'left',
+      },
+      {
+        id: 'plannedDeliveryDate',
+        name: 'Del Date',
+        field: 'plannedDeliveryDate',
+        formatter: Soho.Formatters.Date,
+        dateFormat: 'MM/dd/yyyy',
+        sortable: false,
+        align: 'left',
+        disableTooltip: true,
+      }
+    ],
+    data = [
+        {
+          productionOrder: 'PO12345',
+          orderStatus: 'Active',
+          itemCode: 'BQR12345',
+          plannedDeliveryDate: new Date(),
+        },
+        {
+          productionOrder: 'PO12345',
+          orderStatus: 'Active',
+          itemCode: 'BQR12345',
+          plannedDeliveryDate: new Date(),
+        },
+        {
+          productionOrder: 'PO12345',
+          orderStatus: 'Active',
+          itemCode: 'BQR12345',
+          plannedDeliveryDate: new Date(),
+        },
+        {
+          productionOrder: 'PO12345',
+          orderStatus: 'Active',
+          itemCode: 'BQR12345',
+          plannedDeliveryDate: new Date(),
+        },
+      ];
+
+    grid = $('#datagrid').datagrid({
+      columns: columns,
+      dataset: data,
+      editable: true,
+      filterable: false,
+      redrawOnResize: false,
+      rowHeight: 'small',
+      selectable: 'mixed',
+      showDirty: true,
+      cellNavigation: true,
+      actionableMode: true,
+      enableTooltips: true,
+      toolbar: {
+        title: data.length + ' ' + 'Machine Issues'
+      },
+    }).data('datagrid');
+
+    setModal = function (opt) {
+      opt = $.extend({
+        autoFocus: true,
+        showCloseBtn: true,
+        buttons: [{
+          text: 'Cancel',
+          id: 'modal-button-1',
+          click: function(e, modal) {
+            modal.close();
+          }
+        }, {
+          text: 'Save',
+          id: 'modal-button-2',
+          click: function(e, modal) {
+            modal.close();
+          },
+          validate: false,
+          isDefault: true
+        }],
+        maxWidth: 1000
+      }, opt);
+
+      $('body').modal(opt);
+    };
+
+    $('#open-modal').on('click', function () {
+      setModal(modals[this.id]);
+    });
+  });
+</script>
diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
index 8cffa664a5..192d0d1d89 100644
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -4,6 +4,7 @@
 
 ## v4.92.0 Features
 
+- `[Datagrid]` Added option to disable tooltip in columns. ([#8252](https://github.com/infor-design/enterprise/issues/8252))
 - `[Header]` Added an example configuration with both a hamburger and a back button. ([#8327](https://github.com/infor-design/enterprise/issues/8327))
 - `[Icons]` Added new icons which are more substantial in look. ([#8129](https://github.com/infor-design/enterprise/issues/8129))
 
diff --git a/src/components/datagrid/datagrid.js b/src/components/datagrid/datagrid.js
index 4e8a3982c7..8551e0be4b 100644
--- a/src/components/datagrid/datagrid.js
+++ b/src/components/datagrid/datagrid.js
@@ -5062,12 +5062,13 @@ Datagrid.prototype = {
       }
 
       containerHtml[container] += `<td role="gridcell" ${ariaReadonly} aria-colindex="${j + 1}"` +
-        ` ${ariaDescribedby
+        ` ${col.disableTooltip ? 'disabletooltip ' : ''}` +
+        `${ariaDescribedby
         }${ariaChecked
         }${isSelected ? ' aria-selected="true"' : ''
         }${cssClass ? ` class="${cssClass}"` : ''
         }${colspan ? ` colspan="${colspan}"` : ''
-        }${col.tooltip && typeof col.tooltip === 'string' ? ` title="${col.tooltip.replace('{{value}}', cellValue)}"` : ''
+        }${col.tooltip && typeof col.tooltip === 'string' && col.enableTooltips !== false ? ` title="${col.tooltip.replace('{{value}}', cellValue)}"` : ''
         }${self.settings.columnGroups ? `headers = "${self.uniqueId(`-header-${j}`)} ${self.getColumnGroup(j)}"` : ''
         }${rowspan || ''}>${rowStatus.svg}<div class="datagrid-cell-wrapper"
         ${col.whiteSpace ? `style="white-space: ${col.whiteSpace}"` : ''}>`;
@@ -5765,9 +5766,10 @@ Datagrid.prototype = {
         const isHeaderIcon = DOM.hasClass(elem, 'datagrid-header-icon');
         const isPopup = isHeaderFilter ?
           elem.parentNode.querySelectorAll('.popupmenu.is-open').length > 0 : false;
-        const tooltip = $(elem).data('gridtooltip') || self.cacheTooltip(elem);
         const containerEl = isHeaderColumn ? elem.parentNode : isHeaderIcon ? elem.parentNode : elem;
         const width = self.getOuterWidth(containerEl);
+
+        const tooltip = $(elem).data('gridtooltip') || self.cacheTooltip(elem);
         if (tooltip && (tooltip.forced || (tooltip.textwidth > (width - 35))) && !isPopup) {
           self.showTooltip(tooltip);
         }
@@ -13005,6 +13007,10 @@ Datagrid.prototype = {
    * @returns {object} tooltip object.
    */
   cacheTooltip(elem, tooltip) {
+    if ($(elem).attr('disabletooltip') !== undefined) {
+      return tooltip;
+    }
+
     if (typeof tooltip === 'undefined') {
       const contentTooltip = elem.querySelector('.is-editor.content-tooltip');
       const aTitle = elem.querySelector('a[title]');

From 454174e34c1b1cf4b32186d064a94e6ccd1237cf Mon Sep 17 00:00:00 2001
From: Yohannah Bautista <yohannahbautista@gmail.com>
Date: Fri, 19 Jan 2024 16:10:33 +0800
Subject: [PATCH 2/2] 8252. Code cleanup

---
 src/components/datagrid/datagrid.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/datagrid/datagrid.js b/src/components/datagrid/datagrid.js
index 8551e0be4b..601f7e13be 100644
--- a/src/components/datagrid/datagrid.js
+++ b/src/components/datagrid/datagrid.js
@@ -5068,7 +5068,7 @@ Datagrid.prototype = {
         }${isSelected ? ' aria-selected="true"' : ''
         }${cssClass ? ` class="${cssClass}"` : ''
         }${colspan ? ` colspan="${colspan}"` : ''
-        }${col.tooltip && typeof col.tooltip === 'string' && col.enableTooltips !== false ? ` title="${col.tooltip.replace('{{value}}', cellValue)}"` : ''
+        }${col.tooltip && typeof col.tooltip === 'string' ? ` title="${col.tooltip.replace('{{value}}', cellValue)}"` : ''
         }${self.settings.columnGroups ? `headers = "${self.uniqueId(`-header-${j}`)} ${self.getColumnGroup(j)}"` : ''
         }${rowspan || ''}>${rowStatus.svg}<div class="datagrid-cell-wrapper"
         ${col.whiteSpace ? `style="white-space: ${col.whiteSpace}"` : ''}>`;