@axinom/mosaic-ui 0.49.0-rc.1 → 0.49.0-rc.10

package/src/components/PageHeader/PageHeaderActionsGroup/PageHeaderActionsGroup.tsx

@@ -0,0 +1,224 @@
+import clsx from 'clsx';
+import React, { useCallback, useEffect, useState } from 'react';
+import { noop } from '../../../helpers/utils';
+import { useExpand } from '../../../hooks/useExpand/useExpand';
+import { uuid } from '../../../utils/GenerateId';
+import { ConfirmationMode } from '../../ConfirmDialog';
+import { IconName } from '../../Icons';
+import {
+  PageHeaderAction,
+  isPageHeaderJsAction,
+} from '../PageHeaderAction/PageHeaderAction';
+import {
+  PageHeaderActionProps,
+  PageHeaderActionType,
+} from '../PageHeaderAction/PageHeaderAction.model';
+import classes from './PageHeaderActionsGroup.scss';
+import { PageHeaderActionsGroupContext } from './PageHeaderActionsGroupsContext';
+
+export interface PageHeaderActionsGroupProps {
+  /** Array of Actions to be rendered (default: []) */
+  actions: PageHeaderActionProps[];
+  /** Whether group is disabled (default: false) */
+  disabled?: boolean;
+  /** Whether actions in the group are disabled or not (default: false)*/
+  groupActionsDisabled?: boolean;
+  /** CSS Class name for additional styles */
+  className?: string;
+  /** The label of the action. */
+  label: string;
+  /** Optional built in icon. This prop also accepts an img src. */
+  icon?: IconName | string;
+  /** Whether group actions are shown by default. (default: false) */
+  openActionsGroupOnStart?: boolean;
+  /** The number of actions that can be displayed in the group. (default: actions.length) */
+  availableActionSpace?: number;
+  /**
+   * Callback to emit when Group Actions is toggled
+   * The expanded state is supplied as an argument
+   */
+  onActionsGroupToggled?: (expanded: boolean) => void;
+}
+
+/**
+ * Used to perform group operations from the PageHeader component.
+ * @example
+ * <PageHeaderActionsGroup>
+ *   <PageHeaderAction action={action} onActionsGroupToggled={onActionsGroupToggledHandler} />
+ * </PageHeaderActionsGroup>
+ */
+export const PageHeaderActionsGroup: React.FC<PageHeaderActionsGroupProps> = ({
+  actions = [],
+  openActionsGroupOnStart = false,
+  label,
+  icon,
+  onActionsGroupToggled = noop,
+  groupActionsDisabled = false,
+  disabled = false,
+  availableActionSpace = actions.length,
+  className = '',
+}) => {
+  const [uniqueId] = useState<string>(uuid());
+  const { isExpanded, toggleExpanded, collapse } = useExpand(
+    openActionsGroupOnStart,
+  );
+
+  const { registerCollapse, collapseAll } = React.useContext(
+    PageHeaderActionsGroupContext,
+  );
+
+  const customCollapse = useCallback(() => {
+    collapse();
+    onActionsGroupToggled(false);
+  }, [collapse, onActionsGroupToggled]);
+
+  useEffect(() => {
+    registerCollapse(customCollapse, uniqueId);
+  }, [customCollapse, registerCollapse, uniqueId]);
+
+  const {
+    isExpanded: isMoreExpanded,
+    expand: moreExpanded,
+    collapse: moreCollapse,
+    toggleExpanded: toggleMoreExpanded,
+  } = useExpand();
+
+  const [isMouseOverMore, setIsMouseOverMore] = useState<boolean>(false);
+  const [isConfirmOpen, setIsConfirmOpen] = useState<Record<string, boolean>>(
+    {},
+  );
+
+  const onConfirmToggled = (
+    isOpen: boolean,
+    data: { id: string; mode: ConfirmationMode },
+  ): void => {
+    setIsConfirmOpen((prevState) => {
+      return { ...prevState, [data.id]: isOpen };
+    });
+  };
+
+  useEffect(() => {
+    const hasConfirm: boolean = Object.values(isConfirmOpen).includes(true);
+
+    // open drop down
+    if (isMouseOverMore) {
+      moreExpanded();
+      // close drop down if no confirmation is active
+    } else if (!isMouseOverMore && !hasConfirm) {
+      moreCollapse();
+      // keep the drop down open if confirmation is active
+    } else if (!isMouseOverMore && hasConfirm) {
+      return;
+    }
+  }, [isConfirmOpen, isMouseOverMore, moreCollapse, moreExpanded]);
+
+  const actionsSlice =
+    availableActionSpace < actions.length
+      ? availableActionSpace - 1
+      : availableActionSpace;
+
+  return (
+    <div
+      className={clsx(
+        classes.container,
+        'page-header-group-action-container',
+        className,
+      )}
+      onMouseLeave={() => setIsMouseOverMore(false)}
+    >
+      <PageHeaderAction
+        label={label}
+        actionType={
+          isExpanded
+            ? PageHeaderActionType.Active
+            : PageHeaderActionType.Context
+        }
+        icon={icon}
+        onClick={() => {
+          if (!isExpanded) {
+            collapseAll();
+          }
+          toggleExpanded();
+          onActionsGroupToggled(!isExpanded);
+        }}
+        disabled={disabled}
+      />
+      <div
+        style={{
+          maxWidth: isExpanded
+            ? `${Math.min(availableActionSpace, actions.length) * 121}px`
+            : `0px`,
+          opacity: isExpanded ? 1 : 0,
+        }}
+        className={classes.actions}
+      >
+        {actions.slice(0, actionsSlice).map((action, idx) =>
+          isPageHeaderJsAction(action) ? (
+            <PageHeaderAction
+              key={idx}
+              {...action}
+              disabled={groupActionsDisabled}
+              confirmationConfig={{
+                ...action.confirmationConfig,
+                onConfirmOpen: (isOpen: boolean, args: unknown) => {
+                  onConfirmToggled(
+                    isOpen,
+                    args as { id: string; mode: ConfirmationMode },
+                  );
+                  action.confirmationConfig?.onConfirmOpen?.(isOpen, args);
+                },
+              }}
+            />
+          ) : (
+            <PageHeaderAction key={idx} {...action} />
+          ),
+        )}
+        {actions.length > availableActionSpace && (
+          <div onMouseEnter={() => setIsMouseOverMore(true)}>
+            <PageHeaderAction
+              label="More"
+              icon={IconName.Ellipsis}
+              actionType={
+                isMoreExpanded
+                  ? PageHeaderActionType.Active
+                  : PageHeaderActionType.Context
+              }
+              onClick={() => toggleMoreExpanded()}
+            />
+          </div>
+        )}
+      </div>
+      {isMoreExpanded && (
+        <div className={clsx(classes.dropDownList)}>
+          {actions.slice(actionsSlice).map((action, idx) =>
+            isPageHeaderJsAction(action) ? (
+              <PageHeaderAction
+                key={idx}
+                {...action}
+                disabled={groupActionsDisabled}
+                onClick={() => {
+                  action.onClick();
+                  moreCollapse();
+                  setIsMouseOverMore(false);
+                }}
+                className={clsx(classes.dropDown)}
+                confirmationConfig={{
+                  ...action.confirmationConfig,
+                  onConfirmOpen: (isOpen, args) => {
+                    onConfirmToggled(
+                      isOpen,
+                      args as { id: string; mode: ConfirmationMode },
+                    );
+                    action.confirmationConfig?.onConfirmOpen?.(isOpen, args);
+                  },
+                }}
+              />
+            ) : (
+              <PageHeaderAction key={idx} {...action} />
+            ),
+          )}
+        </div>
+      )}
+    </div>
+  );
+};

