Merge remote-tracking branch 'origin/main' into 254889-lens-include-empty-rows-defaults-simple

Author: awahab07

src/platform/plugins/shared/workflows_management/public/features/actions_menu_popover/lib/use_display_options.test.ts

@@ -43,9 +43,24 @@ describe('buildDisplayOptions', () => {
   };
 
   it('shows Add step + Commands sections when no search is active', () => {
-    const result = buildDisplayOptions(base);
+    const result = buildDisplayOptions({ ...base, options: [makeAction('a', 'A')] });
     expect(groupLabels(result)).toEqual(['Add step', 'Commands']);
-    expect(dataKinds(result)).toEqual(['command', 'command']);
+    expect(dataKinds(result)).toEqual(['action', 'command', 'command']);
+  });
+
+  it('hides Add step section when no actions match the search', () => {
+    const result = buildDisplayOptions({ ...base, options: [], searchTerm: 'zzz' });
+    expect(groupLabels(result)).not.toContain('Add step');
+  });
+
+  it('hides Add step section in Steps: mode when no actions match', () => {
+    const result = buildDisplayOptions({
+      ...base,
+      options: [],
+      searchTerm: `${STEPS_PREFIX}zzz`,
+    });
+    expect(groupLabels(result)).not.toContain('Add step');
+    expect(result).toHaveLength(0);
   });
 
   it('returns action items directly when inside a sub-group', () => {

src/platform/plugins/shared/workflows_management/public/features/actions_menu_popover/lib/use_display_options.ts

@@ -91,37 +91,41 @@ export function buildDisplayOptions({
   }
 
   if (isStepsMode) {
+    if (options.length > 0) {
+      result.push({
+        label: i18n.translate('workflows.actionsMenu.addStepGroupLabel', {
+          defaultMessage: 'Add step',
+        }),
+        isGroupLabel: true,
+      });
+      for (const opt of options) {
+        result.push({ label: opt.label, data: { menuItem: { kind: 'action', action: opt } } });
+      }
+    }
+    return result;
+  }
+
+  const visibleOptions = hasSearch ? options.slice(0, MAX_VISIBLE_STEPS) : options;
+  if (visibleOptions.length > 0) {
     result.push({
       label: i18n.translate('workflows.actionsMenu.addStepGroupLabel', {
         defaultMessage: 'Add step',
       }),
       isGroupLabel: true,
     });
-    for (const opt of options) {
+    for (const opt of visibleOptions) {
       result.push({ label: opt.label, data: { menuItem: { kind: 'action', action: opt } } });
     }
-    return result;
-  }
-
-  result.push({
-    label: i18n.translate('workflows.actionsMenu.addStepGroupLabel', {
-      defaultMessage: 'Add step',
-    }),
-    isGroupLabel: true,
-  });
-  const visibleOptions = hasSearch ? options.slice(0, MAX_VISIBLE_STEPS) : options;
-  for (const opt of visibleOptions) {
-    result.push({ label: opt.label, data: { menuItem: { kind: 'action', action: opt } } });
-  }
 
-  if (hasSearch && options.length > MAX_VISIBLE_STEPS) {
-    result.push({
-      label: i18n.translate('workflows.actionsMenu.viewAllSteps', {
-        defaultMessage: 'View all steps to add',
-      }),
-      className: 'compactOption',
-      data: { menuItem: { kind: 'nav', target: 'viewAll' } },
-    });
+    if (hasSearch && options.length > MAX_VISIBLE_STEPS) {
+      result.push({
+        label: i18n.translate('workflows.actionsMenu.viewAllSteps', {
+          defaultMessage: 'View all steps to add',
+        }),
+        className: 'compactOption',
+        data: { menuItem: { kind: 'nav', target: 'viewAll' } },
+      });
+    }
   }
 
   const filteredCmds = (commands ?? []).filter(

src/platform/plugins/shared/workflows_management/public/features/actions_menu_popover/ui/actions_menu.tsx

@@ -417,12 +417,26 @@ const componentStyles = {
       '& .euiSelectableListItem.compactOption': {
         paddingBlock: euiTheme.size.s,
       },
+      // EUI 116 routes EuiSelectableListItem through EuiListItemLayout, which
+      // adds gap on __content and vertical padding on __text and drops the
+      // between-row border. renderActionOption owns its own spacing, so zero
+      // the new gap/padding out and re-add the row border to match the design.
+      '& .euiSelectableListItem__content': {
+        gap: 0,
+      },
+      '& .euiSelectableListItem__text': {
+        paddingBlock: 0,
+      },
+      '& .euiSelectableListItem:not(:last-of-type)': {
+        borderBottom: euiTheme.border.thin,
+      },
       '& .euiSelectableList': {
         maxHeight: '420px',
         overflowY: 'auto',
       },
       '& .euiSelectableList__groupLabel': {
         borderBottom: euiTheme.border.thin,
+        paddingInline: '16px',
       },
       '& .euiSelectableList__groupLabel ~ .euiSelectableList__groupLabel': {
         marginTop: '24px',
@@ -435,7 +449,8 @@ const componentStyles = {
   }),
   header: ({ euiTheme }: UseEuiTheme) =>
     css({
-      padding: euiTheme.size.m,
+      paddingBlock: euiTheme.size.m,
+      paddingInline: '16px',
     }),
   actionOption: css({
     gap: '12px',

src/platform/plugins/shared/workflows_management/public/features/workflow_list/ui/use_workflow_bulk_actions.test.tsx

@@ -101,6 +101,9 @@ describe('useWorkflowBulkActions', () => {
 
   beforeEach(() => {
     jest.clearAllMocks();
+    mockApplication.capabilities.workflowsManagement.deleteWorkflow = true;
+    mockApplication.capabilities.workflowsManagement.updateWorkflow = true;
+    mockApplication.capabilities.workflowsManagement.readWorkflow = true;
   });
 
   it('returns panels and modals', () => {
@@ -158,6 +161,25 @@ describe('useWorkflowBulkActions', () => {
       expect(deleteItem).toBeDefined();
     });
 
+    it('does not include delete action when a managed workflow is selected', () => {
+      const managedWorkflow = createMockWorkflow({ managed: true });
+      const { result } = renderHook(
+        () =>
+          useWorkflowBulkActions({
+            ...defaultProps,
+            selectedWorkflows: [managedWorkflow],
+            allWorkflows: [managedWorkflow],
+          }),
+        { wrapper }
+      );
+
+      const mainPanel = result.current.panels[0];
+      const deleteItem = mainPanel.items?.find(
+        (item) => 'key' in item && item.key === 'workflows-bulk-action-delete'
+      );
+      expect(deleteItem).toBeUndefined();
+    });
+
     it('includes export action when there are exportable workflows', () => {
       const { result } = renderHook(() => useWorkflowBulkActions(defaultProps), { wrapper });
 

src/platform/plugins/shared/workflows_management/public/features/workflow_list/ui/use_workflow_bulk_actions.tsx

@@ -69,15 +69,27 @@ export const useWorkflowBulkActions = ({
   const canReadWorkflow = application?.capabilities.workflowsManagement.readWorkflow;
 
   const isDisabled = selectedWorkflows.length === 0;
+  const hasManagedWorkflows = selectedWorkflows.some((workflow) => workflow.managed === true);
+  const canDeleteSelectedWorkflows = canDeleteWorkflow && !hasManagedWorkflows;
 
   const handleDeleteWorkflows = useCallback(() => {
+    if (hasManagedWorkflows) {
+      return;
+    }
     onAction();
     setShowDeleteModal(true);
-  }, [onAction]);
+  }, [hasManagedWorkflows, onAction]);
 
   const confirmDelete = useCallback(() => {
-    const ids = selectedWorkflows.map((workflow) => workflow.id);
+    const ids = selectedWorkflows
+      .filter((workflow) => workflow.managed !== true)
+      .map((workflow) => workflow.id);
     const count = ids.length;
+    if (count === 0) {
+      setShowDeleteModal(false);
+      deselectWorkflows();
+      return;
+    }
 
     setShowDeleteModal(false);
     deselectWorkflows();
@@ -231,15 +243,15 @@ export const useWorkflowBulkActions = ({
       });
     }
 
-    if (mainPanelItems.length > 0 && canDeleteWorkflow) {
+    if (mainPanelItems.length > 0 && canDeleteSelectedWorkflows) {
       mainPanelItems.push({
         isSeparator: true as const,
         key: 'bulk-actions-separator',
         'data-test-subj': 'bulk-actions-separator',
       });
     }
 
-    if (canDeleteWorkflow) {
+    if (canDeleteSelectedWorkflows) {
       mainPanelItems.push({
         name: (
           <EuiTextColor color="danger">
@@ -268,7 +280,7 @@ export const useWorkflowBulkActions = ({
   }, [
     selectedWorkflows,
     canUpdateWorkflow,
-    canDeleteWorkflow,
+    canDeleteSelectedWorkflows,
     canReadWorkflow,
     isDisabled,
     handleEnableWorkflows,

src/platform/plugins/shared/workflows_management/public/features/workflow_list/ui/workflow_list.authorization.test.tsx

@@ -284,6 +284,36 @@ describe('Authorization matrix', () => {
     }
   );
 
+  it('disables the delete row action for managed workflows', async () => {
+    setKibanaCapabilities({
+      createWorkflow: true,
+      updateWorkflow: true,
+      deleteWorkflow: true,
+      executeWorkflow: true,
+    });
+    renderList({ item: createWorkflowListItem({ id: 'managed-wf', managed: true }) });
+
+    await openFirstRowCollapsedActions();
+
+    expect(screen.getByTestId('deleteWorkflowAction')).toBeDisabled();
+  });
+
+  it('explains why managed workflows cannot be deleted', async () => {
+    setKibanaCapabilities({
+      createWorkflow: true,
+      updateWorkflow: true,
+      deleteWorkflow: true,
+      executeWorkflow: true,
+    });
+    renderList({ item: createWorkflowListItem({ id: 'managed-wf', managed: true }) });
+
+    await openFirstRowCollapsedActions();
+    const deleteAction = screen.getByTestId('deleteWorkflowAction');
+    await userEvent.hover(deleteAction.parentElement ?? deleteAction);
+
+    expect(await screen.findByText('Managed workflows cannot be deleted')).toBeInTheDocument();
+  });
+
   it('disables the enabled switch when the workflow is invalid even if update is granted', () => {
     setKibanaCapabilities({
       createWorkflow: false,

src/platform/plugins/shared/workflows_management/public/features/workflow_list/ui/workflow_list.test.tsx

@@ -7,7 +7,7 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-import { render, screen } from '@testing-library/react';
+import { render, screen, within } from '@testing-library/react';
 import React from 'react';
 import type { WorkflowListDto, WorkflowListItemDto, WorkflowsSearchParams } from '@kbn/workflows';
 import { createMockWorkflowsCapabilities as mockCreateMockWorkflowsCapabilities } from '@kbn/workflows-ui/mocks';
@@ -106,6 +106,9 @@ jest.mock('../../run_workflow/ui/workflow_execute_modal', () => ({
 
 jest.mock('../../../shared/ui', () => ({
   getRunTooltipContent: () => 'Run',
+  ManagedWorkflowBadge: ({ dataTestSubj = 'managedWorkflowBadge' }: { dataTestSubj?: string }) => (
+    <span data-test-subj={dataTestSubj}>{'Managed'}</span>
+  ),
   StatusBadge: ({ status }: { status: string }) => <span>{status}</span>,
   WorkflowStatus: ({ valid }: { valid: boolean }) => <span>{valid ? 'Valid' : 'Invalid'}</span>,
 }));
@@ -287,6 +290,38 @@ describe('WorkflowList', () => {
       expect(screen.getByText('A workflow for testing')).toBeInTheDocument();
     });
 
+    it('renders the managed badge as the first tag for managed workflows', () => {
+      const workflow = createMockWorkflow({
+        managed: true,
+        definition: {
+          version: '1',
+          name: 'My Test Workflow',
+          enabled: true,
+          triggers: [],
+          steps: [],
+          tags: ['custom', 'second'],
+        },
+      });
+
+      mockUseWorkflows.mockReturnValue({
+        data: createMockWorkflowListDto([workflow]),
+        isLoading: false,
+        error: null,
+        refetch: mockRefetch,
+      });
+
+      renderComponent();
+
+      const tagsCell = screen.getByTestId('workflowTags');
+      const managedBadge = within(tagsCell).getByTestId('managedWorkflowBadge');
+      const firstWorkflowTag = within(tagsCell).getByText('custom');
+
+      expect(managedBadge).toHaveTextContent('Managed');
+      expect(managedBadge.compareDocumentPosition(firstWorkflowTag)).toEqual(
+        Node.DOCUMENT_POSITION_FOLLOWING
+      );
+    });
+
     it('shows "No description" for workflows without description', () => {
       mockUseWorkflows.mockReturnValue({
         data: createMockWorkflowListDto([createMockWorkflow({ description: '' })]),