From f210cb29abdd956336924180576a03dba73d0c54 Mon Sep 17 00:00:00 2001
From: "Christiane (Tina) Heiligers" <christiane.heiligers@elastic.co>
Date: Fri, 13 Dec 2024 10:39:48 -0700
Subject: [PATCH] Fix delete disabled state (#204154)

fix https://github.com/elastic/kibana/issues/204095

Disables delete when no saved objects are selected or all objects
selected are hidden and delete is allowed.

![Screenshot 2024-12-12 at 18 02
10](https://github.com/user-attachments/assets/e894a087-7906-4905-bd2e-2325a90d37c0)

## Summary

Summarize your PR. If it involves visual changes include a screenshot or
gif.

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

(cherry picked from commit 4ee52227bce2a1ffffaf930d41513bb0c644c199)
---
 .../__snapshots__/table.test.tsx.snap         | 235 +-----------------
 .../objects_table/components/table.test.tsx   |  30 ++-
 .../objects_table/components/table.tsx        |  11 +-
 3 files changed, 36 insertions(+), 240 deletions(-)

diff --git a/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap b/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap
index bc0eda7e6d5a5..a3bcf4da52544 100644
--- a/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap
+++ b/src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap
@@ -1,239 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Table prevents hidden saved objects from being deleted 1`] = `
-<Fragment>
-  <EuiSearchBar
-    box={
-      Object {
-        "data-test-subj": "savedObjectSearchBar",
-        "schema": Object {
-          "recognizedFields": Array [
-            "type",
-            "tag",
-          ],
-        },
-      }
-    }
-    filters={
-      Array [
-        Object {
-          "field": "type",
-          "multiSelect": "or",
-          "name": "Type",
-          "options": Array [
-            Object {
-              "value": 2,
-            },
-          ],
-          "type": "field_value_selection",
-        },
-      ]
-    }
-    onChange={[Function]}
-    toolsRight={
-      Array [
-        <EuiToolTip
-          content={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Selected objects can’t be deleted because they are hidden objects."
-              id="savedObjectsManagement.objectsTable.table.deleteDisabledTooltip"
-            />
-          }
-          delay="regular"
-          display="inlineBlock"
-          position="top"
-        >
-          <EuiButton
-            color="danger"
-            data-test-subj="savedObjectsManagementDelete"
-            iconType="trash"
-            isDisabled={true}
-            onClick={[Function]}
-            title="Unable to delete saved objects"
-          >
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Delete"
-              id="savedObjectsManagement.objectsTable.table.deleteButtonLabel"
-            />
-          </EuiButton>
-        </EuiToolTip>,
-        <EuiPopover
-          anchorPosition="downCenter"
-          button={
-            <EuiButton
-              iconSide="right"
-              iconType="arrowDown"
-              isDisabled={false}
-              onClick={[Function]}
-            >
-              <Memo(MemoizedFormattedMessage)
-                defaultMessage="Export"
-                id="savedObjectsManagement.objectsTable.table.exportPopoverButtonLabel"
-              />
-            </EuiButton>
-          }
-          closePopover={[Function]}
-          display="inline-block"
-          hasArrow={true}
-          isOpen={false}
-          ownFocus={true}
-          panelPaddingSize="m"
-          repositionToCrossAxis={true}
-        >
-          <EuiFormRow
-            label={
-              <Memo(MemoizedFormattedMessage)
-                defaultMessage="Options"
-                id="savedObjectsManagement.objectsTable.exportObjectsConfirmModal.exportOptionsLabel"
-              />
-            }
-          >
-            <EuiSwitch
-              checked={true}
-              label={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Include related objects"
-                  id="savedObjectsManagement.objectsTable.exportObjectsConfirmModal.includeReferencesDeepLabel"
-                />
-              }
-              name="includeReferencesDeep"
-              onChange={[Function]}
-            />
-          </EuiFormRow>
-          <EuiFormRow>
-            <EuiButton
-              fill={true}
-              iconType="exportAction"
-              onClick={[Function]}
-            >
-              <Memo(MemoizedFormattedMessage)
-                defaultMessage="Export"
-                id="savedObjectsManagement.objectsTable.table.exportButtonLabel"
-              />
-            </EuiButton>
-          </EuiFormRow>
-        </EuiPopover>,
-      ]
-    }
-  />
-  <EuiSpacer />
-  <div
-    data-test-subj="savedObjectsTable"
-  >
-    <EuiBasicTable
-      columns={
-        Array [
-          Object {
-            "align": "center",
-            "data-test-subj": "savedObjectsTableRowType",
-            "description": "Type of the saved object",
-            "field": "type",
-            "name": "Type",
-            "render": [Function],
-            "sortable": true,
-            "width": "65px",
-          },
-          Object {
-            "data-test-subj": "savedObjectsTableRowTitle",
-            "dataType": "string",
-            "description": "Title of the saved object",
-            "field": "meta.title",
-            "name": "Title",
-            "render": [Function],
-            "sortable": false,
-          },
-          Object {
-            "field": "updated_at",
-            "name": "Last updated",
-            "render": [Function],
-            "sortable": true,
-            "width": "150px",
-          },
-          Object {
-            "actions": Array [
-              Object {
-                "data-test-subj": "savedObjectsTableAction-inspect",
-                "description": "Inspect this saved object",
-                "icon": "inspect",
-                "name": "Inspect",
-                "onClick": [Function],
-                "type": "icon",
-              },
-              Object {
-                "data-test-subj": "savedObjectsTableAction-relationships",
-                "description": "View the relationships this saved object has to other saved objects",
-                "icon": "kqlSelector",
-                "name": "Relationships",
-                "onClick": [Function],
-                "type": "icon",
-              },
-            ],
-            "name": "Actions",
-            "width": "80px",
-          },
-        ]
-      }
-      itemId="id"
-      items={
-        Array [
-          Object {
-            "attributes": Object {},
-            "id": "1",
-            "meta": Object {
-              "editUrl": "#/management/kibana/dataViews/dataView/1",
-              "icon": "indexPatternApp",
-              "inAppUrl": Object {
-                "path": "/management/kibana/dataViews/dataView/1",
-                "uiCapabilitiesPath": "management.kibana.indexPatterns",
-              },
-              "title": "MyIndexPattern*",
-            },
-            "references": Array [],
-            "type": "index-pattern",
-          },
-        ]
-      }
-      loading={false}
-      noItemsMessage={
-        <EuiI18n
-          default="No items found"
-          token="euiBasicTable.noItemsMessage"
-        />
-      }
-      onChange={[Function]}
-      pagination={
-        Object {
-          "pageIndex": 1,
-          "pageSize": 2,
-          "pageSizeOptions": Array [
-            5,
-            10,
-            20,
-            50,
-          ],
-          "totalItemCount": 3,
-        }
-      }
-      rowProps={[Function]}
-      selection={
-        Object {
-          "onSelectionChange": [Function],
-        }
-      }
-      sorting={
-        Object {
-          "sort": Object {
-            "direction": "desc",
-            "field": "updated_at",
-          },
-        }
-      }
-      tableLayout="fixed"
-    />
-  </div>
-</Fragment>
-`;
-
 exports[`Table should render normally 1`] = `
 <Fragment>
   <EuiSearchBar
@@ -267,6 +33,7 @@ exports[`Table should render normally 1`] = `
     toolsRight={
       Array [
         <EuiToolTip
+          data-test-subj="deleteSOToolTip"
           delay="regular"
           display="inlineBlock"
           position="top"
diff --git a/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.test.tsx b/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.test.tsx
index 4c2ce7cfcef6e..3e7d1df19e470 100644
--- a/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.test.tsx
+++ b/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.test.tsx
@@ -113,7 +113,7 @@ describe('Table', () => {
     expect(component.state().isSearchTextValid).toBe(true);
   });
 
-  it(`prevents hidden saved objects from being deleted`, () => {
+  it(`prevents hidden saved objects from being deleted`, async () => {
     const selectedSavedObjects = [
       { type: 'visualization', meta: { hiddenType: true } },
       { type: 'search', meta: { hiddenType: true } },
@@ -124,9 +124,33 @@ describe('Table', () => {
       selectedSavedObjects,
       capabilities: { savedObjectsManagement: { delete: false } } as any,
     };
-    const component = shallowWithI18nProvider(<Table {...customizedProps} />);
+    render(
+      <I18nProvider>
+        <Table {...customizedProps} />
+      </I18nProvider>
+    );
 
-    expect(component).toMatchSnapshot();
+    await waitFor(() => {
+      expect(screen.getByTestId('savedObjectsManagementDelete')).toBeDisabled();
+    });
+  });
+
+  it(`disables delete when no objects are selected `, async () => {
+    const selectedSavedObjects = [] as any;
+    const customizedProps = {
+      ...defaultProps,
+      selectedSavedObjects,
+      capabilities: { savedObjectsManagement: { delete: true } } as any,
+    };
+    render(
+      <I18nProvider>
+        <Table {...customizedProps} />
+      </I18nProvider>
+    );
+
+    await waitFor(() => {
+      expect(screen.getByTestId('savedObjectsManagementDelete')).toBeDisabled();
+    });
   });
 
   it(`allows for automatic refreshing after an action`, () => {
diff --git a/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.tsx b/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.tsx
index a32a1e9e958e1..73e6e2978429b 100644
--- a/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.tsx
+++ b/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.tsx
@@ -386,8 +386,9 @@ export class Table extends PureComponent<TableProps, TableState> {
     const activeActionContents = this.state.activeAction?.render() ?? null;
     const exceededResultCount = totalItemCount > MAX_PAGINATED_ITEM;
 
-    const allHidden = selectedSavedObjects.every(({ meta: { hiddenType } }) => hiddenType);
-
+    const anySelected = selectedSavedObjects.length > 0;
+    const allHidden =
+      anySelected && selectedSavedObjects.every(({ meta: { hiddenType } }) => hiddenType);
     return (
       <Fragment>
         {activeActionContents}
@@ -403,6 +404,8 @@ export class Table extends PureComponent<TableProps, TableState> {
           defaultQuery={this.props.initialQuery}
           toolsRight={[
             <EuiToolTip
+              data-test-subj="deleteSOToolTip"
+              key="deleteSOToolTip"
               content={
                 allHidden ? (
                   <FormattedMessage
@@ -417,7 +420,9 @@ export class Table extends PureComponent<TableProps, TableState> {
                 iconType="trash"
                 color="danger"
                 onClick={onDelete}
-                isDisabled={allHidden || !capabilities.savedObjectsManagement.delete}
+                isDisabled={
+                  !anySelected || allHidden || !capabilities.savedObjectsManagement.delete
+                }
                 title={
                   capabilities.savedObjectsManagement.delete
                     ? undefined