package/src/components/PageHeader/PageHeaderActionsGroup/PageHeaderActionsGroupsContext.ts

@@ -0,0 +1,13 @@
+import { createContext } from 'react';
+import { noop } from '../../../helpers/utils';
+
+export interface PageHeaderActionsGroupContextType {
+  registerCollapse: (readonly: () => void, uuid: string) => void;
+  collapseAll: () => void;
+}
+
+export const PageHeaderActionsGroupContext =
+  createContext<PageHeaderActionsGroupContextType>({
+    registerCollapse: noop,
+    collapseAll: noop,
+  });

package/src/components/PageHeader/PageHeaderActionsGroup/PageHeaderActionsGroupsContextProvider.tsx

@@ -0,0 +1,30 @@
+import React, { useCallback, useState } from 'react';
+import { PageHeaderActionsGroupContext } from './PageHeaderActionsGroupsContext';
+
+type CollapseAction = Record<string, () => void>;
+
+export const PageHeaderActionsGroupContextProvider: React.FC = ({
+  children,
+}) => {
+  const [registeredCollapses, setRegisteredCollapses] =
+    useState<CollapseAction>({});
+
+  const registerCollapse = useCallback(
+    (collapse: () => void, uuid: string): void => {
+      setRegisteredCollapses((prev) => ({ ...prev, [uuid]: collapse }));
+    },
+    [],
+  );
+
+  const collapseAll = useCallback(() => {
+    Object.values(registeredCollapses).forEach((collapse) => collapse());
+  }, [registeredCollapses]);
+
+  return (
+    <PageHeaderActionsGroupContext.Provider
+      value={{ registerCollapse, collapseAll }}
+    >
+      {children}
+    </PageHeaderActionsGroupContext.Provider>
+  );
+};

