foreman_remote_execution 4.7.0 → 5.0.2

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

@@ -5,6 +5,7 @@ import * as api from 'foremanReact/redux/API';
 import { JobWizard } from '../../JobWizard';
 import * as selectors from '../../JobWizardSelectors';
 import { testSetup, mockApi } from '../../__tests__/fixtures';
+import { WIZARD_TITLES } from '../../JobWizardConstants';
 
 const store = testSetup(selectors, api);
 mockApi(api);
@@ -32,7 +33,7 @@ describe('Category And Template', () => {
     await act(async () => {
       await fireEvent.click(screen.getByText('Puppet'));
     });
-    fireEvent.click(screen.getAllByText('Category and Template')[0]); // to remove focus
+    fireEvent.click(screen.getAllByText(WIZARD_TITLES.categoryAndTemplate)[0]); // to remove focus
     expect(
       screen.queryAllByLabelText('Ansible Commands', { selector: 'button' })
     ).toHaveLength(0);
@@ -47,7 +48,7 @@ describe('Category And Template', () => {
     await act(async () => {
       await fireEvent.click(screen.getByText('template2'));
     });
-    fireEvent.click(screen.getAllByText('Category and Template')[0]); // to remove focus
+    fireEvent.click(screen.getAllByText(WIZARD_TITLES.categoryAndTemplate)[0]); // to remove focus
     expect(
       screen.queryAllByDisplayValue('template1', { selector: 'button' })
     ).toHaveLength(0);

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

@@ -54,10 +54,11 @@ const ConnectedCategoryAndTemplate = ({
             search: `job_category="${category}"`,
             per_page: 'all',
           }),
-          handleSuccess: response =>
+          handleSuccess: response => {
             setJobTemplate(
               Number(filterJobTemplates(response?.data?.results)[0]?.id) || null
-            ),
+            );
+          },
         })
       );
     }

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

@@ -0,0 +1,62 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useSelector } from 'react-redux';
+import URI from 'urijs';
+import { List, ListItem, Modal, Button } from '@patternfly/react-core';
+import { translate as __, sprintf } from 'foremanReact/common/I18n';
+import { foremanUrl } from 'foremanReact/common/helpers';
+import { selectHosts, selectHostCount } from '../../JobWizardSelectors';
+import { HOSTS_TO_PREVIEW_AMOUNT } from '../../JobWizardConstants';
+
+export const HostPreviewModal = ({ isOpen, setIsOpen, searchQuery }) => {
+  const hosts = useSelector(selectHosts);
+  const hostsCount = useSelector(selectHostCount);
+  const url = new URI(foremanUrl('/hosts'));
+
+  return (
+    <Modal
+      title={__('Preview Hosts')}
+      isOpen={isOpen}
+      onClose={() => setIsOpen(false)}
+      appendTo={() => document.getElementsByClassName('job-wizard')[0]}
+    >
+      <List isPlain>
+        {hosts.map(host => (
+          <ListItem key={host}>
+            <Button
+              component="a"
+              href={foremanUrl(`/hosts/${host}`)}
+              variant="link"
+              target="_blank"
+              rel="noreferrer"
+            >
+              {host}
+            </Button>
+          </ListItem>
+        ))}
+        {hostsCount > HOSTS_TO_PREVIEW_AMOUNT && (
+          <ListItem>
+            <Button
+              component="a"
+              href={url.addSearch({ search: searchQuery })}
+              variant="link"
+              target="_blank"
+              rel="noreferrer"
+            >
+              {sprintf(
+                __('...and %s more'),
+                hostsCount - HOSTS_TO_PREVIEW_AMOUNT
+              )}
+            </Button>
+          </ListItem>
+        )}
+      </List>
+    </Modal>
+  );
+};
+
+HostPreviewModal.propTypes = {
+  isOpen: PropTypes.bool.isRequired,
+  setIsOpen: PropTypes.func.isRequired,
+  searchQuery: PropTypes.string.isRequired,
+};

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

