Fix: DataTable: loading prop true hides empty message #8292 (#8297)

Author: sarathkumarsasi

components/lib/datatable/TableBody.js

@@ -910,34 +910,30 @@ export const TableBody = React.memo(
         });
 
         const createEmptyContent = () => {
-            if (!props.loading) {
-                const colSpan = getColumnsLength();
-                const content = ObjectUtils.getJSXElement(props.emptyMessage, { props: props.tableProps, frozen: props.frozenRow }) || localeOption('emptyMessage');
-                const emptyMessageProps = mergeProps(
-                    {
-                        className: cx('emptyMessage'),
-                        role: 'row'
-                    },
-                    ptm('emptyMessage')
-                );
-
-                const bodyCellProps = mergeProps(
-                    {
-                        colSpan,
-                        role: 'cell'
-                    },
-                    getColumnPTOptions('root'),
-                    getColumnPTOptions('bodyCell')
-                );
+            const colSpan = getColumnsLength();
+            const content = ObjectUtils.getJSXElement(props.emptyMessage, { props: props.tableProps, frozen: props.frozenRow }) || localeOption('emptyMessage');
+            const emptyMessageProps = mergeProps(
+                {
+                    className: cx('emptyMessage'),
+                    role: 'row'
+                },
+                ptm('emptyMessage')
+            );
 
-                return (
-                    <tr {...emptyMessageProps}>
-                        <td {...bodyCellProps}>{content}</td>
-                    </tr>
-                );
-            }
+            const bodyCellProps = mergeProps(
+                {
+                    colSpan,
+                    role: 'cell'
+                },
+                getColumnPTOptions('root'),
+                getColumnPTOptions('bodyCell')
+            );
 
-            return null;
+            return (
+                <tr {...emptyMessageProps}>
+                    <td {...bodyCellProps}>{content}</td>
+                </tr>
+            );
         };
 
         const createGroupHeader = (rowData, rowIndex, expanded, colSpan) => {

components/lib/dataview/DataView.js

@@ -217,19 +217,15 @@ export const DataView = React.memo(
         };
 
         const createEmptyMessage = () => {
-            if (!props.loading) {
-                const content = props.emptyMessage || localeOption('emptyMessage');
-                const emptyMessageProps = mergeProps(
-                    {
-                        className: cx('emptyMessage')
-                    },
-                    ptm('emptyMessage')
-                );
-
-                return <div {...emptyMessageProps}>{content}</div>;
-            }
+            const content = props.emptyMessage || localeOption('emptyMessage');
+            const emptyMessageProps = mergeProps(
+                {
+                    className: cx('emptyMessage')
+                },
+                ptm('emptyMessage')
+            );
 
-            return null;
+            return <div {...emptyMessageProps}>{content}</div>;
         };
 
         const createHeader = () => {

components/lib/treetable/TreeTableBody.js

@@ -232,10 +232,6 @@ export const TreeTableBody = React.memo((props) => {
     };
 
     const createEmptyMessage = () => {
-        if (props.loading) {
-            return null;
-        }
-
         const colSpan = props.columns ? props.columns.length : null;
         const content = ObjectUtils.getJSXElement(props.emptyMessage, { props: props.tableProps }) || localeOption('emptyMessage');
         const emptyMessageProps = mergeProps(