foreman_remote_execution 15.0.2 → 16.0.0

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

@@ -59,26 +59,28 @@ describe('Job wizard fill', () => {
         <JobWizard />
       </Provider>
     );
-    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-disabled')).toHaveLength(
-      5
-    );
+    expect(
+      wrapper.find('.pf-v5-c-wizard__nav-link.pf-m-disabled')
+    ).toHaveLength(5);
     selectors.selectJobCategoriesStatus.mockImplementation(() => 'RESOLVED');
     expect(store.getActions()).toMatchSnapshot('initial');
     selectors.selectJobTemplate.mockRestore();
     jest.spyOn(selectors, 'selectJobTemplate');
     selectors.selectJobTemplate.mockImplementation(() => jobTemplate);
-    wrapper.find('.pf-c-button.pf-c-select__toggle-button').simulate('click');
+    wrapper
+      .find('.pf-v5-c-button.pf-v5-c-select__toggle-button')
+      .simulate('click');
     await act(async () => {
       await wrapper
-        .find('.pf-c-select__menu-item')
+        .find('.pf-v5-c-select__menu-item')
         .first()
         .simulate('click');
     });
     expect(store.getActions().slice(-1)).toMatchSnapshot('select template');
     wrapper.update();
-    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-disabled')).toHaveLength(
-      0
-    );
+    expect(
+      wrapper.find('.pf-v5-c-wizard__nav-link.pf-m-disabled')
+    ).toHaveLength(0);
   });
 
   it('have all steps', async () => {

data/webpack/JobWizard/steps/AdvancedFields/DescriptionField.js

@@ -1,7 +1,15 @@
 import React, { useState, useEffect, useCallback } from 'react';
 import { useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
-import { FormGroup, TextInput, Tooltip, Button } from '@patternfly/react-core';
+import {
+  FormGroup,
+  TextInput,
+  Tooltip,
+  Button,
+  FormHelperText,
+  HelperText,
+  HelperTextItem,
+} from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import {
   selectTemplateInputs,
@@ -55,18 +63,6 @@ export const DescriptionField = ({
         <ResetDefault setValue={setValue} defaultValue={defaultValue} />
       }
       fieldId="description"
-      helperText={
-        <Button
-          ouiaId="description-preview-button"
-          variant="link"
-          isInline
-          onClick={togglePreview}
-        >
-          {isPreview
-            ? __('Edit job description template')
-            : __('Preview job description')}
-        </Button>
-      }
     >
       {isPreview ? (
         <Tooltip content={generatedDesc}>
@@ -89,9 +85,25 @@ export const DescriptionField = ({
           autoComplete="description"
           id="description"
           value={value}
-          onChange={newValue => setValue(newValue)}
+          onChange={(_event, newValue) => setValue(newValue)}
         />
       )}
+      <FormHelperText>
+        <HelperText>
+          <HelperTextItem>
+            <Button
+              ouiaId="description-preview-button"
+              variant="link"
+              isInline
+              onClick={togglePreview}
+            >
+              {isPreview
+                ? __('Edit job description template')
+                : __('Preview job description')}
+            </Button>
+          </HelperTextItem>
+        </HelperText>
+      </FormHelperText>
     </FormGroup>
   );
 };

data/webpack/JobWizard/steps/AdvancedFields/Fields.js

@@ -25,7 +25,7 @@ export const EffectiveUserField = ({ value, setValue, defaultValue }) => (
       id="effective-user"
       type="text"
       value={value}
-      onChange={newValue => setValue(newValue)}
+      onChange={(_event, newValue) => setValue(newValue)}
     />
   </FormGroup>
 );
@@ -94,7 +94,7 @@ export const PasswordField = ({ value, setValue }) => (
       type="password"
       placeholder="*****"
       value={value}
-      onChange={newValue => setValue(newValue)}
+      onChange={(_event, newValue) => setValue(newValue)}
     />
   </FormGroup>
 );
@@ -118,7 +118,7 @@ export const KeyPassphraseField = ({ value, setValue }) => (
       type="password"
       placeholder="*****"
       value={value}
-      onChange={newValue => setValue(newValue)}
+      onChange={(_event, newValue) => setValue(newValue)}
     />
   </FormGroup>
 );
@@ -142,7 +142,7 @@ export const EffectiveUserPasswordField = ({ value, setValue }) => (
       type="password"
       placeholder="*****"
       value={value}
-      onChange={newValue => setValue(newValue)}
+      onChange={(_event, newValue) => setValue(newValue)}
     />
   </FormGroup>
 );
@@ -228,7 +228,7 @@ export const SSHUserField = ({ value, setValue, defaultValue }) => (
       id="ssh-user"
       type="text"
       value={value}
-      onChange={newValue => setValue(newValue)}
+      onChange={(_event, newValue) => setValue(newValue)}
     />
   </FormGroup>
 );

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

@@ -44,18 +44,20 @@ describe('AdvancedFields', () => {
       </MockedProvider>
     );
     // setup
-    wrapper.find('.pf-c-button.pf-c-select__toggle-button').simulate('click');
     wrapper
-      .find('.pf-c-select__menu-item')
+      .find('.pf-v5-c-button.pf-v5-c-select__toggle-button')
+      .simulate('click');
+    wrapper
+      .find('.pf-v5-c-select__menu-item')
       .first()
       .simulate('click');
 
     // test
-    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-disabled')).toHaveLength(
-      0
-    );
+    expect(
+      wrapper.find('.pf-v5-c-wizard__nav-link.pf-m-disabled')
+    ).toHaveLength(0);
     wrapper
-      .find('.pf-c-wizard__nav-link')
+      .find('.pf-v5-c-wizard__nav-link')
       .at(2)
       .simulate('click'); // Advanced step
 
@@ -64,7 +66,7 @@ describe('AdvancedFields', () => {
     });
     const effectiveUserInput = () => wrapper.find('input#effective-user');
     const advancedTemplateInput = () =>
-      wrapper.find('.pf-c-form__group-control textarea');
+      wrapper.find('.pf-v5-c-form__group-control textarea');
     const effectiveUesrValue = 'effective user new value';
     const advancedTemplateInputValue = 'advanced input new value';
     effectiveUserInput().getDOMNode().value = effectiveUesrValue;
@@ -79,15 +81,15 @@ describe('AdvancedFields', () => {
     );
 
     wrapper
-      .find('.pf-c-wizard__nav-link')
+      .find('.pf-v5-c-wizard__nav-link')
       .at(1)
       .simulate('click');
 
-    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-current').text()).toEqual(
-      'Target hosts and inputs'
-    );
+    expect(
+      wrapper.find('.pf-v5-c-wizard__nav-link.pf-m-current').text()
+    ).toEqual('Target hosts and inputs');
     wrapper
-      .find('.pf-c-wizard__nav-link')
+      .find('.pf-v5-c-wizard__nav-link')
       .at(2)
       .simulate('click'); // Advanced step
 

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import URI from 'urijs';
-import { SelectVariant } from '@patternfly/react-core';
+import { SelectVariant } from '@patternfly/react-core/deprecated';
 import { get } from 'foremanReact/redux/API';
 import { selectResponse, selectIsLoading } from '../../JobWizardSelectors';
 import { SearchSelect } from '../form/SearchSelect';

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

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useQuery } from '@apollo/client';
-import { SelectVariant } from '@patternfly/react-core';
+import { SelectVariant } from '@patternfly/react-core/deprecated';
 import {
   useForemanOrganization,
   useForemanLocation,

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

@@ -43,7 +43,7 @@ describe('Hosts', () => {
     await act(async () => {
       fireEvent.click(
         screen.getByText('host1', {
-          selector: '.pf-c-select__menu-item',
+          selector: '.pf-v5-c-select__menu-item',
         })
       );
       fireEvent.blur(select('hosts'));
@@ -56,7 +56,7 @@ describe('Hosts', () => {
       fireEvent.click(screen.getByText('host2'));
     });
     fireEvent.click(
-      screen.getByText('Hosts', { selector: '.pf-c-select__toggle-text' })
+      screen.getByText('Hosts', { selector: '.pf-v5-c-select__toggle-text' })
     );
     await act(async () => {
       fireEvent.click(screen.getByText('Host groups'));
@@ -71,7 +71,7 @@ describe('Hosts', () => {
     await act(async () => {
       fireEvent.click(
         screen.getByText('Host groups', {
-          selector: '.pf-c-select__toggle-text',
+          selector: '.pf-v5-c-select__toggle-text',
         })
       );
     });
@@ -128,7 +128,7 @@ describe('Hosts', () => {
     expect(screen.queryAllByText('Hosts')).toHaveLength(1);
     await act(async () => {
       fireEvent.click(
-        screen.getByText('Hosts', { selector: '.pf-c-select__toggle-text' })
+        screen.getByText('Hosts', { selector: '.pf-v5-c-select__toggle-text' })
       );
     });
     expect(screen.queryAllByText('Host groups')).toHaveLength(1);
@@ -138,7 +138,7 @@ describe('Hosts', () => {
     await act(async () => {
       fireEvent.click(
         // Close the select
-        screen.getByText('Hosts', { selector: '.pf-c-select__toggle-text' })
+        screen.getByText('Hosts', { selector: '.pf-v5-c-select__toggle-text' })
       );
     });
   });

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

@@ -8,6 +8,9 @@ import {
   InputGroup,
   Text,
   Spinner,
+  InputGroupItem,
+  FormHelperText,
+  HelperText,
 } from '@patternfly/react-core';
 import PropTypes from 'prop-types';
 import { useSelector, useDispatch } from 'react-redux';
@@ -145,43 +148,40 @@ const HostsAndInputs = ({
         />
       )}
       <Form>
-        <FormGroup
-          fieldId="host_selection"
-          id="host-selection"
-          helperTextInvalid={errorText}
-          validated={isError ? 'error' : 'default'}
-        >
+        <FormGroup fieldId="host_selection" id="host-selection">
           <InputGroup onBlur={() => setWasFocus(true)}>
-            <SelectField
-              isRequired
-              className="target-method-select"
-              toggleIcon={<FilterIcon />}
-              fieldId="host_methods"
-              options={Object.values(hostMethods).filter(method => {
-                if (method === hostMethods.hostCollections && !withKatello) {
-                  return false;
-                }
-                return true;
-              })}
-              setValue={val => {
-                setHostMethod(val);
-                if (val === hostMethods.searchQuery) {
-                  setErrorText(__('Please enter a search query'));
-                }
-                if (val === hostMethods.hosts) {
-                  setErrorText(__('Please select at least one host'));
-                }
-                if (val === hostMethods.hostCollections) {
-                  setErrorText(
-                    __('Please select at least one host collection')
-                  );
-                }
-                if (val === hostMethods.hostGroups) {
-                  setErrorText(__('Please select at least one host group'));
-                }
-              }}
-              value={hostMethod}
-            />
+            <InputGroupItem>
+              <SelectField
+                isRequired
+                className="target-method-select"
+                toggleIcon={<FilterIcon />}
+                fieldId="host_methods"
+                options={Object.values(hostMethods).filter(method => {
+                  if (method === hostMethods.hostCollections && !withKatello) {
+                    return false;
+                  }
+                  return true;
+                })}
+                setValue={val => {
+                  setHostMethod(val);
+                  if (val === hostMethods.searchQuery) {
+                    setErrorText(__('Please enter a search query'));
+                  }
+                  if (val === hostMethods.hosts) {
+                    setErrorText(__('Please select at least one host'));
+                  }
+                  if (val === hostMethods.hostCollections) {
+                    setErrorText(
+                      __('Please select at least one host collection')
+                    );
+                  }
+                  if (val === hostMethods.hostGroups) {
+                    setErrorText(__('Please select at least one host group'));
+                  }
+                }}
+                value={hostMethod}
+              />
+            </InputGroupItem>
             {hostMethod === hostMethods.searchQuery && (
               <HostSearch
                 setValue={setHostsSearchQuery}
@@ -220,6 +220,11 @@ const HostsAndInputs = ({
               />
             )}
           </InputGroup>
+          {isError && (
+            <FormHelperText>
+              <HelperText>{errorText}</HelperText>
+            </FormHelperText>
+          )}
         </FormGroup>
         <SelectedChips
           selectedHosts={selectedHosts}

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

@@ -76,7 +76,7 @@ describe('ReviewDetails', () => {
     expect(screen.getAllByText('Review details')).toHaveLength(3);
     fireEvent.click(
       screen.getByText('Job template', {
-        selector: '.pf-c-button',
+        selector: '.pf-v5-c-button',
       })
     );
     expect(screen.getAllByText('Category and template')).toHaveLength(3);
@@ -88,7 +88,7 @@ describe('ReviewDetails', () => {
     act(() => {
       fireEvent.click(
         screen.getByText('Target hosts', {
-          selector: '.pf-c-button',
+          selector: '.pf-v5-c-button',
         })
       );
       jest.advanceTimersByTime(1000); // to handle pf4 date picker popover useTimer
@@ -100,7 +100,7 @@ describe('ReviewDetails', () => {
     act(() => {
       fireEvent.click(
         screen.getByText('Advanced fields', {
-          selector: '.pf-c-button',
+          selector: '.pf-v5-c-button',
         })
       );
       jest.advanceTimersByTime(1000);

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

@@ -6,8 +6,8 @@ import {
   DescriptionListTerm,
   DescriptionListGroup,
   DescriptionListDescription,
-  WizardContextConsumer,
 } from '@patternfly/react-core';
+import { WizardContextConsumer } from '@patternfly/react-core/deprecated';
 import PropTypes from 'prop-types';
 import { useDispatch, useSelector } from 'react-redux';
 import { get } from 'foremanReact/redux/API';

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

@@ -18,7 +18,7 @@ export const PurposeField = ({ purpose, setPurpose }) => (
       aria-label="purpose"
       type="text"
       value={purpose}
-      onChange={newPurpose => {
+      onChange={(_event, newPurpose) => {
         setPurpose(newPurpose);
       }}
     />

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

@@ -72,7 +72,7 @@ export const RepeatCron = ({ repeatData, setRepeatData, setValid }) => {
         placeholder="* * * * *"
         type="text"
         value={cronline || ''}
-        onChange={newTime => {
+        onChange={(_event, newTime) => {
           setRepeatData({ cronline: newTime });
         }}
       />

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

@@ -20,7 +20,7 @@ export const RepeatDaily = ({ repeatData, setRepeatData, setValid }) => {
         className="time-picker"
         time={repeatData.at}
         placeholder="hh:mm"
-        onChange={newTime => {
+        onChange={(e, newTime) => {
           setRepeatData({ ...repeatData, at: newTime });
         }}
         is24Hour

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

@@ -2,13 +2,15 @@ import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import {
   FormGroup,
-  Select,
-  SelectOption,
-  SelectVariant,
   Alert,
   AlertActionCloseButton,
   ValidatedOptions,
 } from '@patternfly/react-core';
+import {
+  Select,
+  SelectOption,
+  SelectVariant,
+} from '@patternfly/react-core/deprecated';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { helpLabel } from '../form/FormHelpers';
 
@@ -43,7 +45,7 @@ export const RepeatHour = ({ repeatData, setRepeatData }) => {
           setMinuteOpen(false);
         }}
         selections={`${minute}` || ''}
-        onToggle={toggle => {
+        onToggle={(_event, toggle) => {
           setMinuteOpen(toggle);
         }}
         isOpen={minuteOpen}

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

@@ -26,7 +26,7 @@ export const RepeatMonth = ({ repeatData, setRepeatData, setValid }) => {
           placeholder="1,2..."
           type="text"
           value={repeatData.days || ''}
-          onChange={newTime => {
+          onChange={(_event, newTime) => {
             setRepeatData({ ...repeatData, days: newTime });
           }}
         />

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

@@ -32,7 +32,7 @@ export const RepeatWeek = ({ repeatData, setRepeatData, setValid }) => {
     return () => setValid(true);
   }, [setValid, daysOfWeek, at]);
   const days = getWeekDays();
-  const handleChangeDays = (checked, { target: { name } }) => {
+  const handleChangeDays = ({ target: { name } }, checked) => {
     setRepeatData({
       ...repeatData,
       daysOfWeek: { ...repeatData.daysOfWeek, [name]: checked },

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

@@ -4,7 +4,9 @@ import {
   FormGroup,
   Form,
   Button,
-  ValidatedOptions,
+  FormHelperText,
+  HelperText,
+  HelperTextItem,
 } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { DateTimePicker } from '../form/DateTimePicker';
@@ -85,8 +87,6 @@ export const ScheduleFuture = ({
             ),
             'start-before-date'
           )}
-          validated={error ? ValidatedOptions.error : ValidatedOptions.noval}
-          helperTextInvalid={error}
         >
           <DateTimePicker
             ariaLabel="starts before"
@@ -112,6 +112,13 @@ export const ScheduleFuture = ({
           >
             {__('Clear input')}
           </Button>
+          {error && (
+            <FormHelperText>
+              <HelperText>
+                <HelperTextItem variant="error">{error}</HelperTextItem>
+              </HelperText>
+            </FormHelperText>
+          )}
         </FormGroup>
       </Form>
     </>

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

@@ -5,8 +5,10 @@ import {
   FormGroup,
   Radio,
   TextInput,
-  ValidatedOptions,
   Divider,
+  FormHelperText,
+  HelperText,
+  HelperTextItem,
 } from '@patternfly/react-core';
 import { ExclamationCircleIcon } from '@patternfly/react-icons';
 import { translate as __ } from 'foremanReact/common/I18n';
@@ -86,7 +88,7 @@ export const ScheduleRecurring = ({
       <WizardTitle title={SCHEDULE_TYPES.RECURRING} />
       <Form className="schedule-tab">
         <FormGroup label={__('Starts')} fieldId="schedule-starts">
-          <div className="pf-c-form">
+          <div className="pf-v5-cform">
             <FormGroup fieldId="schedule-starts-now">
               <Radio
                 ouiaId="schedule-start-now"
@@ -162,7 +164,7 @@ export const ScheduleRecurring = ({
         />
         <Divider component="div" />
         <FormGroup label={__('Ends')} fieldId="schedule-ends">
-          <div className="pf-c-form">
+          <div className="pf-v5-cform">
             <FormGroup fieldId="schedule-ends-never">
               <Radio
                 ouiaId="schedule-never-ends"
@@ -180,14 +182,7 @@ export const ScheduleRecurring = ({
                 label={__('Never')}
               />
             </FormGroup>
-            <FormGroup
-              fieldId="ends-on-date"
-              validated={
-                validEnd ? ValidatedOptions.noval : ValidatedOptions.error
-              }
-              helperTextInvalid={__('End time needs to be after start time')}
-              helperTextInvalidIcon={<ExclamationCircleIcon />}
-            >
+            <FormGroup fieldId="ends-on-date">
               <Radio
                 ouiaId="schedule-ends-on-date"
                 isChecked={!!ends}
@@ -219,6 +214,18 @@ export const ScheduleRecurring = ({
                   </div>
                 }
               />
+              {!validEnd && (
+                <FormHelperText>
+                  <HelperText>
+                    <HelperTextItem
+                      icon={<ExclamationCircleIcon />}
+                      variant="error"
+                    >
+                      {__('End time needs to be after start time')}
+                    </HelperTextItem>
+                  </HelperText>
+                </FormHelperText>
+              )}
             </FormGroup>
             <FormGroup fieldId="ends-after">
               <Radio
@@ -238,21 +245,24 @@ export const ScheduleRecurring = ({
                 label={
                   <div className="schedule-radio-wrapper">
                     <div className="schedule-radio-title">{__('After')}</div>
-                    <FormGroup
-                      helperTextInvalid={__(
-                        'Repeat amount can only be a positive number'
-                      )}
-                      validated={repeatValidated}
-                      className="schedule-radio-repeat-text"
-                    >
+                    <FormGroup className="schedule-radio-repeat-text">
                       <TextInput
                         ouiaId="repeat-amount"
                         id="repeat-amount"
                         value={repeatAmount || ''}
                         type="number"
-                        onChange={handleRepeatInputChange}
+                        onChange={(_event, newValue) =>
+                          handleRepeatInputChange(newValue)
+                        }
                         isDisabled={!(repeatAmount === 0 || !!repeatAmount)}
                       />
+                      {repeatValidated === 'error' && (
+                        <HelperText>
+                          <HelperTextItem variant="error">
+                            {__('Repeat amount can only be a positive number')}
+                          </HelperTextItem>
+                        </HelperText>
+                      )}
                     </FormGroup>
                     <div className="schedule-radio-occurences">
                       {__('occurences')}

data/webpack/JobWizard/steps/form/DateTimePicker.js

@@ -75,7 +75,7 @@ export const DateTimePicker = ({
     }
   };
 
-  const onTimeChange = newTime => {
+  const onTimeChange = (e, newTime) => {
     if (!newTime.length && allowEmpty) {
       const parsedNewTime = new Date(`${formattedDate} 00:00`);
       setDateTime(formatDateTime(parsedNewTime));

data/webpack/JobWizard/steps/form/FormHelpers.js

@@ -1,8 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Popover, Button } from '@patternfly/react-core';
+import { Popover, Button, Icon } from '@patternfly/react-core';
 import { HelpIcon } from '@patternfly/react-icons';
 import { translate as __ } from 'foremanReact/common/I18n';
+import styles from '@patternfly/react-styles/css/components/Form/form';
 
 export const helpLabel = (text, id) => {
   if (!text) return null;
@@ -12,9 +13,11 @@ export const helpLabel = (text, id) => {
         type="button"
         aria-label={__('open-help-tooltip-button')}
         onClick={e => e.preventDefault()}
-        className="pf-c-form__group-label-help"
+        className={styles.formGroupLabelHelp}
       >
-        <HelpIcon noVerticalAlign />
+        <Icon isInline>
+          <HelpIcon />
+        </Icon>
       </button>
     </Popover>
   );
@@ -31,7 +34,7 @@ export const ResetDefault = ({ setValue, defaultValue }) =>
       className="reset-default"
       component="a"
       variant="link"
-      isSmall
+      size="sm"
       onClick={() => setValue(defaultValue)}
     >
       {__('Reset to default')}