@@ -0,0 +1,54 @@
+import React, { useEffect } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import PropTypes from 'prop-types';
+import SearchBar from 'foremanReact/components/SearchBar';
+import { getControllerSearchProps } from 'foremanReact/constants';
+import { getResults } from 'foremanReact/components/AutoComplete/AutoCompleteActions';
+import { TRIGGERS } from 'foremanReact/components/AutoComplete/AutoCompleteConstants';
+import { hostsController, hostQuerySearchID } from '../../JobWizardConstants';
+import { noop } from '../../../helpers';
+
+export const HostSearch = ({ value, setValue }) => {
+  const searchQuery = useSelector(
+    state => state.autocomplete?.hostsSearch?.searchQuery
+  );
+  useEffect(() => {
+    setValue(searchQuery || '');
+  }, [setValue, searchQuery]);
+  const dispatch = useDispatch();
+  const setSearch = newSearchQuery => {
+    dispatch(
+      getResults({
+        url: '/hosts/auto_complete_search',
+        searchQuery: newSearchQuery,
+        controller: 'hostsController',
+        trigger: TRIGGERS.INPUT_CHANGE,
+        id: hostQuerySearchID,
+      })
+    );
+  };
+
+  const props = getControllerSearchProps(hostsController, hostQuerySearchID);
+  return (
+    <div className="foreman-search-field">
+      <SearchBar
+        data={{
+          ...props,
+          autocomplete: {
+            id: hostQuerySearchID,
+            url: '/hosts/auto_complete_search',
+            useKeyShortcuts: true,
+          },
+        }}
+        onSearch={noop}
+        initialQuery={value}
+        onBookmarkClick={search => setSearch(search)}
+      />
+    </div>
+  );
+};
+
+HostSearch.propTypes = {
+  value: PropTypes.string.isRequired,
+  setValue: PropTypes.func.isRequired,
+};

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

@@ -0,0 +1,33 @@
+import React from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import URI from 'urijs';
+import { SelectVariant } from '@patternfly/react-core';
+import { get } from 'foremanReact/redux/API';
+import { selectResponse, selectIsLoading } from '../../JobWizardSelectors';
+import { SearchSelect } from '../form/SearchSelect';
+
+export const useNameSearchAPI = (apiKey, url) => {
+  const dispatch = useDispatch();
+  const uri = new URI(url);
+  const onSearch = search =>
+    dispatch(
+      get({
+        key: apiKey,
+        url: uri.addSearch({
+          search: `name~"${search}"`,
+        }),
+      })
+    );
+
+  const response = useSelector(state => selectResponse(state, apiKey));
+  const isLoading = useSelector(state => selectIsLoading(state, apiKey));
+  return [onSearch, response, isLoading];
+};
+
+export const SelectAPI = props => (
+  <SearchSelect
+    {...props}
+    variant={SelectVariant.typeaheadMulti}
+    useNameSearch={useNameSearchAPI}
+  />
+);

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

@@ -0,0 +1,52 @@
+import React, { useState } from 'react';
+import { useQuery } from '@apollo/client';
+import { SelectVariant } from '@patternfly/react-core';
+import {
+  useForemanOrganization,
+  useForemanLocation,
+} from 'foremanReact/Root/Context/ForemanContext';
+import { HOSTS, HOST_GROUPS, dataName } from '../../JobWizardConstants';
+import { SearchSelect } from '../form/SearchSelect';
+import hostsQuery from './hosts.gql';
+import hostgroupsQuery from './hostgroups.gql';
+
+export const useNameSearchGQL = apiKey => {
+  const org = useForemanOrganization();
+  const location = useForemanLocation();
+  const [search, setSearch] = useState('');
+  const queries = {
+    [HOSTS]: hostsQuery,
+    [HOST_GROUPS]: hostgroupsQuery,
+  };
+  const { loading, data } = useQuery(queries[apiKey], {
+    variables: {
+      search: [
+        `name~"${search}"`,
+        org ? `organization_id=${org.id}` : null,
+        location ? `location_id=${location.id}` : null,
+      ]
+        .filter(i => i)
+        .join(' and '),
+    },
+  });
+  return [
+    setSearch,
+    {
+      subtotal: data?.[dataName[apiKey]]?.totalCount,
+      results:
+        data?.[dataName[apiKey]]?.nodes.map(node => ({
+          id: node.name,
+          name: node.name,
+        })) || [],
+    },
+    loading,
+  ];
+};
+
+export const SelectGQL = props => (
+  <SearchSelect
+    {...props}
+    variant={SelectVariant.typeaheadMulti}
+    useNameSearch={useNameSearchGQL}
+  />
+);

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

