katello 4.4.2.2 → 4.5.0.rc1

data/webpack/components/Table/components/TranslatedPlural.js

@@ -0,0 +1,57 @@
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+import PropTypes from 'prop-types';
+
+// a defaultMessage like
+// "{count, plural, =0 {No errata} one {# erratum} other {# errata}}"
+// will give us properly translated pluralized strings!
+// see https://formatjs.io/docs/react-intl/components/#message-syntax
+export const TranslatedPlural = ({
+  count, singular,
+  plural = `${singular}s`,
+  zeroMsg = `No ${plural}`,
+  id,
+  ...props
+}) => (
+  <FormattedMessage
+    defaultMessage={`{count, plural, =0 {${zeroMsg}} one {# ${singular}} other {# ${plural}}}`}
+    values={{
+      count,
+    }}
+    id={id}
+    {...props}
+  />
+);
+
+TranslatedPlural.propTypes = {
+  count: PropTypes.number.isRequired,
+  singular: PropTypes.string.isRequired,
+  plural: PropTypes.string,
+  zeroMsg: PropTypes.string,
+  id: PropTypes.string.isRequired,
+};
+
+TranslatedPlural.defaultProps = {
+  plural: undefined,
+  zeroMsg: undefined,
+};
+
+export const TranslatedAnchor = ({
+  href, style, ariaLabel, ...props
+}) => (
+  <a href={href} style={style} aria-label={ariaLabel}>
+    <TranslatedPlural
+      {...props}
+    />
+  </a>
+);
+
+TranslatedAnchor.propTypes = {
+  href: PropTypes.string.isRequired,
+  style: PropTypes.shape({}),
+  ariaLabel: PropTypes.string.isRequired,
+};
+
+TranslatedAnchor.defaultProps = {
+  style: undefined,
+};

data/webpack/components/TypeAhead/TypeAhead.js