package/src/components/PageHeader/index.ts

@@ -1,5 +1,5 @@
 export { PageHeader } from './PageHeader';
-export { PageHeaderProps } from './PageHeader.model';
+export { PageHeaderActionItemProps, PageHeaderProps } from './PageHeader.model';
 export {
   PageHeaderAction,
   PageHeaderActionProps,

package/dist/components/DynamicDataList/helpers/generateId.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"generateId.d.ts","sourceRoot":"","sources":["../../../../src/components/DynamicDataList/helpers/generateId.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,IAAI,QAAO,MAKvB,CAAC"}

package/dist/components/PageHeader/PageHeaderBulkActions/PageHeaderBulkActions.d.ts

@@ -1,22 +0,0 @@
-import React from 'react';
-import { PageHeaderProps } from '../PageHeader.model';
-import { PageHeaderActionProps } from '../PageHeaderAction/PageHeaderAction.model';
-export interface PageHeaderBulkActionsProps extends Pick<PageHeaderProps, 'openBulkActionsOnStart' | 'onBulkActionsToggled'> {
-    /** Array of Actions to be rendered (default: []) */
-    actions?: PageHeaderActionProps[];
-    /** Number of available slots actions can use in the PageHeader */
-    availableActionSpace: number;
-    /** Whether or not bulk actions are disabled (default: false)*/
-    bulkActionsDisabled?: boolean;
-    /** CSS Class name for additional styles */
-    className?: string;
-}
-/**
- * Used to perform bulk operations from the PageHeader component.
- * @example
- * <PageHeaderBulkActions>
- *   <PageHeaderAction action={action} onBulkActionsToggled={onBulkActionsToggledHandler} />
- * </PageHeaderBulkActions>
- */
-export declare const PageHeaderBulkActions: React.FC<PageHeaderBulkActionsProps>;
-//# sourceMappingURL=PageHeaderBulkActions.d.ts.map

package/dist/components/PageHeader/PageHeaderBulkActions/PageHeaderBulkActions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PageHeaderBulkActions.d.ts","sourceRoot":"","sources":["../../../../src/components/PageHeader/PageHeaderBulkActions/PageHeaderBulkActions.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAKnD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAKtD,OAAO,EACL,qBAAqB,EAEtB,MAAM,4CAA4C,CAAC;AAGpD,MAAM,WAAW,0BACf,SAAQ,IAAI,CACV,eAAe,EACf,wBAAwB,GAAG,sBAAsB,CAClD;IACD,oDAAoD;IACpD,OAAO,CAAC,EAAE,qBAAqB,EAAE,CAAC;IAClC,kEAAkE;IAClE,oBAAoB,EAAE,MAAM,CAAC;IAC7B,+DAA+D;IAC/D,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAoJtE,CAAC"}

package/src/components/PageHeader/PageHeaderBulkActions/PageHeaderBulkActions.spec.tsx

@@ -1,369 +0,0 @@
-import { mount, shallow } from 'enzyme';
-import React from 'react';
-import { act } from 'react-dom/test-utils';
-import { noop } from '../../../helpers/utils';
-import { PageHeaderAction } from '../PageHeaderAction/PageHeaderAction';
-import {
-  PageHeaderActionProps,
-  PageHeaderActionType,
-} from '../PageHeaderAction/PageHeaderAction.model';
-import {
-  PageHeaderBulkActions,
-  PageHeaderBulkActionsProps,
-} from './PageHeaderBulkActions';
-
-const defaultActions: PageHeaderActionProps[] = [
-  {
-    label: 'Bulk Action 1',
-    onClick: noop,
-  },
-  {
-    label: 'Bulk Action 2',
-    onClick: noop,
-  },
-  {
-    label: 'Bulk Action 3',
-    onClick: noop,
-  },
-];
-
-const defaultProps: PageHeaderBulkActionsProps = {
-  availableActionSpace: 0,
-  actions: defaultActions,
-};
-
-describe('PageHeaderBulkActions', () => {
-  it('renders the component without crashing', () => {
-    const wrapper = shallow(<PageHeaderBulkActions {...defaultProps} />);
-    expect(wrapper).toBeTruthy();
-  });
-
-  it(`renders only 'Bulk Actions' by default`, () => {
-    const wrapper = mount(<PageHeaderBulkActions {...defaultProps} />);
-    const actions = wrapper.find(PageHeaderAction);
-    expect(actions).toHaveLength(1);
-  });
-
-  it(`'Bulk Actions' has the 'Context' actionType when closed and 'Active' actionType when open`, () => {
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        availableActionSpace={defaultActions.length}
-      />,
-    );
-    const bulkActionsToggle = wrapper.find(PageHeaderAction).first();
-    let action = wrapper.find(PageHeaderAction);
-
-    expect(action.prop('actionType')).toBe(PageHeaderActionType.Context);
-
-    bulkActionsToggle.simulate('click');
-    action = wrapper.find(PageHeaderAction).first();
-
-    expect(action.prop('actionType')).toBe(PageHeaderActionType.Active);
-  });
-
-  it(`renders all actions when 'Bulk Actions' is selected and there is enough available action slots`, () => {
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        availableActionSpace={defaultActions.length}
-      />,
-    );
-    const bulkActionsToggle = wrapper.find(PageHeaderAction).first();
-    let actions = wrapper.find(PageHeaderAction);
-    const bulkActionCount = 1;
-    expect(actions).toHaveLength(1);
-    bulkActionsToggle.simulate('click');
-    actions = wrapper.find(PageHeaderAction);
-    expect(actions).toHaveLength(bulkActionCount + defaultActions.length);
-  });
-
-  it(`'Bulk Actions' hides all actions when actions are shown`, () => {
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        availableActionSpace={defaultActions.length}
-        openBulkActionsOnStart={true}
-      />,
-    );
-    const bulkActionsToggle = wrapper.find(PageHeaderAction).first();
-    let actions = wrapper.find(PageHeaderAction);
-    const bulkActionCount = 1;
-    expect(actions).toHaveLength(bulkActionCount + defaultActions.length);
-    bulkActionsToggle.simulate('click');
-    actions = wrapper.find(PageHeaderAction);
-    expect(actions).toHaveLength(1);
-  });
-
-  it(`raises onBulkActionsToggled`, () => {
-    const bulkActionSpy = jest.fn();
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        onBulkActionsToggled={bulkActionSpy}
-      />,
-    );
-    const bulkActionsToggle = wrapper.find(PageHeaderAction).first();
-    bulkActionsToggle.simulate('click');
-    expect(bulkActionSpy).toHaveBeenCalledTimes(1);
-    expect(bulkActionSpy).toHaveBeenCalledWith(true);
-  });
-
-  it(`renders 'Bulk Actions' and 'More Actions' if openBulkActionsOnStart is set to true and there isn't enough available space`, () => {
-    const wrapper = mount(
-      <PageHeaderBulkActions {...defaultProps} openBulkActionsOnStart={true} />,
-    );
-    const bulkActionCount = 1;
-    const moreActionCount = 1;
-    const actions = wrapper.find(PageHeaderAction);
-    expect(actions).toHaveLength(bulkActionCount + moreActionCount);
-  });
-
-  it(`renders the dropdown list when 'More' actions are available on mouse enter and closes on mouse leave`, () => {
-    const wrapper = mount(
-      <PageHeaderBulkActions {...defaultProps} openBulkActionsOnStart={true} />,
-    );
-    const moreActionsToggle = wrapper.find('.hasMore');
-
-    let dropDownActions = wrapper.find('.dropDownList');
-    expect(dropDownActions.exists()).toBe(false);
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseEnter')();
-    });
-
-    wrapper.update();
-
-    dropDownActions = wrapper.find('.dropDownList');
-
-    expect(dropDownActions.exists()).toBe(true);
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseLeave')();
-    });
-
-    wrapper.update();
-
-    dropDownActions = wrapper.find('.dropDownList');
-
-    expect(dropDownActions.exists()).toBe(false);
-  });
-
-  it(`'More' action has the 'Context' actionType when closed and the 'Active' actionType when open`, () => {
-    const wrapper = mount(
-      <PageHeaderBulkActions {...defaultProps} openBulkActionsOnStart={true} />,
-    );
-    const moreActionsToggle = wrapper.find('.hasMore');
-    let action = wrapper.find(PageHeaderAction).last();
-
-    expect(action.prop('actionType')).toBe(PageHeaderActionType.Context);
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseEnter')();
-    });
-
-    wrapper.update();
-
-    action = wrapper.find(PageHeaderAction).at(1);
-
-    expect(action.prop('actionType')).toBe(PageHeaderActionType.Active);
-  });
-
-  it(`renders actions, that don't fit in the PageHeader, in the drop down list`, () => {
-    const [mockAction1, mockAction2, mockAction3] = defaultActions;
-    const wrapper = mount(
-      <PageHeaderBulkActions {...defaultProps} openBulkActionsOnStart={true} />,
-    );
-    const moreActionsToggle = wrapper.find('.hasMore');
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseEnter')();
-    });
-
-    wrapper.update();
-
-    const dropDownActions = wrapper.find('.dropDownList');
-    const action1 = dropDownActions.childAt(0);
-    const action2 = dropDownActions.childAt(1);
-    const action3 = dropDownActions.childAt(2);
-
-    expect(dropDownActions.children()).toHaveLength(defaultActions.length);
-    expect(action1.text()).toBe(mockAction1.label);
-    expect(action2.text()).toBe(mockAction2.label);
-    expect(action3.text()).toBe(mockAction3.label);
-  });
-
-  it(`splits actions between the PageHeader and dropdown list when theres not enough space for all`, () => {
-    const [mockAction1, mockAction2, mockAction3] = defaultActions;
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        openBulkActionsOnStart={true}
-        availableActionSpace={2}
-      />,
-    );
-    const moreActionsToggle = wrapper.find('.hasMore');
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseEnter')();
-    });
-
-    wrapper.update();
-
-    const pageHeaderActions = wrapper.find('.container').first();
-    const action1 = pageHeaderActions.find('.container:not(.hasMore)').at(1);
-    const action2 = pageHeaderActions.find('.container:not(.hasMore)').at(2);
-    let action3 = pageHeaderActions.find('.container:not(.hasMore)').at(3);
-
-    expect(action1.text()).toBe(mockAction1.label);
-    expect(action2.text()).toBe(mockAction2.label);
-    expect(action3.text()).not.toBe(mockAction3.label);
-
-    const dropDownActions = wrapper.find('.dropDownList');
-    action3 = dropDownActions.childAt(0);
-
-    expect(dropDownActions.children()).toHaveLength(1);
-    expect(action3.text()).toBe(mockAction3.label);
-  });
-
-  it(`raises onClick for actions in the page header available space and drop down list`, () => {
-    const pageHeaderSpy = jest.fn();
-    const dropDownListSpy = jest.fn();
-    const actionsWithSpies: PageHeaderActionProps[] = [
-      {
-        label: 'Bulk Action 1',
-        onClick: pageHeaderSpy,
-      },
-      {
-        label: 'Bulk Action 2',
-        onClick: dropDownListSpy,
-      },
-    ];
-
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        actions={actionsWithSpies}
-        openBulkActionsOnStart={true}
-        availableActionSpace={1}
-      />,
-    );
-    const moreActionsToggle = wrapper.find('.hasMore');
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseEnter')();
-    });
-
-    wrapper.update();
-
-    const pageHeaderActions = wrapper.find('.container').first();
-    const action1 = pageHeaderActions.find('.container:not(.hasMore)').at(1);
-
-    action1.simulate('click');
-
-    expect(pageHeaderSpy).toHaveBeenCalledTimes(1);
-
-    const dropDownActions = wrapper.find('.dropDownList');
-    const action2 = dropDownActions.childAt(0);
-
-    action2.simulate('click');
-
-    expect(dropDownListSpy).toHaveBeenCalledTimes(1);
-  });
-
-  it(`closes drop down list after clicking an action`, () => {
-    const dropDownListSpy = jest.fn();
-    const actionsWithSpies: PageHeaderActionProps[] = [
-      {
-        label: 'Bulk Action 1',
-        onClick: dropDownListSpy,
-      },
-    ];
-
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        actions={actionsWithSpies}
-        openBulkActionsOnStart={true}
-        availableActionSpace={0}
-      />,
-    );
-    const moreActionsToggle = wrapper.find('.hasMore');
-    let dropDownActions = wrapper.find('.dropDownList');
-
-    expect(dropDownActions.exists()).toBe(false);
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseEnter')();
-    });
-
-    wrapper.update();
-
-    dropDownActions = wrapper.find('.dropDownList');
-    expect(dropDownActions.exists()).toBe(true);
-
-    const action = dropDownActions.childAt(0);
-
-    action.simulate('click');
-
-    dropDownActions = wrapper.find('.dropDownList');
-
-    expect(dropDownActions.exists()).toBe(false);
-  });
-
-  it(`disables actions if 'isBulkActionsDisabled' prop is true`, () => {
-    const pageHeaderSpy = jest.fn();
-    const dropDownListSpy = jest.fn();
-    const actionsWithSpies: PageHeaderActionProps[] = [
-      {
-        label: 'Bulk Action 1',
-        onClick: pageHeaderSpy,
-      },
-      {
-        label: 'Bulk Action 2',
-        onClick: dropDownListSpy,
-      },
-    ];
-
-    const wrapper = mount(
-      <PageHeaderBulkActions
-        {...defaultProps}
-        actions={actionsWithSpies}
-        openBulkActionsOnStart={true}
-        availableActionSpace={1}
-        bulkActionsDisabled={true}
-      />,
-    );
-    const moreActionsToggle = wrapper.find('.hasMore');
-
-    act(() => {
-      // @ts-expect-error We don't pass event args
-      moreActionsToggle.prop('onMouseEnter')();
-    });
-
-    wrapper.update();
-
-    const pageHeaderActions = wrapper.find('.container').first();
-    const action1 = pageHeaderActions.find('.container:not(.hasMore)').at(1);
-
-    action1.simulate('click');
-
-    expect(action1.prop('disabled')).toBe(true);
-    expect(pageHeaderSpy).not.toHaveBeenCalled();
-
-    const dropDownActions = wrapper.find('.dropDownList');
-    const action2 = dropDownActions.childAt(0);
-
-    action2.simulate('click');
-
-    expect(action2.prop('disabled')).toBe(true);
-    expect(dropDownListSpy).not.toHaveBeenCalled();
-  });
-});