@@ -0,0 +1,100 @@
+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 { hostMethods } from '../../JobWizardConstants';
+
+const SelectedChip = ({ selected, setSelected, categoryName }) => {
+  const deleteItem = itemToRemove => {
+    setSelected(oldSelected =>
+      oldSelected.filter(({ id }) => id !== itemToRemove)
+    );
+  };
+  return (
+    <ChipGroup className="hosts-chip-group" categoryName={categoryName}>
+      {selected.map(({ name, id }, index) => (
+        <Chip
+          key={index}
+          id={id}
+          onClick={() => deleteItem(id)}
+          closeBtnAriaLabel={`Close ${name}`}
+        >
+          {name}
+        </Chip>
+      ))}
+    </ChipGroup>
+  );
+};
+
+export const SelectedChips = ({
+  selectedHosts,
+  setSelectedHosts,
+  selectedHostCollections,
+  setSelectedHostCollections,
+  selectedHostGroups,
+  setSelectedHostGroups,
+  hostsSearchQuery,
+  clearSearch,
+}) => {
+  const clearAll = () => {
+    setSelectedHosts(() => []);
+    setSelectedHostCollections(() => []);
+    setSelectedHostGroups(() => []);
+    clearSearch();
+  };
+  const showClear =
+    selectedHosts.length ||
+    selectedHostCollections.length ||
+    selectedHostGroups.length ||
+    hostsSearchQuery;
+  return (
+    <div className="selected-chips">
+      <SelectedChip
+        selected={selectedHosts}
+        categoryName={hostMethods.hosts}
+        setSelected={setSelectedHosts}
+      />
+      <SelectedChip
+        selected={selectedHostCollections}
+        categoryName={hostMethods.hostCollections}
+        setSelected={setSelectedHostCollections}
+      />
+      <SelectedChip
+        selected={selectedHostGroups}
+        categoryName={hostMethods.hostGroups}
+        setSelected={setSelectedHostGroups}
+      />
+      <SelectedChip
+        selected={
+          hostsSearchQuery
+            ? [{ id: hostsSearchQuery, name: hostsSearchQuery }]
+            : []
+        }
+        categoryName={hostMethods.searchQuery}
+        setSelected={clearSearch}
+      />
+      {showClear && (
+        <Button variant="link" className="clear-chips" onClick={clearAll}>
+          {__('Clear filters')}
+        </Button>
+      )}
+    </div>
+  );
+};
+
+SelectedChips.propTypes = {
+  selectedHosts: PropTypes.array.isRequired,
+  setSelectedHosts: PropTypes.func.isRequired,
+  selectedHostCollections: PropTypes.array.isRequired,
+  setSelectedHostCollections: PropTypes.func.isRequired,
+  selectedHostGroups: PropTypes.array.isRequired,
+  setSelectedHostGroups: PropTypes.func.isRequired,
+  hostsSearchQuery: PropTypes.string.isRequired,
+  clearSearch: PropTypes.func.isRequired,
+};
+
+SelectedChip.propTypes = {
+  categoryName: PropTypes.string.isRequired,
+  selected: PropTypes.array.isRequired,
+  setSelected: PropTypes.func.isRequired,
+};

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

