foreman_remote_execution 9.1.0 → 10.0.1

data/webpack/JobWizard/__tests__/fixtures.js

@@ -323,6 +323,13 @@ export const jobInvocation = {
     created_in_katello: false,
   },
   inputs: {
-    'inputs[plain hidden]': 'test command',
+    'inputs[adv plain hidden]': {
+      advanced: true,
+      value: 'adv_test_command',
+    },
+    'inputs[plain hidden]': {
+      advanced: false,
+      value: 'test command',
+    },
   },
 };

data/webpack/JobWizard/__tests__/validation.test.js

@@ -154,6 +154,10 @@ describe('Job wizard validation', () => {
     });
 
     expect(screen.getByText(WIZARD_TITLES.schedule)).toBeDisabled();
+    expect(screen.getByText('Run on selected hosts')).toHaveAttribute(
+      'aria-disabled',
+      'true'
+    );
     expect(screen.getByText(WIZARD_TITLES.review)).toBeDisabled();
 
     await act(async () => {
@@ -162,6 +166,11 @@ describe('Job wizard validation', () => {
       });
     });
 
+    expect(screen.getByText('Run on selected hosts')).toBeEnabled();
+    expect(screen.getByText('Run on selected hosts')).toHaveAttribute(
+      'aria-disabled',
+      'false'
+    );
     expect(screen.getByText(WIZARD_TITLES.schedule)).toBeEnabled();
     expect(screen.getByText(WIZARD_TITLES.review)).toBeEnabled();
   });

data/webpack/JobWizard/steps/HostsAndInputs/HostPreviewModal.js

