[7.x] Security/Spaces - cleanup react warnings (#53287) (#53578)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

x-pack/legacy/plugins/security/public/views/management/edit_role/components/edit_role_page.tsx

@@ -86,7 +86,7 @@ class EditRolePageUI extends Component<Props, State> {
     };
   }
 
-  public UNSAFE_componentWillMount() {
+  public componentDidMount() {
     if (this.props.action === 'clone' && isReservedRole(this.props.role)) {
       this.backToRoleList();
     }

x-pack/legacy/plugins/security/public/views/management/edit_role/components/privileges/kibana/simple_privilege_section/simple_privilege_section.test.tsx

@@ -46,6 +46,7 @@ const buildProps = (customProps: any = {}) => {
         id: 'feature1',
         name: 'Feature 1',
         app: ['app'],
+        icon: 'spacesApp',
         privileges: {
           all: {
             app: ['app'],

x-pack/legacy/plugins/spaces/public/views/management/components/advanced_settings_subtitle/advanced_settings_subtitle.test.tsx

@@ -4,9 +4,10 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import React from 'react';
-import { mountWithIntl } from 'test_utils/enzyme_helpers';
+import { mountWithIntl, nextTick } from 'test_utils/enzyme_helpers';
 import { AdvancedSettingsSubtitle } from './advanced_settings_subtitle';
 import { EuiCallOut } from '@elastic/eui';
+import { act } from '@testing-library/react';
 
 describe('AdvancedSettingsSubtitle', () => {
   it('renders as expected', async () => {
@@ -21,10 +22,10 @@ describe('AdvancedSettingsSubtitle', () => {
     );
 
     // Wait for active space to resolve before requesting the component to update
-    await Promise.resolve();
-    await Promise.resolve();
-
-    wrapper.update();
+    await act(async () => {
+      await nextTick();
+      wrapper.update();
+    });
 
     expect(wrapper.find(EuiCallOut)).toHaveLength(1);
   });

x-pack/legacy/plugins/spaces/public/views/management/components/advanced_settings_title/advanced_settings_title.test.tsx

@@ -4,9 +4,10 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import React from 'react';
-import { mountWithIntl } from 'test_utils/enzyme_helpers';
+import { mountWithIntl, nextTick } from 'test_utils/enzyme_helpers';
 import { AdvancedSettingsTitle } from './advanced_settings_title';
 import { SpaceAvatar } from '../../../../components';
+import { act } from '@testing-library/react';
 
 describe('AdvancedSettingsTitle', () => {
   it('renders without crashing', async () => {
@@ -20,9 +21,11 @@ describe('AdvancedSettingsTitle', () => {
       <AdvancedSettingsTitle getActiveSpace={() => Promise.resolve(space)} />
     );
 
-    await Promise.resolve();
-    await Promise.resolve();
-    wrapper.update();
+    await act(async () => {
+      await nextTick();
+      wrapper.update();
+    });
+
     expect(wrapper.find(SpaceAvatar)).toHaveLength(1);
   });
 });

x-pack/legacy/plugins/spaces/public/views/management/components/copy_saved_objects_to_space/copy_to_space_flyout.test.tsx

@@ -5,7 +5,7 @@
  */
 import React from 'react';
 import Boom from 'boom';
-import { mountWithIntl } from 'test_utils/enzyme_helpers';
+import { mountWithIntl, nextTick } from 'test_utils/enzyme_helpers';
 import { mockManagementPlugin } from '../../../../../../../../../src/legacy/core_plugins/management/public/np_ready/mocks';
 import { CopySavedObjectsToSpaceFlyout } from './copy_to_space_flyout';
 import { CopyToSpaceForm } from './copy_to_space_form';
@@ -93,9 +93,10 @@ const setup = async (opts: SetupOpts = {}) => {
 
   if (!opts.returnBeforeSpacesLoad) {
     // Wait for spaces manager to complete and flyout to rerender
-    await Promise.resolve();
-    await Promise.resolve();
-    wrapper.update();
+    await act(async () => {
+      await nextTick();
+      wrapper.update();
+    });
   }
 
   return { wrapper, onClose, mockSpacesManager, mockToastNotifications, savedObjectToCopy };
@@ -113,8 +114,10 @@ describe('CopyToSpaceFlyout', () => {
     expect(wrapper.find(EuiEmptyPrompt)).toHaveLength(0);
     expect(wrapper.find(EuiLoadingSpinner)).toHaveLength(1);
 
-    await Promise.resolve();
-    wrapper.update();
+    await act(async () => {
+      await nextTick();
+      wrapper.update();
+    });
 
     expect(wrapper.find(CopyToSpaceForm)).toHaveLength(1);
     expect(wrapper.find(EuiLoadingSpinner)).toHaveLength(0);
@@ -160,14 +163,13 @@ describe('CopyToSpaceFlyout', () => {
     });
 
     const startButton = findTestSubject(wrapper, 'cts-initiate-button');
-    act(() => {
+
+    await act(async () => {
       startButton.simulate('click');
+      await nextTick();
+      wrapper.update();
     });
 
-    await Promise.resolve();
-
-    wrapper.update();
-
     expect(mockSpacesManager.copySavedObjects).toHaveBeenCalled();
     expect(mockToastNotifications.addError).toHaveBeenCalled();
   });
@@ -214,13 +216,13 @@ describe('CopyToSpaceFlyout', () => {
     });
 
     const startButton = findTestSubject(wrapper, 'cts-initiate-button');
-    act(() => {
+
+    await act(async () => {
       startButton.simulate('click');
+      await nextTick();
+      wrapper.update();
     });
 
-    await Promise.resolve();
-    wrapper.update();
-
     expect(mockSpacesManager.copySavedObjects).toHaveBeenCalled();
     expect(mockToastNotifications.addError).not.toHaveBeenCalled();
 
@@ -231,13 +233,13 @@ describe('CopyToSpaceFlyout', () => {
     overwriteButton.simulate('click');
 
     const finishButton = findTestSubject(wrapper, 'cts-finish-button');
-    act(() => {
+
+    await act(async () => {
       finishButton.simulate('click');
+      await nextTick();
+      wrapper.update();
     });
 
-    await Promise.resolve();
-    wrapper.update();
-
     expect(mockSpacesManager.resolveCopySavedObjectsErrors).toHaveBeenCalled();
     expect(mockToastNotifications.addError).toHaveBeenCalled();
   });
@@ -275,14 +277,13 @@ describe('CopyToSpaceFlyout', () => {
     });
 
     const startButton = findTestSubject(wrapper, 'cts-initiate-button');
-    act(() => {
+
+    await act(async () => {
       startButton.simulate('click');
+      await nextTick();
+      wrapper.update();
     });
 
-    await Promise.resolve();
-
-    wrapper.update();
-
     expect(mockSpacesManager.copySavedObjects).toHaveBeenCalledWith(
       [{ type: savedObjectToCopy.type, id: savedObjectToCopy.id }],
       ['space-1', 'space-2'],
@@ -350,14 +351,13 @@ describe('CopyToSpaceFlyout', () => {
     });
 
     const startButton = findTestSubject(wrapper, 'cts-initiate-button');
-    act(() => {
+
+    await act(async () => {
       startButton.simulate('click');
+      await nextTick();
+      wrapper.update();
     });
 
-    await Promise.resolve();
-
-    wrapper.update();
-
     expect(wrapper.find(CopyToSpaceForm)).toHaveLength(0);
     expect(wrapper.find(ProcessingCopyToSpace)).toHaveLength(1);
 
@@ -368,13 +368,13 @@ describe('CopyToSpaceFlyout', () => {
     overwriteButton.simulate('click');
 
     const finishButton = findTestSubject(wrapper, 'cts-finish-button');
-    act(() => {
+
+    await act(async () => {
       finishButton.simulate('click');
+      await nextTick();
+      wrapper.update();
     });
 
-    await Promise.resolve();
-    wrapper.update();
-
     expect(mockSpacesManager.resolveCopySavedObjectsErrors).toHaveBeenCalledWith(
       [{ type: savedObjectToCopy.type, id: savedObjectToCopy.id }],
       {
@@ -420,14 +420,13 @@ describe('CopyToSpaceFlyout', () => {
     });
 
     const startButton = findTestSubject(wrapper, 'cts-initiate-button');
-    act(() => {
+
+    await act(async () => {
       startButton.simulate('click');
+      await nextTick();
+      wrapper.update();
     });
 
-    await Promise.resolve();
-
-    wrapper.update();
-
     expect(wrapper.find(CopyToSpaceForm)).toHaveLength(0);
     expect(wrapper.find(ProcessingCopyToSpace)).toHaveLength(1);
 

x-pack/legacy/plugins/spaces/public/views/management/edit_space/enabled_features/enabled_features.test.tsx

@@ -16,12 +16,14 @@ const features: Feature[] = [
   {
     id: 'feature-1',
     name: 'Feature 1',
+    icon: 'spacesApp',
     app: [],
     privileges: {},
   },
   {
     id: 'feature-2',
     name: 'Feature 2',
+    icon: 'spacesApp',
     app: [],
     privileges: {},
   },

x-pack/legacy/plugins/spaces/public/views/management/edit_space/manage_space_page.test.tsx

@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 jest.mock('ui/kfetch', () => ({
-  kfetch: () => Promise.resolve([{ id: 'feature-1', name: 'feature 1' }]),
+  kfetch: () => Promise.resolve([{ id: 'feature-1', name: 'feature 1', icon: 'spacesApp' }]),
 }));
 import '../../../__mocks__/xpack_info';
 import { EuiButton, EuiLink, EuiSwitch } from '@elastic/eui';

x-pack/legacy/plugins/spaces/public/views/nav_control/nav_control_popover.tsx

@@ -45,7 +45,7 @@ export class NavControlPopover extends Component<Props, State> {
     };
   }
 
-  public componentWillMount() {
+  public componentDidMount() {
     this.activeSpace$ = this.props.spacesManager.onActiveSpaceChange$.subscribe({
       next: activeSpace => {
         this.setState({