@@ -23,6 +23,8 @@ const TypeAhead = ({
   autoSearchDelay,
   bookmarkController,
   placeholder,
+  isTextInput,
+  setTextInputValue,
 }) => {
   const [inputValue, setInputValue] = useState(initialInputValue);
 
@@ -38,6 +40,7 @@ const TypeAhead = ({
   const handleStateChange = ({ inputValue: value }) => {
     if (typeof value === 'string') {
       setInputValue(value);
+      if (setTextInputValue) setTextInputValue(value);
     }
   };
 
@@ -82,6 +85,7 @@ const TypeAhead = ({
           activeItems,
           placeholder,
           shouldShowItems: isOpen && items.length > 0,
+          isTextInput,
         };
 
         return (
@@ -115,6 +119,8 @@ TypeAhead.propTypes = {
   autoSearchDelay: PropTypes.number,
   bookmarkController: PropTypes.string,
   placeholder: PropTypes.string,
+  isTextInput: PropTypes.bool,
+  setTextInputValue: PropTypes.func,
 };
 
 TypeAhead.defaultProps = {
@@ -125,6 +131,8 @@ TypeAhead.defaultProps = {
   autoSearchDelay: 500,
   bookmarkController: undefined,
   placeholder: undefined,
+  isTextInput: false,
+  setTextInputValue: undefined,
 };
 
 export default TypeAhead;

data/webpack/components/TypeAhead/pf4Search/TypeAheadInput.js

@@ -8,7 +8,7 @@ import { commonInputPropTypes } from '../helpers/commonPropTypes';
 import './TypeAheadInput.scss';
 
 const TypeAheadInput = ({
-  onKeyPress, onInputFocus, passedProps, isDisabled, autoSearchEnabled, placeholder,
+  onKeyPress, onInputFocus, passedProps, isDisabled, autoSearchEnabled, placeholder, isTextInput,
 }) => {
   const inputRef = useRef(null);
   const {
@@ -31,19 +31,19 @@ const TypeAheadInput = ({
         onFocus={onInputFocus}
         aria-label="text input for search"
         onChange={onChangeWrapper}
-        type="search"
-        iconVariant={autoSearchEnabled && 'search'}
+        type="text"
+        iconVariant={autoSearchEnabled && !isTextInput ? 'search' : undefined}
         placeholder={placeholder}
       />
       {
-        value && (
-          <Button
-            variant={autoSearchEnabled ? 'plain' : 'control'}
-            className="search-clear"
-            onClick={clearSearch}
-          >
-            <TimesIcon />
-          </Button>)}
+        (value && !isTextInput) &&
+        <Button
+          variant={autoSearchEnabled ? 'plain' : 'control'}
+          className="search-clear"
+          onClick={clearSearch}
+        >
+          <TimesIcon />
+        </Button>}
     </>);
 };
 
@@ -52,11 +52,13 @@ TypeAheadInput.propTypes = {
   autoSearchEnabled: PropTypes.bool.isRequired,
   ...commonInputPropTypes,
   placeholder: PropTypes.string,
+  isTextInput: PropTypes.bool,
 };
 
 TypeAheadInput.defaultProps = {
   isDisabled: undefined,
   placeholder: '',
+  isTextInput: false,
 };
 
 export default TypeAheadInput;

data/webpack/components/TypeAhead/pf4Search/TypeAheadSearch.js

@@ -12,7 +12,7 @@ import Bookmark from './../../../components/Bookmark';
 const TypeAheadSearch = ({
   userInputValue, clearSearch, getInputProps, getItemProps, isOpen, highlightedIndex,
   selectedItem, selectItem, openMenu, onSearch, items, activeItems, shouldShowItems,
-  autoSearchEnabled, isDisabled, bookmarkController, inputValue, placeholder,
+  autoSearchEnabled, isDisabled, bookmarkController, inputValue, placeholder, isTextInput,
 }) => (
   <>
     <InputGroup>
@@ -35,6 +35,7 @@ const TypeAheadSearch = ({
         passedProps={{ ...getInputProps(), clearSearch }}
         autoSearchEnabled={autoSearchEnabled}
         placeholder={placeholder}
+        isTextInput={isTextInput}
       />
       <>
         {bookmarkController &&
@@ -46,7 +47,7 @@ const TypeAheadSearch = ({
             }}
             controller={bookmarkController}
           />}
-        {!autoSearchEnabled &&
+        {(!autoSearchEnabled && !isTextInput) &&
           <Button aria-label="search button" variant="control" onClick={() => onSearch(inputValue)}>
             <SearchIcon />
           </Button>}
@@ -65,12 +66,14 @@ TypeAheadSearch.propTypes = {
   isDisabled: PropTypes.bool,
   autoSearchEnabled: PropTypes.bool.isRequired,
   bookmarkController: PropTypes.string,
+  isTextInput: PropTypes.bool,
   ...commonSearchPropTypes,
 };
 
 TypeAheadSearch.defaultProps = {
   bookmarkController: undefined,
   isDisabled: undefined,
+  isTextInput: false,
 };
 
 export default TypeAheadSearch;

data/webpack/components/extensions/HostDetails/ActionsBar/index.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { useSelector } from 'react-redux';
+import { DropdownItem } from '@patternfly/react-core';
+import { CubeIcon } from '@patternfly/react-icons';
+
+import { translate as __ } from 'foremanReact/common/I18n';
+import { foremanUrl } from 'foremanReact/common/helpers';
+
+import { selectHostDetails } from '../HostDetailsSelectors';
+
+const HostActionsBar = () => {
+  const hostDetails = useSelector(selectHostDetails);
+
+  return (
+    <>
+      <DropdownItem
+        key="katello-change-host-content-source"
+        href={foremanUrl(`/change_host_content_source?host_id=${hostDetails?.id}`)}
+        icon={<CubeIcon />}
+      >
+        {__('Change content source')}
+      </DropdownItem>
+    </>
+  );
+};
+
+export default HostActionsBar;

data/webpack/components/extensions/HostDetails/Cards/ContentViewDetailsCard/ChangeHostCVModal.js

@@ -0,0 +1,256 @@
+import React, { useState, useCallback } from 'react';
+import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+import { useDispatch, useSelector } from 'react-redux';
+import { Modal, Button, Select, SelectOption, Alert, Flex } from '@patternfly/react-core';
+import {
+  global_palette_black_600 as pfDescriptionColor,
+} from '@patternfly/react-tokens';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { STATUS } from 'foremanReact/constants';
+import { useAPI } from 'foremanReact/common/hooks/API/APIHooks';
+import { HOST_DETAILS_KEY } from 'foremanReact/components/HostDetails/consts';
+import { selectAPIStatus } from 'foremanReact/redux/API/APISelectors';
+import EnvironmentPaths from '../../../../../scenes/ContentViews/components/EnvironmentPaths/EnvironmentPaths';
+import { ENVIRONMENT_PATHS_KEY } from '../../../../../scenes/ContentViews/components/EnvironmentPaths/EnvironmentPathConstants';
+import api from '../../../../../services/api';
+import getContentViews from '../../../../../scenes/ContentViews/ContentViewsActions';
+import { selectContentViews, selectContentViewStatus } from '../../../../../scenes/ContentViews/ContentViewSelectors';
+import { uniq } from '../../../../../utils/helpers';
+import ContentViewIcon from '../../../../../scenes/ContentViews/components/ContentViewIcon';
+import updateHostContentViewAndEnvironment from './HostContentViewActions';
+import HOST_CV_AND_ENV_KEY from './HostContentViewConstants';
+
+const ENV_PATH_OPTIONS = { key: ENVIRONMENT_PATHS_KEY };
+
+const ContentViewDescription = ({ cv, versionNumber }) => {
+  const descriptionStyle = {
+    fontSize: '12px',
+    fontWeight: 400,
+    color: pfDescriptionColor.value,
+  };
+  if (cv.default) return <span style={descriptionStyle}>{__('Library')}</span>;
+  return (
+    <span style={descriptionStyle}>
+      <FormattedMessage
+        id={`content-view-${cv.id}-version-${cv.latest_version}`}
+        defaultMessage="Version {versionNumber}"
+        values={{ versionNumber }}
+      />
+    </span>
+  );
+};
+
+ContentViewDescription.propTypes = {
+  cv: PropTypes.shape({
+    default: PropTypes.bool.isRequired,
+    id: PropTypes.number.isRequired,
+    latest_version: PropTypes.string.isRequired,
+  }).isRequired,
+  versionNumber: PropTypes.string.isRequired,
+};
+
+const ChangeHostCVModal = ({
+  isOpen,
+  closeModal,
+  hostEnvId,
+  orgId,
+  hostId,
+  hostName,
+}) => {
+  const [selectedEnvForHost, setSelectedEnvForHost]
+    = useState([]);
+
+  const [selectedCVForHost, setSelectedCVForHost] = useState(null);
+  const [cvSelectOpen, setCVSelectOpen] = useState(false);
+  const dispatch = useDispatch();
+  const contentViewsInEnvResponse = useSelector(state => selectContentViews(state, `FOR_ENV_${hostEnvId}`));
+  const contentViewsInEnvStatus = useSelector(state => selectContentViewStatus(state, `FOR_ENV_${hostEnvId}`));
+  const hostUpdateStatus = useSelector(state => selectAPIStatus(state, HOST_CV_AND_ENV_KEY));
+  useAPI( // No TableWrapper here, so we can useAPI from Foreman
+    'get',
+    api.getApiUrl(`/organizations/${orgId}/environments/paths?permission_type=promotable`),
+    ENV_PATH_OPTIONS,
+  );
+
+  const handleModalClose = () => {
+    setCVSelectOpen(false);
+    setSelectedCVForHost(null);
+    setSelectedEnvForHost([]);
+    closeModal();
+  };
+
+  const selectedEnv = selectedEnvForHost?.[0];
+  const selectedEnvId = selectedEnv?.id;
+
+  const handleCVSelect = (event, selection) => {
+    setSelectedCVForHost(selection);
+    setCVSelectOpen(false);
+  };
+
+  const handleEnvSelect = (selection) => {
+    dispatch(getContentViews({
+      environment_id: selection[0].id,
+      include_default: true,
+      full_result: true,
+      order: 'default DESC', // show Default Organization View first
+    }, `FOR_ENV_${hostEnvId}`));
+    setSelectedCVForHost(null);
+    setSelectedEnvForHost(selection);
+  };
+  const { results: contentViewsInEnv = [] } = contentViewsInEnvResponse;
+  const canSave = !!(selectedCVForHost && selectedEnvForHost.length);
+
+  const relevantVersionObjFromCv = (cv, env) => { // returns the entire version object
+    const versions = cv.versions.filter(version => new Set(version.environment_ids).has(env.id));
+    return uniq(versions)?.[0];
+  };
+  const relevantVersionFromCv = (cv, env) =>
+    relevantVersionObjFromCv(cv, env)?.version; // returns the version text e.g. "1.0"
+
+  const refreshHostDetails = () => {
+    handleModalClose();
+    return dispatch({
+      type: 'API_GET',
+      payload: {
+        key: HOST_DETAILS_KEY,
+        url: `/api/hosts/${hostName}`,
+      },
+    });
+  };
+
+  const handleSave = () => {
+    const requestBody = {
+      id: hostId,
+      host: {
+        content_facet_attributes: {
+          content_view_id: selectedCVForHost,
+          lifecycle_environment_id: selectedEnvId,
+        },
+      },
+    };
+    dispatch(updateHostContentViewAndEnvironment(
+      requestBody, hostId,
+      refreshHostDetails, handleModalClose,
+    ));
+  };
+
+  const cvPlaceholderText = useCallback(() => {
+    if (contentViewsInEnvStatus === STATUS.PENDING) return __('Loading...');
+    if (contentViewsInEnvStatus === STATUS.ERROR) return __('Error loading content views');
+    return (contentViewsInEnv.length === 0) ? __('No content views available') : __('Select a content view');
+  }, [contentViewsInEnv.length, contentViewsInEnvStatus]);
+
+  const modalActions = ([
+    <Button
+      key="add"
+      variant="primary"
+      onClick={handleSave}
+      isDisabled={!canSave}
+      isLoading={hostUpdateStatus === STATUS.PENDING}
+    >
+      {__('Save')}
+    </Button>,
+    <Button key="cancel" variant="link" onClick={handleModalClose}>
+      Cancel
+    </Button>,
+  ]);
+  return (
+    <Modal
+      isOpen={isOpen}
+      onClose={handleModalClose}
+      onEscapePress={handleModalClose}
+      title={__('Edit content view assignment')}
+      width="50%"
+      position="top"
+      actions={modalActions}
+      id="change-host-cv-modal"
+    >
+      {contentViewsInEnvStatus === STATUS.RESOLVED &&
+        !!selectedEnvForHost.length && contentViewsInEnv.length === 0 &&
+        <Alert
+          variant="warning"
+          isInline
+          title={__('No content views available for the selected environment')}
+          style={{ marginBottom: '1rem' }}
+        >
+          {__('View the Content Views page to manage and promote content views, or select a different environment.')}
+        </Alert>
+      }
+      <EnvironmentPaths
+        userCheckedItems={selectedEnvForHost}
+        setUserCheckedItems={handleEnvSelect}
+        publishing={false}
+        multiSelect={false}
+        headerText={__('Select environment')}
+        isDisabled={hostUpdateStatus === STATUS.PENDING}
+      />
+      {selectedEnvForHost.length > 0 &&
+      <div style={{ marginTop: '1em' }}>
+        <h3>{__('Select content view')}</h3>
+        <Select
+          selections={selectedCVForHost}
+          onSelect={handleCVSelect}
+          isOpen={cvSelectOpen}
+          menuAppendTo="parent"
+          isDisabled={contentViewsInEnv.length === 0 || hostUpdateStatus === STATUS.PENDING}
+          onToggle={isExpanded => setCVSelectOpen(isExpanded)}
+          ouiaId="select-content-view"
+          id="selectCV"
+          name="selectCV"
+          aria-label="selectCV"
+          placeholderText={cvPlaceholderText()}
+        >
+          {contentViewsInEnv?.map(cv => (
+            <SelectOption
+              key={cv.id}
+              value={cv.id}
+            >
+              <Flex
+                direction={{ default: 'row', sm: 'row' }}
+                flexWrap={{ default: 'nowrap' }}
+                alignItems={{ default: 'alignItemsCenter', sm: 'alignItemsCenter' }}
+              >
+                <ContentViewIcon
+                  composite={cv.composite}
+                  size="sm"
+                />
+                <Flex
+                  direction={{ default: 'column', sm: 'column' }}
+                  flexWrap={{ default: 'nowrap' }}
+                  alignItems={{ default: 'alignItemsFlexStart', sm: 'alignItemsFlexStart' }}
+                >
+                  {cv.name}
+                  <ContentViewDescription
+                    cv={cv}
+                    versionNumber={relevantVersionFromCv(cv, selectedEnv)}
+                  />
+                </Flex>
+              </Flex>
+            </SelectOption>
+          ))
+          }
+        </Select>
+      </div>
+      }
+    </Modal>
+  );
+};
+
+ChangeHostCVModal.propTypes = {
+  isOpen: PropTypes.bool,
+  closeModal: PropTypes.func,
+  hostEnvId: PropTypes.number,
+  orgId: PropTypes.number.isRequired,
+  hostId: PropTypes.number.isRequired,
+  hostName: PropTypes.string.isRequired,
+};
+
+ChangeHostCVModal.defaultProps = {
+  isOpen: false,
+  closeModal: () => {},
+  hostEnvId: null,
+};
+
+
+export default ChangeHostCVModal;

data/webpack/components/extensions/HostDetails/Cards/ContentViewDetailsCard/ContentViewDetailsCard.js

@@ -0,0 +1,202 @@
+import React, { useState } from 'react';
+import {
+  Card,
+  CardHeader,
+  CardTitle,
+  CardBody,
+  Dropdown,
+  DropdownItem,
+  Flex,
+  FlexItem,
+  GridItem,
+  KebabToggle,
+  Label,
+  Tooltip,
+} from '@patternfly/react-core';
+import { FormattedMessage } from 'react-intl';
+
+import { urlBuilder } from 'foremanReact/common/urlHelpers';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { propsToCamelCase } from 'foremanReact/common/helpers';
+import PropTypes from 'prop-types';
+import ContentViewIcon from '../../../../../scenes/ContentViews/components/ContentViewIcon';
+import { hostIsRegistered } from '../../hostDetailsHelpers';
+import ChangeHostCVModal from './ChangeHostCVModal';
+
+const HostContentViewDetails = ({
+  contentView, lifecycleEnvironment, contentViewVersionId, contentViewDefault,
+  contentViewVersion, contentViewVersionLatest, hostId, hostName, orgId, hostEnvId,
+}) => {
+  let versionLabel = `Version ${contentViewVersion}`;
+  if (contentViewVersionLatest) {
+    versionLabel += ' (latest)';
+  }
+
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
+  const toggleHamburger = () => setIsDropdownOpen(prev => !prev);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const closeModal = () => setIsModalOpen(false);
+  const openModal = () => {
+    setIsDropdownOpen(false);
+    setIsModalOpen(true);
+  };
+
+  const dropdownItems = [
+    <DropdownItem
+      aria-label="change-host-content-view"
+      key="change-host-content-view"
+      component="button"
+      onClick={openModal}
+    >
+      {__('Edit content view assignment')}
+    </DropdownItem>,
+  ];
+
+  return (
+    <GridItem rowSpan={1} md={6} lg={4} xl2={3} >
+      <Card isHoverable>
+        <CardHeader>
+          <Flex
+            alignItems={{ default: 'alignItemsCenter' }}
+            justifyContent={{ default: 'justifyContentSpaceBetween' }}
+            style={{ width: '100%' }}
+          >
+            <FlexItem>
+              <Flex
+                alignItems={{ default: 'alignItemsCenter' }}
+                justifyContent={{ default: 'justifyContentSpaceBetween' }}
+              >
+                <FlexItem>
+                  <CardTitle>{__('Content view details')}</CardTitle>
+                </FlexItem>
+              </Flex>
+            </FlexItem>
+            <FlexItem>
+              <Dropdown
+                toggle={<KebabToggle aria-label="change_content_view_hamburger" onToggle={toggleHamburger} />}
+                isOpen={isDropdownOpen}
+                isPlain
+                ouiaId="change-host-content-view-kebab"
+                position="right"
+                dropdownItems={dropdownItems}
+              />
+            </FlexItem>
+          </Flex>
+        </CardHeader>
+        <CardBody>
+          <Flex direction={{ default: 'column' }}>
+            <Flex
+              direction={{ default: 'row', sm: 'row' }}
+              flexWrap={{ default: 'nowrap' }}
+              alignItems={{ default: 'alignItemsCenter', sm: 'alignItemsCenter' }}
+            >
+              <ContentViewIcon composite={contentView.composite} style={{ marginRight: '2px' }} position="left" />
+              <h3>{__('Content view')}</h3>
+            </Flex>
+            <Flex direction={{ default: 'row', sm: 'row' }} flexWrap={{ default: 'wrap' }}>
+              <a style={{ fontSize: '14px' }} href={`/content_views/${contentView.id}`}>{`${contentView.name}`}</a>
+              <Tooltip
+                position="top"
+                enableFlip
+                entryDelay={400}
+                content={<FormattedMessage
+                  id="cv-card-lce-tooltip"
+                  defaultMessage={__('Lifecycle environment: {lce}')}
+                  values={{
+                    lce: lifecycleEnvironment.name,
+                  }}
+                />}
+              >
+                <Label isTruncated color="purple" href={`/lifecycle_environments/${lifecycleEnvironment.id}`}>{`${lifecycleEnvironment.name}`}</Label>
+              </Tooltip>
+            </Flex>
+          </Flex>
+          {!contentViewDefault &&
+          <Flex direction={{ default: 'column' }}>
+            <FlexItem>
+              <h3>{__('Version in use')}</h3>
+              <a style={{ fontSize: '14px' }} href={urlBuilder(`content_views/${contentView.id}/versions/${contentViewVersionId}`, '')}>
+                {versionLabel}
+              </a>
+            </FlexItem>
+          </Flex>
+      }
+        </CardBody>
+      </Card>
+      {hostId &&
+        <ChangeHostCVModal
+          isOpen={isModalOpen}
+          closeModal={closeModal}
+          hostId={hostId}
+          hostName={hostName}
+          hostEnvId={hostEnvId}
+          orgId={orgId}
+          key={`cv-change-modal-${hostId}`}
+        />
+      }
+    </GridItem>
+  );
+};
+
+const ContentViewDetailsCard = ({ hostDetails }) => {
+  if (hostIsRegistered({ hostDetails })
+    && hostDetails.content_facet_attributes && hostDetails.organization_id) {
+    return (<HostContentViewDetails
+      hostId={hostDetails.id}
+      hostName={hostDetails.name}
+      orgId={hostDetails.organization_id}
+      hostEnvId={hostDetails.content_facet_attributes.lifecycle_environment_id}
+      {...propsToCamelCase(hostDetails.content_facet_attributes)}
+    />);
+  }
+  return null;
+};
+
+HostContentViewDetails.propTypes = {
+  contentView: PropTypes.shape({
+    name: PropTypes.string,
+    id: PropTypes.number,
+    composite: PropTypes.bool,
+  }).isRequired,
+  contentViewDefault: PropTypes.bool,
+  lifecycleEnvironment: PropTypes.shape({
+    name: PropTypes.string,
+    id: PropTypes.number,
+  }).isRequired,
+  contentViewVersionId: PropTypes.number.isRequired,
+  contentViewVersion: PropTypes.string.isRequired,
+  contentViewVersionLatest: PropTypes.bool.isRequired,
+  id: PropTypes.number,
+  name: PropTypes.string,
+  hostId: PropTypes.number,
+  hostName: PropTypes.string,
+  orgId: PropTypes.number,
+  hostEnvId: PropTypes.number,
+};
+
+HostContentViewDetails.defaultProps = {
+  id: null,
+  name: '',
+  hostEnvId: null,
+  hostId: null,
+  hostName: '',
+  orgId: null,
+  contentViewDefault: false,
+};
+
+ContentViewDetailsCard.propTypes = {
+  hostDetails: PropTypes.shape({
+    id: PropTypes.number,
+    name: PropTypes.string,
+    organization_id: PropTypes.number,
+    content_facet_attributes: PropTypes.shape({
+      lifecycle_environment_id: PropTypes.number,
+    }),
+  }),
+};
+
+ContentViewDetailsCard.defaultProps = {
+  hostDetails: {},
+};
+
+export default ContentViewDetailsCard;

data/webpack/components/extensions/HostDetails/Cards/ContentViewDetailsCard/HostContentViewActions.js

@@ -0,0 +1,19 @@
+import { translate as __ } from 'foremanReact/common/I18n';
+import { API_OPERATIONS, put } from 'foremanReact/redux/API';
+import { errorToast } from '../../../../../scenes/Tasks/helpers';
+import { foremanApi } from '../../../../../services/api';
+import HOST_CV_AND_ENV_KEY from './HostContentViewConstants';
+
+const updateHostContentViewAndEnvironment = (params, hostId, handleSuccess, handleError) => put({
+  type: API_OPERATIONS.PUT,
+  key: HOST_CV_AND_ENV_KEY,
+  url: foremanApi.getApiUrl(`/hosts/${hostId}`),
+  successToast: () => __('Host content view and environment updated'),
+  handleSuccess,
+  handleError,
+  errorToast,
+  params,
+});
+
+export default updateHostContentViewAndEnvironment;
+