Adds an execution environment step to the ad hoc commands

kivra-sweden · Apr 26, 2021 · e6bde23 · e6bde23
1 parent 1e7b7d1
commit e6bde23
Show file tree

Hide file tree

Showing 16 changed files with 16,785 additions and 33 deletions.
diff --git a/awx/ui_next/src/components/AdHocCommands/AdHocCommands.jsx b/awx/ui_next/src/components/AdHocCommands/AdHocCommands.jsx
@@ -12,10 +12,9 @@ import AlertModal from '../AlertModal';
 import ErrorDetail from '../ErrorDetail';
 import AdHocCommandsWizard from './AdHocCommandsWizard';
 import { KebabifiedContext } from '../../contexts/Kebabified';
-import ContentLoading from '../ContentLoading';
 import ContentError from '../ContentError';
 
-function AdHocCommands({ adHocItems, i18n, hasListItems }) {
+function AdHocCommands({ adHocItems, i18n, hasListItems, onLaunchLoading }) {
   const history = useHistory();
   const { id } = useParams();
 
@@ -76,19 +75,20 @@ function AdHocCommands({ adHocItems, i18n, hasListItems }) {
   );
 
   const handleSubmit = async values => {
-    const { credential, ...remainingValues } = values;
+    const { credential, execution_environment, ...remainingValues } = values;
     const newCredential = credential[0].id;
 
     const manipulatedValues = {
       credential: newCredential,
+      execution_environment: execution_environment[0]?.id,
       ...remainingValues,
     };
     await launchAdHocCommands(manipulatedValues);
   };
-
-  if (isLaunchLoading) {
-    return <ContentLoading />;
-  }
+  useEffect(() => onLaunchLoading(isLaunchLoading), [
+    isLaunchLoading,
+    onLaunchLoading,
+  ]);
 
   if (error && isWizardOpen) {
     return (

diff --git a/awx/ui_next/src/components/AdHocCommands/AdHocCommands.test.jsx b/awx/ui_next/src/components/AdHocCommands/AdHocCommands.test.jsx
@@ -4,12 +4,19 @@ import {
   mountWithContexts,
   waitForElement,
 } from '../../../testUtils/enzymeHelpers';
-import { CredentialTypesAPI, InventoriesAPI, CredentialsAPI } from '../../api';
+import {
+  CredentialTypesAPI,
+  InventoriesAPI,
+  CredentialsAPI,
+  ExecutionEnvironmentsAPI,
+} from '../../api';
 import AdHocCommands from './AdHocCommands';
 
 jest.mock('../../api/models/CredentialTypes');
 jest.mock('../../api/models/Inventories');
 jest.mock('../../api/models/Credentials');
+jest.mock('../../api/models/ExecutionEnvironments');
+
 jest.mock('react-router-dom', () => ({
   ...jest.requireActual('react-router-dom'),
   useParams: () => ({
@@ -51,6 +58,15 @@ describe('<AdHocCommands />', () => {
     CredentialTypesAPI.read.mockResolvedValue({
       data: { count: 1, results: [{ id: 1, name: 'cred' }] },
     });
+    ExecutionEnvironmentsAPI.read.mockResolvedValue({
+      data: {
+        results: [
+          { id: 1, name: 'EE1 1', url: 'wwww.google.com' },
+          { id: 2, name: 'EE2', url: 'wwww.google.com' },
+        ],
+        count: 2,
+      },
+    });
   });
   let wrapper;
   afterEach(() => {
@@ -61,7 +77,11 @@ describe('<AdHocCommands />', () => {
   test('mounts successfully', async () => {
     await act(async () => {
       wrapper = mountWithContexts(
-        <AdHocCommands adHocItems={adHocItems} hasListItems />
+        <AdHocCommands
+          adHocItems={adHocItems}
+          hasListItems
+          onLaunchLoading={() => jest.fn()}
+        />
       );
     });
     expect(wrapper.find('AdHocCommands').length).toBe(1);
@@ -86,9 +106,22 @@ describe('<AdHocCommands />', () => {
     CredentialTypesAPI.read.mockResolvedValue({
       data: { results: [{ id: 1 }] },
     });
+    ExecutionEnvironmentsAPI.read.mockResolvedValue({
+      data: {
+        results: [
+          { id: 1, name: 'EE1 1', url: 'wwww.google.com' },
+          { id: 2, name: 'EE2', url: 'wwww.google.com' },
+        ],
+        count: 2,
+      },
+    });
     await act(async () => {
       wrapper = mountWithContexts(
-        <AdHocCommands adHocItems={adHocItems} hasListItems />
+        <AdHocCommands
+          adHocItems={adHocItems}
+          hasListItems
+          onLaunchLoading={() => jest.fn()}
+        />
       );
     });
     await act(async () =>
@@ -108,9 +141,22 @@ describe('<AdHocCommands />', () => {
         count: 5,
       },
     });
+    ExecutionEnvironmentsAPI.read.mockResolvedValue({
+      data: {
+        results: [
+          { id: 1, name: 'EE1 1', url: 'wwww.google.com' },
+          { id: 2, name: 'EE2', url: 'wwww.google.com' },
+        ],
+        count: 2,
+      },
+    });
     await act(async () => {
       wrapper = mountWithContexts(
-        <AdHocCommands adHocItems={adHocItems} hasListItems />
+        <AdHocCommands
+          adHocItems={adHocItems}
+          hasListItems
+          onLaunchLoading={() => jest.fn()}
+        />
       );
     });
 
@@ -147,8 +193,27 @@ describe('<AdHocCommands />', () => {
       wrapper.find('Button[type="submit"]').prop('onClick')()
     );
     await waitForElement(wrapper, 'ContentEmpty', el => el.length === 0);
+
     // second step of wizard
 
+    await act(async () => {
+      wrapper
+        .find('input[aria-labelledby="check-action-item-2"]')
+        .simulate('change', { target: { checked: true } });
+    });
+
+    wrapper.update();
+
+    expect(
+      wrapper.find('CheckboxListItem[label="EE2"]').prop('isSelected')
+    ).toBe(true);
+
+    await act(async () =>
+      wrapper.find('Button[type="submit"]').prop('onClick')()
+    );
+    // third step of wizard
+    await waitForElement(wrapper, 'ContentEmpty', el => el.length === 0);
+
     await act(async () => {
       wrapper
         .find('input[aria-labelledby="check-action-item-4"]')
@@ -176,6 +241,7 @@ describe('<AdHocCommands />', () => {
       limit: 'Inventory 1 Org 0, Inventory 2 Org 0',
       module_name: 'command',
       verbosity: 1,
+      execution_environment: 2,
     });
   });
 
@@ -202,23 +268,52 @@ describe('<AdHocCommands />', () => {
                 ['foo', 'foo'],
               ],
             },
-            verbosity: { choices: [[1], [2]] },
+            verbosity: {
+              choices: [[1], [2]],
+            },
           },
         },
       },
     });
     CredentialTypesAPI.read.mockResolvedValue({
-      data: { results: [{ id: 1 }] },
+      data: {
+        results: [
+          {
+            id: 1,
+          },
+        ],
+      },
     });
     CredentialsAPI.read.mockResolvedValue({
       data: {
         results: credentials,
         count: 5,
       },
     });
+    ExecutionEnvironmentsAPI.read.mockResolvedValue({
+      data: {
+        results: [
+          {
+            id: 1,
+            name: 'EE1 1',
+            url: 'wwww.google.com',
+          },
+          {
+            id: 2,
+            name: 'EE2',
+            url: 'wwww.google.com',
+          },
+        ],
+        count: 2,
+      },
+    });
     await act(async () => {
       wrapper = mountWithContexts(
-        <AdHocCommands adHocItems={adHocItems} hasListItems />
+        <AdHocCommands
+          adHocItems={adHocItems}
+          hasListItems
+          onLaunchLoading={() => jest.fn()}
+        />
       );
     });
 
@@ -240,7 +335,10 @@ describe('<AdHocCommands />', () => {
         'command'
       );
       wrapper.find('input#module_args').simulate('change', {
-        target: { value: 'foo', name: 'module_args' },
+        target: {
+          value: 'foo',
+          name: 'module_args',
+        },
       });
       wrapper.find('AnsibleSelect[name="verbosity"]').prop('onChange')({}, 1);
     });
@@ -259,10 +357,36 @@ describe('<AdHocCommands />', () => {
 
     // second step of wizard
 
+    await act(async () => {
+      wrapper
+        .find('input[aria-labelledby="check-action-item-2"]')
+        .simulate('change', {
+          target: {
+            checked: true,
+          },
+        });
+    });
+
+    wrapper.update();
+
+    expect(
+      wrapper.find('CheckboxListItem[label="EE2"]').prop('isSelected')
+    ).toBe(true);
+
+    await act(async () =>
+      wrapper.find('Button[type="submit"]').prop('onClick')()
+    );
+    // third step of wizard
+    await waitForElement(wrapper, 'ContentEmpty', el => el.length === 0);
+
     await act(async () => {
       wrapper
         .find('input[aria-labelledby="check-action-item-4"]')
-        .simulate('change', { target: { checked: true } });
+        .simulate('change', {
+          target: {
+            checked: true,
+          },
+        });
     });
 
     wrapper.update();
@@ -291,7 +415,11 @@ describe('<AdHocCommands />', () => {
     });
     await act(async () => {
       wrapper = mountWithContexts(
-        <AdHocCommands adHocItems={adHocItems} hasListItems />
+        <AdHocCommands
+          adHocItems={adHocItems}
+          hasListItems
+          onLaunchLoading={() => jest.fn()}
+        />
       );
     });
     await waitForElement(wrapper, 'ContentLoading', el => el.length === 0);
@@ -312,7 +440,11 @@ describe('<AdHocCommands />', () => {
     });
     await act(async () => {
       wrapper = mountWithContexts(
-        <AdHocCommands adHocItems={adHocItems} hasListItems={false} />
+        <AdHocCommands
+          adHocItems={adHocItems}
+          hasListItems={false}
+          onLaunchLoading={() => jest.fn()}
+        />
       );
     });
     await waitForElement(wrapper, 'ContentLoading', el => el.length === 0);
@@ -335,7 +467,11 @@ describe('<AdHocCommands />', () => {
     );
     await act(async () => {
       wrapper = mountWithContexts(
-        <AdHocCommands adHocItems={adHocItems} hasListItems />
+        <AdHocCommands
+          adHocItems={adHocItems}
+          hasListItems
+          onLaunchLoading={() => jest.fn()}
+        />
       );
     });
     await act(async () => wrapper.find('button').prop('onClick')());

diff --git a/awx/ui_next/src/components/AdHocCommands/AdHocCommandsWizard.jsx b/awx/ui_next/src/components/AdHocCommands/AdHocCommandsWizard.jsx
@@ -10,6 +10,7 @@ import styled from 'styled-components';
 import Wizard from '../Wizard';
 import AdHocCredentialStep from './AdHocCredentialStep';
 import AdHocDetailsStep from './AdHocDetailsStep';
+import AdHocExecutionEnvironmentStep from './AdHocExecutionEnvironmentStep';
 
 const AlertText = styled.div`
   color: var(--pf-global--danger-color--200);
@@ -81,6 +82,14 @@ function AdHocCommandsWizard({
     {
       id: 2,
       key: 2,
+      name: t`Execution Environment`,
+      component: <AdHocExecutionEnvironmentStep />,
+      enableNext: true,
+      canJumpTo: currentStepId >= 2,
+    },
+    {
+      id: 3,
+      key: 3,
       name: i18n._(t`Machine credential`),
       component: (
         <AdHocCredentialStep
@@ -128,6 +137,7 @@ const FormikApp = withFormik({
       module_name: '',
       extra_vars: '---',
       job_type: 'run',
+      execution_environment: '',
     };
   },
 })(AdHocCommandsWizard);