@@ -0,0 +1,23 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { formatter } from '../form/Formatter';
+
+export const TemplateInputs = ({ inputs, value, setValue }) => {
+  if (inputs.length)
+    return inputs.map(input => formatter(input, value, setValue));
+  return (
+    <p className="gray-text">
+      {__('There are no available input fields for the selected template.')}
+    </p>
+  );
+};
+TemplateInputs.propTypes = {
+  inputs: PropTypes.array.isRequired,
+  value: PropTypes.object,
+  setValue: PropTypes.func.isRequired,
+};
+
+TemplateInputs.defaultProps = {
+  value: {},
+};

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

@@ -0,0 +1,151 @@
+import React from 'react';
+import { Provider } from 'react-redux';
+import { fireEvent, screen, render, act } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+import * as api from 'foremanReact/redux/API';
+import * as routerSelectors from 'foremanReact/routes/RouterSelector';
+import { JobWizard } from '../../../JobWizard';
+import * as selectors from '../../../JobWizardSelectors';
+import { testSetup, mockApi, gqlMock } from '../../../__tests__/fixtures';
+
+const store = testSetup(selectors, api);
+mockApi(api);
+const lodash = require('lodash');
+
+lodash.debounce = fn => fn;
+
+describe('Hosts', () => {
+  it('Host selection chips removal and keep state between steps', async () => {
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Target hosts and inputs'));
+      await new Promise(resolve => setTimeout(resolve, 0)); // to resolve gql
+    });
+    const select = name =>
+      screen.getByRole('button', { name: `${name} toggle` });
+    fireEvent.click(select('hosts'));
+    await act(async () => {
+      fireEvent.click(screen.getByText('host1'));
+      fireEvent.click(screen.getByText('host2'));
+    });
+    fireEvent.click(
+      screen.getByText('Hosts', { selector: '.pf-c-select__toggle-text' })
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Host groups'));
+    });
+    fireEvent.click(select('host groups'));
+    await act(async () => {
+      fireEvent.click(screen.getByText('host_group1'));
+    });
+
+    fireEvent.click(
+      screen.getByText('Host groups', { selector: '.pf-c-select__toggle-text' })
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Host collections'));
+    });
+    fireEvent.click(select('host collections'));
+    await act(async () => {
+      fireEvent.click(screen.getByText('host_collection1'));
+    });
+
+    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' });
+    await act(async () => {
+      fireEvent.click(chip1);
+    });
+    expect(screen.queryAllByText('host1')).toHaveLength(0);
+    expect(screen.queryAllByText('host3')).toHaveLength(0);
+    expect(screen.queryAllByText('host2')).toHaveLength(1);
+    expect(screen.queryAllByText('host_group1')).toHaveLength(1);
+    expect(screen.queryAllByText('host_collection1')).toHaveLength(1);
+
+    await act(async () => {
+      fireEvent.click(screen.getByText('Category and Template'));
+    });
+    await act(async () => {
+      fireEvent.click(screen.getByText('Target hosts and inputs'));
+    });
+    expect(screen.queryAllByText('host2')).toHaveLength(1);
+    expect(screen.queryAllByText('host_group1')).toHaveLength(1);
+
+    await act(async () => {
+      fireEvent.click(screen.getByText('Clear filters'));
+    });
+
+    expect(screen.queryAllByText('host2')).toHaveLength(0);
+    expect(screen.queryAllByText('host_group1')).toHaveLength(0);
+  });
+  it('Host Collection isnt shown without katello', async () => {
+    selectors.selectWithKatello.mockImplementation(() => false);
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Target hosts and inputs'));
+    });
+
+    expect(screen.queryAllByText('Hosts')).toHaveLength(1);
+    await act(async () => {
+      fireEvent.click(
+        screen.getByText('Hosts', { selector: '.pf-c-select__toggle-text' })
+      );
+    });
+    expect(screen.queryAllByText('Host groups')).toHaveLength(1);
+    expect(screen.queryAllByText('Search query')).toHaveLength(1);
+    expect(screen.queryAllByText('Host collections')).toHaveLength(0);
+  });
+  it('Host fill list from url', async () => {
+    routerSelectors.selectRouterLocation.mockImplementation(() => ({
+      search: '?host_ids%5B%5D=host1&host_ids%5B%5D=host3',
+    }));
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Target hosts and inputs'));
+    });
+    api.get.mock.calls.forEach(call => {
+      if (call[0].key === 'HOST_IDS') {
+        expect(call[0].params).toEqual({ search: 'id = host1 or id = host3' });
+      }
+    });
+
+    expect(screen.queryAllByText('host1')).toHaveLength(1);
+    expect(screen.queryAllByText('host2')).toHaveLength(0);
+    expect(screen.queryAllByText('host3')).toHaveLength(1);
+  });
+  it('Host fill search from url', async () => {
+    routerSelectors.selectRouterLocation.mockImplementation(() => ({
+      search: 'search=os=gnome',
+    }));
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Target hosts and inputs'));
+    });
+    expect(screen.queryAllByText('os=gnome')).toHaveLength(1);
+  });
+});

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

