[8.8] [ML] Disable delete action for deployed models (#158533) (#158572)

# Backport This will backport the following commits from `main` to `8.8`: - [[ML] Disable delete action for deployed models (#158533)](https://github.com/elastic/kibana/pull/158533)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport)  Co-authored-by: Dima Arnautov <dmitrii.arnautov@elastic.co>
2025-04-23 17:28:26 -04:00 · 2023-05-26 12:34:28 -04:00 · 2023-05-26 12:34:28 -04:00 · 2940ec9f31
commit 2940ec9f31
parent eabb7daf21
5 changed files with 54 additions and 13 deletions
--- a/x-pack/packages/ml/trained_models_utils/src/constants/trained_models.ts
+++ b/x-pack/packages/ml/trained_models_utils/src/constants/trained_models.ts
@ -68,3 +68,5 @@ export const MODEL_STATE = {
    defaultMessage: 'downloaded',
  }),
 } as const;
+
+export type ModelState = typeof MODEL_STATE[keyof typeof MODEL_STATE];
--- a/x-pack/plugins/ml/public/application/model_management/model_actions.tsx
+++ b/x-pack/plugins/ml/public/application/model_management/model_actions.tsx
@ -392,16 +392,24 @@ export function useModelActions({
      },
      {
        name: (model) => {
-          const enabled = !isPopulatedObject(model.pipelines);
+          const hasPipelines = isPopulatedObject(model.pipelines);
+          const hasDeployments = model.state === MODEL_STATE.STARTED;
          return (
            <EuiToolTip
              position="left"
              content={
-                enabled
-                  ? null
-                  : i18n.translate('xpack.ml.trainedModels.modelsList.deleteDisabledTooltip', {
+                hasPipelines
+                  ? i18n.translate('xpack.ml.trainedModels.modelsList.deleteDisabledTooltip', {
                      defaultMessage: 'Model has associated pipelines',
                    })
+                  : hasDeployments
+                  ? i18n.translate(
+                      'xpack.ml.trainedModels.modelsList.deleteDisabledWithDeploymentsTooltip',
+                      {
+                        defaultMessage: 'Model has started deployments',
+                      }
+                    )
+                  : null
              }
            >
              <>
@ -428,7 +436,7 @@ export function useModelActions({
        enabled: (item) => {
          // TODO check for permissions to delete ingest pipelines.
          // ATM undefined means pipelines fetch failed server-side.
-          return !isPopulatedObject(item.pipelines);
+          return item.state !== MODEL_STATE.STARTED && !isPopulatedObject(item.pipelines);
        },
      },
      {
--- a/x-pack/plugins/ml/public/application/model_management/models_list.tsx
+++ b/x-pack/plugins/ml/public/application/model_management/models_list.tsx
@ -38,6 +38,7 @@ import {
  ELASTIC_MODEL_TAG,
  ELASTIC_MODEL_TYPE,
  MODEL_STATE,
+  ModelState,
 } from '@kbn/ml-trained-models-utils/src/constants/trained_models';
 import { TechnicalPreviewBadge } from '../components/technical_preview_badge';
 import { useModelActions } from './model_actions';
@ -70,7 +71,7 @@ export type ModelItem = TrainedModelConfigResponse & {
  pipelines?: ModelPipelines['pipelines'] | null;
  deployment_ids: string[];
  putModelConfig?: object;
-  state: string;
+  state: ModelState;
 };

 export type ModelItemFull = Required<ModelItem>;
--- a/x-pack/test/functional/apps/ml/short_tests/model_management/model_list.ts
+++ b/x-pack/test/functional/apps/ml/short_tests/model_management/model_list.ts
@ -210,10 +210,12 @@ export default function ({ getService }: FtrProviderContext) {
              numOfAllocations: 1,
              threadsPerAllocation: 2,
            });
+            await ml.trainedModelsTable.assertModelDeleteActionButtonEnabled(model.id, false);
          });

          it(`stops deployment of the imported model ${model.id}`, async () => {
            await ml.trainedModelsTable.stopDeployment(model.id);
+            await ml.trainedModelsTable.assertModelDeleteActionButtonEnabled(model.id, true);
          });

          it(`deletes the imported model ${model.id}`, async () => {
--- a/x-pack/test/functional/services/ml/trained_models_table.ts
+++ b/x-pack/test/functional/services/ml/trained_models_table.ts
@ -29,6 +29,8 @@ export function TrainedModelsTableProvider(
 ) {
  const testSubjects = getService('testSubjects');
  const retry = getService('retry');
+  const find = getService('find');
+  const browser = getService('browser');

  return new (class ModelsTable {
    public async parseModelsTable() {
@ -161,9 +163,7 @@ export function TrainedModelsTableProvider(
    }

    public async assertModelCollapsedActionsButtonExists(modelId: string, expectedValue: boolean) {
-      const actionsExists = await testSubjects.exists(
-        this.rowSelector(modelId, 'euiCollapsedItemActionsButton')
-      );
+      const actionsExists = await this.doesModelCollapsedActionsButtonExist(modelId);
      expect(actionsExists).to.eql(
        expectedValue,
        `Expected row collapsed actions menu button for trained model '${modelId}' to be ${
@ -172,6 +172,20 @@ export function TrainedModelsTableProvider(
      );
    }

+    public async doesModelCollapsedActionsButtonExist(modelId: string): Promise<boolean> {
+      return await testSubjects.exists(this.rowSelector(modelId, 'euiCollapsedItemActionsButton'));
+    }
+
+    public async toggleActionsContextMenu(modelId: string, expectOpen = true) {
+      await testSubjects.click(this.rowSelector(modelId, 'euiCollapsedItemActionsButton'));
+      const panelElement = await find.byCssSelector('.euiContextMenuPanel');
+      const isDisplayed = await panelElement.isDisplayed();
+      expect(isDisplayed).to.eql(
+        expectOpen,
+        `Expected the action context menu for '${modelId}' to be ${expectOpen ? 'open' : 'closed'}`
+      );
+    }
+
    public async assertModelDeleteActionButtonExists(modelId: string, expectedValue: boolean) {
      const actionsExists = await testSubjects.exists(
        this.rowSelector(modelId, 'mlModelsTableRowDeleteAction')
@ -224,10 +238,24 @@ export function TrainedModelsTableProvider(
    }

    public async assertModelDeleteActionButtonEnabled(modelId: string, expectedValue: boolean) {
-      await this.assertModelDeleteActionButtonExists(modelId, true);
-      const isEnabled = await testSubjects.isEnabled(
-        this.rowSelector(modelId, 'mlModelsTableRowDeleteAction')
-      );
+      const actionsButtonExists = await this.doesModelCollapsedActionsButtonExist(modelId);
+
+      let isEnabled = null;
+
+      if (actionsButtonExists) {
+        await this.toggleActionsContextMenu(modelId, true);
+        const panelElement = await find.byCssSelector('.euiContextMenuPanel');
+        const actionButton = await panelElement.findByTestSubject('mlModelsTableRowDeleteAction');
+        isEnabled = await actionButton.isEnabled();
+        // escape popover
+        await browser.pressKeys(browser.keys.ESCAPE);
+      } else {
+        await this.assertModelDeleteActionButtonExists(modelId, true);
+        isEnabled = await testSubjects.isEnabled(
+          this.rowSelector(modelId, 'mlModelsTableRowDeleteAction')
+        );
+      }
+
      expect(isEnabled).to.eql(
        expectedValue,
        `Expected row delete action button for trained model '${modelId}' to be '${