@@ -29,6 +29,7 @@ export const HostPreviewModal = ({ isOpen, setIsOpen, searchQuery }) => {
               variant="link"
               target="_blank"
               rel="noreferrer"
+              isInline
             >
               {host}
             </Button>
@@ -42,6 +43,7 @@ export const HostPreviewModal = ({ isOpen, setIsOpen, searchQuery }) => {
               variant="link"
               target="_blank"
               rel="noreferrer"
+              isInline
             >
               {sprintf(
                 __('...and %s more'),

data/webpack/JobWizard/steps/HostsAndInputs/SelectedChips.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Chip, ChipGroup, Button } from '@patternfly/react-core';
-import { translate as __ } from 'foremanReact/common/I18n';
+import { sprintf, translate as __ } from 'foremanReact/common/I18n';
 import { hostMethods } from '../../JobWizardConstants';
 
 const SelectedChip = ({ selected, setSelected, categoryName }) => {
@@ -10,19 +10,33 @@ const SelectedChip = ({ selected, setSelected, categoryName }) => {
       oldSelected.filter(({ id }) => id !== itemToRemove)
     );
   };
+  const NUM_CHIPS = 3;
   return (
-    <ChipGroup className="hosts-chip-group" categoryName={categoryName}>
-      {selected.map(({ name, id }, index) => (
-        <Chip
-          key={index}
-          id={`${categoryName}-${id}`}
-          onClick={() => deleteItem(id)}
-          closeBtnAriaLabel={`Close ${name}`}
-        >
-          {name}
-        </Chip>
-      ))}
-    </ChipGroup>
+    <>
+      <ChipGroup
+        className="hosts-chip-group"
+        categoryName={categoryName}
+        isClosable
+        closeBtnAriaLabel="Remove all"
+        collapsedText={sprintf(__('%s more'), selected.length - NUM_CHIPS)}
+        numChips={NUM_CHIPS}
+        onClick={() => {
+          setSelected(() => []);
+        }}
+      >
+        {selected.map(({ name, id }, index) => (
+          <Chip
+            key={index}
+            id={`${categoryName}-${id}`}
+            onClick={() => deleteItem(id)}
+            closeBtnAriaLabel={`Remove ${name}`}
+          >
+            {name}
+          </Chip>
+        ))}
+      </ChipGroup>
+      {selected.length > 0 && <br />}
+    </>
   );
 };
 
@@ -75,7 +89,7 @@ export const SelectedChips = ({
       />
       {showClear && (
         <Button variant="link" className="clear-chips" onClick={clearAll}>
-          {__('Clear filters')}
+          {__('Clear all filters')}
         </Button>
       )}
     </div>

data/webpack/JobWizard/steps/HostsAndInputs/__tests__/HostsAndInputs.test.js

@@ -80,7 +80,7 @@ describe('Hosts', () => {
     expect(screen.queryAllByText('host1')).toHaveLength(1);
     expect(screen.queryAllByText('host2')).toHaveLength(1);
     expect(screen.queryAllByText('host3')).toHaveLength(0);
-    const chip1 = screen.getByRole('button', { name: 'Close host1 host1' });
+    const chip1 = screen.getByRole('button', { name: 'Remove host1 host1' });
     await act(async () => {
       fireEvent.click(chip1);
     });
@@ -91,7 +91,7 @@ describe('Hosts', () => {
     expect(screen.queryAllByText('host_collection1')).toHaveLength(1);
 
     await act(async () => {
-      fireEvent.click(screen.getByText('Category and Template'));
+      fireEvent.click(screen.getByText('Category and template'));
     });
     await act(async () => {
       fireEvent.click(screen.getByText('Target hosts and inputs'));
@@ -100,7 +100,7 @@ describe('Hosts', () => {
     expect(screen.queryAllByText('host_group1')).toHaveLength(1);
 
     await act(async () => {
-      fireEvent.click(screen.getByText('Clear filters'));
+      fireEvent.click(screen.getByText('Clear all filters'));
     });
 
     expect(screen.queryAllByText('host2')).toHaveLength(0);

data/webpack/JobWizard/steps/ReviewDetails/ReviewDetails.test.js

@@ -0,0 +1,117 @@
+import React from 'react';
+import { Provider } from 'react-redux';
+import { render, fireEvent, screen, act } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+import * as APIHooks from 'foremanReact/common/hooks/API/APIHooks';
+import * as api from 'foremanReact/redux/API';
+
+import JobWizardPageRerun from '../../JobWizardPageRerun';
+import * as selectors from '../../JobWizardSelectors';
+import {
+  testSetup,
+  mockApi,
+  gqlMock,
+  jobInvocation,
+} from '../../__tests__/fixtures';
+
+const store = testSetup(selectors, api);
+mockApi(api);
+jest.spyOn(APIHooks, 'useAPI');
+APIHooks.useAPI.mockImplementation((action, url) => {
+  if (url === '/ui_job_wizard/job_invocation?id=57') {
+    return { response: jobInvocation, status: 'RESOLVED' };
+  }
+  return {};
+});
+jest.useFakeTimers();
+
+describe('ReviewDetails', () => {
+  it('should call goToStepByName function when StepButton is clicked', async () => {
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizardPageRerun
+            match={{
+              params: { id: '57' },
+            }}
+          />
+        </Provider>
+      </MockedProvider>
+    );
+
+    act(() => {
+      fireEvent.click(screen.getByText('Type of execution'));
+    });
+    act(() => {
+      fireEvent.click(screen.getByText('Future execution'));
+
+      jest.advanceTimersByTime(1000); // to handle pf4 date picker popover useTimer
+    });
+    act(() => {
+      fireEvent.click(screen.getByRole('button', { name: 'Future execution' }));
+      jest.advanceTimersByTime(1000); // to handle pf4 date picker popover useTimer
+    });
+
+    const newStartAtDate = '2030/03/12';
+    const newStartAtTime = '14:27';
+    const startsAtDateField = () =>
+      screen.getByLabelText('starts at datepicker');
+    const startsAtTimeField = () =>
+      screen.getByLabelText('starts at timepicker');
+
+    await act(async () => {
+      await fireEvent.change(startsAtDateField(), {
+        target: { value: newStartAtDate },
+      });
+      fireEvent.change(startsAtTimeField(), {
+        target: { value: newStartAtTime },
+      });
+      jest.advanceTimersByTime(1000);
+    });
+
+    act(() => {
+      fireEvent.click(screen.getByText('Review details'));
+    });
+    expect(screen.getAllByText('Review details')).toHaveLength(3);
+    fireEvent.click(
+      screen.getByText('Job template', {
+        selector: '.pf-c-button',
+      })
+    );
+    expect(screen.getAllByText('Category and template')).toHaveLength(3);
+
+    await act(async () => {
+      fireEvent.click(screen.getByText('Review details'));
+      jest.advanceTimersByTime(1000);
+    });
+    act(() => {
+      fireEvent.click(
+        screen.getByText('Target hosts', {
+          selector: '.pf-c-button',
+        })
+      );
+      jest.advanceTimersByTime(1000); // to handle pf4 date picker popover useTimer
+    });
+    expect(screen.getAllByText('Target hosts and inputs')).toHaveLength(3);
+    act(() => {
+      fireEvent.click(screen.getByText('Review details'));
+    });
+    act(() => {
+      fireEvent.click(
+        screen.getByText('Advanced fields', {
+          selector: '.pf-c-button',
+        })
+      );
+      jest.advanceTimersByTime(1000);
+    });
+    expect(screen.getAllByText('Advanced fields')).toHaveLength(3);
+
+    act(() => {
+      fireEvent.click(screen.getByText('Review details'));
+    });
+    act(() => {
+      fireEvent.click(screen.getByText('Recurrence'));
+    });
+    expect(screen.getAllByText('Schedule')).toHaveLength(3);
+  });
+});

data/webpack/JobWizard/steps/ReviewDetails/helpers.js

@@ -0,0 +1,43 @@
+import { translate as __, sprintf } from 'foremanReact/common/I18n';
+import { getWeekDays } from '../Schedule/RepeatWeek';
+import { repeatTypes } from '../../JobWizardConstants';
+
+export const parseEnd = (ends, isNeverEnds, repeatAmount) => {
+  if (isNeverEnds) {
+    return __('Never');
+  }
+  if (ends) {
+    const endsDate = new Date(ends);
+    return endsDate.toString();
+  }
+  return sprintf(__('After %s occurences'), repeatAmount);
+};
+
+export const parseRepeat = (repeatType, repeatData) => {
+  switch (repeatType) {
+    case repeatTypes.hourly:
+      return sprintf(__('Every hour at minute %s'), repeatData.minute);
+    case repeatTypes.daily:
+      return sprintf(__('Every day at %s'), repeatData.at);
+    case repeatTypes.weekly: {
+      const daysKeys = Object.keys(repeatData.daysOfWeek).filter(
+        k => repeatData.daysOfWeek[k]
+      );
+      const days = getWeekDays()
+        .filter((d, index) => index in daysKeys)
+        .join(', ');
+      return sprintf(__('Every week on %s at %s'), days, repeatData.at);
+    }
+    case repeatTypes.monthly:
+      return sprintf(
+        __('Every month on %s at %s'),
+        repeatData.days,
+        repeatData.at
+      );
+    case repeatTypes.cronline:
+      return `${__('Cron line')} - ${repeatData.cronline}`;
+
+    default:
+      return '';
+  }
+};

data/webpack/JobWizard/steps/ReviewDetails/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable max-lines */
 import React, { useEffect, useState } from 'react';
 import {
   Button,
@@ -5,12 +6,12 @@ import {
   DescriptionListTerm,
   DescriptionListGroup,
   DescriptionListDescription,
+  WizardContextConsumer,
 } from '@patternfly/react-core';
 import PropTypes from 'prop-types';
 import { useDispatch, useSelector } from 'react-redux';
-import EllipsisWithTooltip from 'react-ellipsis-with-tooltip';
 import { get } from 'foremanReact/redux/API';
-import { translate as __, sprintf } from 'foremanReact/common/I18n';
+import { translate as __ } from 'foremanReact/common/I18n';
 import {
   selectJobTemplates,
   selectHosts,
@@ -22,9 +23,12 @@ import {
   HOSTS_API,
   HOSTS_TO_PREVIEW_AMOUNT,
   WIZARD_TITLES,
+  SCHEDULE_TYPES,
 } from '../../JobWizardConstants';
 import { buildHostQuery } from '../HostsAndInputs/buildHostQuery';
 import { WizardTitle } from '../form/WizardTitle';
+import { parseEnd, parseRepeat } from './helpers';
+import { HostPreviewModal } from '../HostsAndInputs/HostPreviewModal';
 
 const ReviewDetails = ({
   jobCategory,
@@ -34,7 +38,20 @@ const ReviewDetails = ({
   templateValues,
   selectedTargets,
   hostsSearchQuery,
+  goToStepByName,
 }) => {
+  // eslint-disable-next-line react/prop-types
+  const StepButton = ({ stepName, children }) => (
+    <Button
+      variant="link"
+      isInline
+      onClick={() => {
+        goToStepByName(stepName);
+      }}
+    >
+      {children}
+    </Button>
+  );
   const dispatch = useDispatch();
   useEffect(() => {
     dispatch(
@@ -58,6 +75,7 @@ const ReviewDetails = ({
   const hosts = useSelector(selectHosts);
 
   const hostsCount = useSelector(selectHostCount);
+  const [hostPreviewOpen, setHostPreviewOpen] = useState(false);
   const stringHosts = () => {
     if (hosts.length === 0) {
       return __('No Target Hosts');
@@ -65,22 +83,57 @@ const ReviewDetails = ({
     if (hosts.length === 1 || hosts.length === 2) {
       return hosts.join(', ');
     }
-    return `${hosts[0]}, ${hosts[1]} ${sprintf(
-      __(', and %s more'),
-      hostsCount - 2
-    )}`;
+    return (
+      <div>
+        {hostsCount} {__('hosts')}{' '}
+        <Button
+          variant="link"
+          isInline
+          onClick={() => setHostPreviewOpen(true)}
+        >
+          {__('view host names')}
+        </Button>
+      </div>
+    );
   };
   const [isAdvancedShown, setIsAdvancedShown] = useState(false);
   const detailsFirstHalf = [
-    { label: __('Job category'), value: jobCategory },
-    { label: __('Job template'), value: jobTemplate },
-    { label: __('Target hosts'), value: stringHosts() },
+    {
+      label: (
+        <StepButton stepName={WIZARD_TITLES.categoryAndTemplate}>
+          {__('Job category')}
+        </StepButton>
+      ),
+      value: jobCategory,
+    },
+    {
+      label: (
+        <StepButton stepName={WIZARD_TITLES.categoryAndTemplate}>
+          {__('Job template')}
+        </StepButton>
+      ),
+      value: jobTemplate,
+    },
+    {
+      label: (
+        <StepButton stepName={WIZARD_TITLES.hostsAndInputs}>
+          {__('Target hosts')}
+        </StepButton>
+      ),
+      value: stringHosts(),
+    },
     ...templateInputs.map(({ name }) => ({
-      label: name,
+      label: (
+        <StepButton stepName={WIZARD_TITLES.hostsAndInputs}>{name}</StepButton>
+      ),
       value: templateValues[name],
     })),
     {
-      label: __('Advanced fields'),
+      label: (
+        <StepButton stepName={WIZARD_TITLES.advanced}>
+          {__('Advanced fields')}
+        </StepButton>
+      ),
       value: isAdvancedShown ? (
         <Button
           variant="link"
@@ -107,15 +160,98 @@ const ReviewDetails = ({
 
   const detailsSecondHalf = [
     {
-      label: __('Schedule type'),
+      label: (
+        <StepButton stepName={WIZARD_TITLES.typeOfExecution}>
+          {__('Schedule type')}
+        </StepButton>
+      ),
       value: scheduleValue.scheduleType,
     },
     {
-      label: __('Recurrence'),
+      label: (
+        <StepButton
+          stepName={
+            scheduleValue.scheduleType === SCHEDULE_TYPES.RECURRING
+              ? SCHEDULE_TYPES.RECURRING
+              : WIZARD_TITLES.typeOfExecution
+          }
+        >
+          {__('Recurrence')}
+        </StepButton>
+      ),
       value: scheduleValue.repeatType,
     },
+    scheduleValue.scheduleType === SCHEDULE_TYPES.FUTURE &&
+      scheduleValue.startsAt && {
+        label: (
+          <StepButton
+            stepName={
+              scheduleValue.scheduleType === SCHEDULE_TYPES.RECURRING
+                ? SCHEDULE_TYPES.RECURRING
+                : SCHEDULE_TYPES.FUTURE
+            }
+          >
+            {__('Starts at')}
+          </StepButton>
+        ),
+        value: new Date(scheduleValue.startsAt).toString(),
+      },
+    scheduleValue.scheduleType === SCHEDULE_TYPES.FUTURE &&
+      scheduleValue.startsBefore && {
+        label: (
+          <StepButton stepName={SCHEDULE_TYPES.FUTURE}>
+            {__('Starts Before')}
+          </StepButton>
+        ),
+        value: new Date(scheduleValue.startsBefore).toString(),
+      },
+
+    scheduleValue.scheduleType === SCHEDULE_TYPES.RECURRING && {
+      label: (
+        <StepButton stepName={SCHEDULE_TYPES.RECURRING}>
+          {__('Starts')}
+        </StepButton>
+      ),
+      value: scheduleValue.isFuture
+        ? new Date(scheduleValue.startsAt).toString()
+        : __('Now'),
+    },
+
+    scheduleValue.scheduleType === SCHEDULE_TYPES.RECURRING && {
+      label: (
+        <StepButton stepName={SCHEDULE_TYPES.RECURRING}>
+          {__('Repeats')}
+        </StepButton>
+      ),
+      value: parseRepeat(scheduleValue.repeatType, scheduleValue.repeatData),
+    },
+    scheduleValue.scheduleType === SCHEDULE_TYPES.RECURRING && {
+      label: (
+        <StepButton stepName={SCHEDULE_TYPES.RECURRING}>
+          {__('Ends')}
+        </StepButton>
+      ),
+      value: parseEnd(
+        scheduleValue.ends,
+        scheduleValue.isNeverEnds,
+        scheduleValue.repeatAmount
+      ),
+    },
+
+    scheduleValue.scheduleType === SCHEDULE_TYPES.RECURRING && {
+      label: (
+        <StepButton stepName={SCHEDULE_TYPES.RECURRING}>
+          {__('Purpose')}
+        </StepButton>
+      ),
+      value: scheduleValue.purpose,
+    },
     {
-      label: __('Type of query'),
+      label: (
+        <StepButton stepName={WIZARD_TITLES.typeOfExecution}>
+          {__('Type of query')}
+        </StepButton>
+      ),
       value: scheduleValue.isTypeStatic
         ? __('Static query')
         : __('Dynamic query'),
@@ -144,6 +280,11 @@ const ReviewDetails = ({
 
   return (
     <>
+      <HostPreviewModal
+        isOpen={hostPreviewOpen}
+        setIsOpen={setHostPreviewOpen}
+        searchQuery={buildHostQuery(selectedTargets, hostsSearchQuery)}
+      />
       <WizardTitle
         title={WIZARD_TITLES.review}
         className="advanced-fields-title"
@@ -153,7 +294,7 @@ const ReviewDetails = ({
           <DescriptionListGroup key={index}>
             <DescriptionListTerm>{label}</DescriptionListTerm>
             <DescriptionListDescription>
-              <EllipsisWithTooltip>{value || ''}</EllipsisWithTooltip>
+              {value || ''}
             </DescriptionListDescription>
           </DescriptionListGroup>
         ))}
@@ -162,7 +303,7 @@ const ReviewDetails = ({
             <DescriptionListGroup key={index} className="advanced-fields">
               <DescriptionListTerm>{label}</DescriptionListTerm>
               <DescriptionListDescription>
-                <EllipsisWithTooltip>{value || ''}</EllipsisWithTooltip>
+                {value || ''}
               </DescriptionListDescription>
             </DescriptionListGroup>
           ))}
@@ -170,7 +311,7 @@ const ReviewDetails = ({
           <DescriptionListGroup key={index}>
             <DescriptionListTerm>{label}</DescriptionListTerm>
             <DescriptionListDescription>
-              <EllipsisWithTooltip>{value || ''}</EllipsisWithTooltip>
+              {value || ''}
             </DescriptionListDescription>
           </DescriptionListGroup>
         ))}
@@ -187,7 +328,17 @@ ReviewDetails.propTypes = {
   templateValues: PropTypes.object.isRequired,
   selectedTargets: PropTypes.object.isRequired,
   hostsSearchQuery: PropTypes.string.isRequired,
+  goToStepByName: PropTypes.func.isRequired,
 };
 
 ReviewDetails.defaultProps = { jobTemplateID: null };
-export default ReviewDetails;
+
+const WrappedReviewDetails = props => (
+  <WizardContextConsumer>
+    {({ goToStepByName }) => (
+      <ReviewDetails goToStepByName={goToStepByName} {...props} />
+    )}
+  </WizardContextConsumer>
+);
+
+export default WrappedReviewDetails;

data/webpack/JobWizard/steps/Schedule/QueryType.js

@@ -31,7 +31,7 @@ export const QueryType = ({ isTypeStatic, setIsTypeStatic }) => (
         id="query-type-dynamic"
         label={__('Dynamic query')}
         body={__(
-          "evaluates just before the execution is started, so if it's planed in future, targeted hosts set may change before it"
+          "evaluates just before the execution is started, so if it's planned in future, targeted hosts set may change before it"
         )}
       />
     </FormGroup>

data/webpack/JobWizard/steps/Schedule/RepeatHour.js

@@ -47,7 +47,6 @@ export const RepeatHour = ({ repeatData, setRepeatData }) => {
         }}
         isOpen={minuteOpen}
         width={125}
-        menuAppendTo={() => document.querySelector('.pf-c-form.schedule-tab')}
         toggleAriaLabel="select minute toggle"
         validated={
           isValidMinute(minute)

data/webpack/JobWizard/steps/Schedule/RepeatWeek.js

@@ -5,7 +5,7 @@ import { translate as __, documentLocale } from 'foremanReact/common/I18n';
 import { RepeatDaily } from './RepeatDaily';
 import { noop } from '../../../helpers';
 
-const getWeekDays = () => {
+export const getWeekDays = () => {
   const locale = documentLocale().replace(/-/g, '_');
   const baseDate = new Date(Date.UTC(2017, 0, 1)); // just a Sunday
   const weekDays = [];

data/webpack/JobWizard/steps/Schedule/__tests__/Schedule.test.js

@@ -139,7 +139,7 @@ describe('Schedule', () => {
     });
 
     act(() => {
-      fireEvent.click(screen.getByText('Category and Template'));
+      fireEvent.click(screen.getByText('Category and template'));
     });
     act(() => {
       fireEvent.click(screen.getByRole('button', { name: 'Future execution' }));
@@ -246,7 +246,7 @@ describe('Schedule', () => {
     });
 
     act(() => {
-      fireEvent.click(screen.getByText('Category and Template'));
+      fireEvent.click(screen.getByText('Category and template'));
     });
     act(() => {
       fireEvent.click(
@@ -294,7 +294,7 @@ describe('Schedule', () => {
     await act(async () => {
       fireEvent.click(screen.getByText('Cronline'));
     });
-    const newCronline = '1 2';
+    const newCronline = '1 2 3 4 5';
     const cronline = screen.getByLabelText('cronline');
     expect(cronline.value).toBe('');
     await act(async () => {
@@ -306,9 +306,9 @@ describe('Schedule', () => {
     expect(screen.getByText('Review details').disabled).toBeFalsy();
 
     await act(async () => {
-      fireEvent.click(screen.getByText('Category and Template'));
+      fireEvent.click(screen.getByText('Category and template'));
     });
-    expect(screen.getAllByText('Category and Template')).toHaveLength(3);
+    expect(screen.getAllByText('Category and template')).toHaveLength(3);
 
     await act(async () => {
       fireEvent.click(
@@ -319,6 +319,20 @@ describe('Schedule', () => {
     expect(screen.queryAllByText('Recurring execution')).toHaveLength(3);
     expect(cronline.value).toBe(newCronline);
 
+    await act(async () => {
+      fireEvent.click(screen.getByText('Review details'));
+    });
+    expect(screen.queryAllByText('Review details')).toHaveLength(3);
+    expect(screen.getAllByText('Cron line - 1 2 3 4 5')).toHaveLength(1);
+
+    await act(async () => {
+      fireEvent.click(
+        screen.getByRole('button', { name: 'Recurring execution' })
+      );
+      jest.runAllTimers();
+    });
+    expect(screen.queryAllByText('Recurring execution')).toHaveLength(3);
+
     fireEvent.click(screen.getByText('Cronline'));
     await act(async () => {
       fireEvent.click(screen.getByText('Monthly'));