@@ -0,0 +1,53 @@
+import React from 'react';
+import { Provider } from 'react-redux';
+import { fireEvent, screen, render, act } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+import * as api from 'foremanReact/redux/API';
+import { JobWizard } from '../../../JobWizard';
+import * as selectors from '../../../JobWizardSelectors';
+import { testSetup, mockApi, gqlMock } from '../../../__tests__/fixtures';
+import { WIZARD_TITLES } from '../../../JobWizardConstants';
+
+const store = testSetup(selectors, api);
+mockApi(api);
+
+describe('TemplateInputs', () => {
+  it('should save data between steps for template input fields', async () => {
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.hostsAndInputs));
+    });
+    const textValue = 'I am a plain text';
+    const textField = screen.getByLabelText('plain hidden', {
+      selector: 'textarea',
+    });
+
+    await act(async () => {
+      await fireEvent.change(textField, {
+        target: { value: textValue },
+      });
+    });
+    expect(
+      screen.getByLabelText('plain hidden', {
+        selector: 'textarea',
+      }).value
+    ).toBe(textValue);
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.categoryAndTemplate));
+    });
+    expect(screen.getAllByText(WIZARD_TITLES.categoryAndTemplate)).toHaveLength(
+      3
+    );
+
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.hostsAndInputs));
+    });
+    expect(textField.value).toBe(textValue);
+  });
+});

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

@@ -0,0 +1,18 @@
+export const buildHostQuery = (selected, search) => {
+  const { hosts, hostCollections, hostGroups } = selected;
+  const hostsSearch = `(name ^ (${hosts.map(({ id }) => id).join(',')}))`;
+  const hostCollectionsSearch = `(host_collection_id ^ (${hostCollections
+    .map(({ id }) => id)
+    .join(',')}))`;
+  const hostGroupsSearch = `(hostgroup_id ^ (${hostGroups
+    .map(({ id }) => id)
+    .join(',')}))`;
+  return [
+    hosts.length ? hostsSearch : false,
+    hostCollections.length ? hostCollectionsSearch : false,
+    hostGroups.length ? hostGroupsSearch : false,
+    search.length ? `(${search})` : false,
+  ]
+    .filter(Boolean)
+    .join(' or ');
+};

data/webpack/JobWizard/steps/HostsAndInputs/hostgroups.gql

@@ -0,0 +1,8 @@
+query($search: String!) {
+  hostgroups(first: 100, last: 100, search: $search) {
+    totalCount
+    nodes {
+      name
+    }
+  }
+}

data/webpack/JobWizard/steps/HostsAndInputs/hosts.gql

@@ -0,0 +1,8 @@
+query($search: String!) {
+  hosts(first: 100, last: 100, search: $search) {
+    totalCount
+    nodes {
+      name
+    }
+  }
+}