Merge branch 'main' into 141616-flaky-test-lens

package.json

@@ -108,7 +108,7 @@
     "@elastic/datemath": "5.0.3",
     "@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@8.5.0-canary.1",
     "@elastic/ems-client": "8.3.3",
-    "@elastic/eui": "70.2.4",
+    "@elastic/eui": "70.4.0",
     "@elastic/filesaver": "1.1.2",
     "@elastic/node-crypto": "1.2.1",
     "@elastic/numeral": "^2.5.1",
@@ -613,7 +613,7 @@
     "react-dom": "^17.0.2",
     "react-dropzone": "^4.2.9",
     "react-fast-compare": "^2.0.4",
-    "react-focus-on": "^3.6.0",
+    "react-focus-on": "^3.7.0",
     "react-grid-layout": "^1.3.4",
     "react-hook-form": "^7.39.5",
     "react-intl": "^2.8.0",

packages/kbn-securitysolution-exception-list-components/index.ts

@@ -16,3 +16,4 @@ export * from './src/value_with_space_warning';
 export * from './src/types';
 export * from './src/list_header';
 export * from './src/header_menu';
+export * from './src/generate_linked_rules_menu_item';

packages/kbn-securitysolution-exception-list-components/src/exception_item_card/header/index.tsx

@@ -29,6 +29,7 @@ export const ExceptionItemCardHeader = memo<ExceptionItemCardHeaderProps>(
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
           <HeaderMenu
+            iconType="boxesHorizontal"
             disableActions={disableActions}
             actions={actions}
             aria-label="Exception item actions menu"

packages/kbn-securitysolution-exception-list-components/src/header_menu/header_menu.test.tsx

@@ -13,6 +13,17 @@ import { getSecurityLinkAction } from '../mocks/security_link_component.mock';
 
 describe('HeaderMenu', () => {
   it('should render button icon with default settings', () => {
+    const wrapper = render(
+      <HeaderMenu iconType="boxesHorizontal" disableActions={false} actions={null} />
+    );
+
+    expect(wrapper).toMatchSnapshot();
+
+    expect(wrapper.getByTestId('ButtonIcon')).toBeInTheDocument();
+    expect(wrapper.queryByTestId('EmptyButton')).not.toBeInTheDocument();
+    expect(wrapper.queryByTestId('MenuPanel')).not.toBeInTheDocument();
+  });
+  it('should not render icon', () => {
     const wrapper = render(<HeaderMenu disableActions={false} actions={null} />);
 
     expect(wrapper).toMatchSnapshot();
@@ -23,7 +34,11 @@ describe('HeaderMenu', () => {
   });
   it('should render button icon disabled', () => {
     const wrapper = render(
-      <HeaderMenu disableActions={false} actions={actionsWithDisabledDelete} />
+      <HeaderMenu
+        iconType="boxesHorizontal"
+        disableActions={false}
+        actions={actionsWithDisabledDelete}
+      />
     );
 
     fireEvent.click(wrapper.getByTestId('ButtonIcon'));
@@ -103,7 +118,13 @@ describe('HeaderMenu', () => {
   it('should render custom Actions', () => {
     const customActions = getSecurityLinkAction('headerMenuTest');
     const wrapper = render(
-      <HeaderMenu disableActions={false} emptyButton actions={customActions} useCustomActions />
+      <HeaderMenu
+        iconType="boxesHorizontal"
+        disableActions={false}
+        emptyButton
+        actions={customActions}
+        useCustomActions
+      />
     );
 
     expect(wrapper).toMatchSnapshot();
@@ -117,7 +138,12 @@ describe('HeaderMenu', () => {
     const customAction = [...actions];
     customAction[0].onClick = onEdit;
     const wrapper = render(
-      <HeaderMenu dataTestSubj="headerMenu" disableActions={false} actions={actions} />
+      <HeaderMenu
+        iconType="boxesHorizontal"
+        dataTestSubj="headerMenu"
+        disableActions={false}
+        actions={actions}
+      />
     );
     const headerMenu = wrapper.getByTestId('headerMenuItems');
     const click = createEvent.click(headerMenu);

packages/kbn-securitysolution-exception-list-components/src/header_menu/index.tsx

@@ -18,6 +18,7 @@ import {
   PanelPaddingSize,
   PopoverAnchorPosition,
 } from '@elastic/eui';
+
 import { ButtonContentIconSide } from '@elastic/eui/src/components/button/_button_content_deprecated';
 
 export interface Action {
@@ -27,6 +28,7 @@ export interface Action {
   disabled?: boolean;
   onClick: (e: React.MouseEvent<Element, MouseEvent>) => void;
 }
+
 interface HeaderMenuComponentProps {
   disableActions: boolean;
   actions: Action[] | ReactElement[] | null;
@@ -47,7 +49,7 @@ const HeaderMenuComponent: FC<HeaderMenuComponentProps> = ({
   disableActions,
   emptyButton,
   useCustomActions,
-  iconType = 'boxesHorizontal',
+  iconType,
   iconSide = 'left',
   anchorPosition = 'downCenter',
   panelPaddingSize = 's',
@@ -84,7 +86,7 @@ const HeaderMenuComponent: FC<HeaderMenuComponentProps> = ({
             <EuiButtonEmpty
               isDisabled={disableActions}
               onClick={onAffectedRulesClick}
-              iconType={iconType}
+              iconType={iconType ? iconType : undefined}
               iconSide={iconSide}
               data-test-subj={`${dataTestSubj || ''}EmptyButton`}
               aria-label="Header menu Button Empty"
@@ -95,7 +97,7 @@ const HeaderMenuComponent: FC<HeaderMenuComponentProps> = ({
             <EuiButtonIcon
               isDisabled={disableActions}
               onClick={onAffectedRulesClick}
-              iconType={iconType}
+              iconType={iconType ? iconType : 'boxesHorizontal'}
               data-test-subj={`${dataTestSubj || ''}ButtonIcon`}
               aria-label="Header menu Button Icon"
             >