feat(eui): add noItemsMessage prop to EuiInMemoryTable

packages/eui/changelogs/upcoming/8812.md

@@ -0,0 +1,6 @@
+- Added `noItemsMessage` prop to `EuiInMemoryTable`
+
+**Deprecations**
+
+- Deprecated `message` prop in `EuiInMemoryTable` in favor of `noItemsMessage` which is a more meaningful prop name; there are no functional changes
+

packages/eui/src/components/basic_table/in_memory_table.stories.tsx

@@ -30,7 +30,7 @@ const meta: Meta<EuiInMemoryTableProps> = {
     error: '',
     loading: false,
     // Set to strings for easier testing
-    message: '',
+    noItemsMessage: '',
     childrenBetween: '',
     // Inherited from EuiTable
     responsiveBreakpoint: 'm',

packages/eui/src/components/basic_table/in_memory_table.test.tsx

@@ -53,7 +53,7 @@ describe('EuiInMemoryTable', () => {
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  test('with message', () => {
+  test('with noItemsMessage', () => {
     const props: EuiInMemoryTableProps<BasicItem> = {
       ...requiredProps,
       items: [],
@@ -64,14 +64,14 @@ describe('EuiInMemoryTable', () => {
           description: 'description',
         },
       ],
-      message: 'where my items at?',
+      noItemsMessage: 'where my items at?',
     };
     const { getByText } = render(<EuiInMemoryTable {...props} />);
 
     expect(getByText('where my items at?')).toBeTruthy();
   });
 
-  test('with message and loading', () => {
+  test('with noItemsMessage and loading', () => {
     const props: EuiInMemoryTableProps<BasicItem> = {
       ...requiredProps,
       items: [],
@@ -82,7 +82,7 @@ describe('EuiInMemoryTable', () => {
           description: 'description',
         },
       ],
-      message: 'Loading items....',
+      noItemsMessage: 'Loading items....',
       loading: true,
     };
     const { container } = render(<EuiInMemoryTable {...props} />);
@@ -136,10 +136,10 @@ describe('EuiInMemoryTable', () => {
     expect(getByText('expanded row content')).toBeTruthy();
   });
 
-  test('with items and message - expecting to show the items', () => {
+  test('with items and noItemsMessage - expecting to show the items', () => {
     const props: EuiInMemoryTableProps<BasicItem> = {
       ...requiredProps,
-      message: 'show me!',
+      noItemsMessage: 'show me!',
       items: [
         { id: '1', name: 'name1' },
         { id: '2', name: 'name2' },
@@ -1036,7 +1036,7 @@ describe('EuiInMemoryTable', () => {
           defaultQuery: 'No',
         },
         className: 'testTable',
-        message: <span className="customMessage">No items found!</span>,
+        noItemsMessage: <span className="customMessage">No items found!</span>,
       };
 
       const { container } = render(<EuiInMemoryTable {...props} />);
@@ -1080,7 +1080,7 @@ describe('EuiInMemoryTable', () => {
           defaultQuery: 'No',
         },
         className: 'testTable',
-        message: <span className="customMessage">No items found!</span>,
+        noItemsMessage: <span className="customMessage">No items found!</span>,
       };
 
       const { container: container2 } = render(

packages/eui/src/components/basic_table/in_memory_table.tsx

@@ -75,7 +75,15 @@ type InMemoryTableProps<T extends object> = Omit<
   EuiBasicTableProps<T>,
   'pagination' | 'sorting' | 'noItemsMessage' | 'onChange'
 > & {
+  /**
+   * Message to display if table is empty
+   * @deprecated Use `noItemsMessage` instead.
+   */
   message?: ReactNode;
+  /**
+   * Message to display if table is empty
+   */
+  noItemsMessage?: ReactNode;
   /**
    * Configures {@link Search}.
    */
@@ -677,6 +685,7 @@ export class EuiInMemoryTable<T extends object = object> extends Component<
       columns,
       loading,
       message,
+      noItemsMessage,
       error,
       selection,
       compressed,
@@ -750,7 +759,7 @@ export class EuiInMemoryTable<T extends object = object> extends Component<
         onChange={this.onTableChange}
         error={error}
         loading={loading}
-        noItemsMessage={message}
+        noItemsMessage={noItemsMessage || message}
         tableLayout={tableLayout}
         compressed={compressed}
         itemIdToExpandedRowMap={itemIdToExpandedRowMap}

packages/website/docs/components/tables/table_selection.tsx

@@ -365,7 +365,7 @@ export default () => {
       rowHeader="firstName"
       error={error}
       loading={loading}
-      message={message}
+      noItemsMessage={message}
       search={search}
       sorting={true}
       pagination={pagination}