webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js in katello-3.16.2 vs webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js in katello-3.17.0.rc1
- old
+ new
@@ -1,54 +1,44 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Grid, Col, Row, Tabs, Tab, Form, FormGroup, FormControl, ControlLabel } from 'react-bootstrap';
-import { Button, Spinner, OverlayTrigger, Tooltip, Icon } from 'patternfly-react';
+import { Button, Spinner } from 'patternfly-react';
import ForemanModal from 'foremanReact/components/ForemanModal';
-import { isEqual } from 'lodash';
import { translate as __ } from 'foremanReact/common/I18n';
-import TooltipButton from '../../../move_to_pf/TooltipButton';
-import { LoadingState } from '../../../move_to_pf/LoadingState';
-import { Table } from '../../../move_to_foreman/components/common/table';
-import { manifestExists } from '../SubscriptionHelpers';
+import TooltipButton from '../../../components/TooltipButton';
+import { LoadingState } from '../../../components/LoadingState';
+import { Table } from '../../../components/pf3Table';
+
import { columns } from './ManifestHistoryTableSchema';
import DeleteManifestModalText from './DeleteManifestModalText';
import { MANAGE_MANIFEST_MODAL_ID, DELETE_MANIFEST_MODAL_ID } from './ManifestConstants';
+import SimpleContentAccess from './SimpleContentAccess';
import './ManageManifestModal.scss';
class ManageManifestModal extends Component {
constructor(props) {
super(props);
this.state = {
- actionInProgress: props.taskInProgress,
+ redhat_repository_url: null,
+ hideModalAfterAction: true,
};
}
- static getDerivedStateFromProps(newProps, prevState) {
- if (
- !isEqual(newProps.taskInProgress, prevState.actionInProgress)
- ) {
- return {
- actionInProgress: newProps.taskInProgress,
- };
+ componentWillMount() {
+ if (this.props.taskInProgress && this.state.hideModalAfterAction) {
+ this.hideModal();
+ this.setState({ hideModalAfterAction: false });
}
- return null;
}
componentDidMount() {
this.loadData();
+ this.props.loadOrganization();
}
- componentDidUpdate(prevProp, prevState) {
- const { actionInProgress } = this.state;
-
- if (prevState.actionInProgress && !actionInProgress) {
- this.props.loadOrganization();
- }
- }
-
loadData() {
this.props.loadManifestHistory();
}
hideModal = () => {
@@ -70,25 +60,21 @@
this.props.saveOrganization({ redhat_repository_url: this.state.redhat_repository_url });
};
uploadManifest = (fileList) => {
this.hideModal();
- this.setState({ actionInProgress: true });
if (fileList.length > 0) {
this.props.upload(fileList[0]);
}
};
refreshManifest = () => {
- this.hideModal();
- this.setState({ actionInProgress: true });
this.props.refresh();
};
deleteManifest = () => {
this.hideModal();
- this.setState({ actionInProgress: true });
this.props.delete();
};
disabledTooltipText = () => {
if (this.state.actionInProgress) {
@@ -103,20 +89,30 @@
organization,
disableManifestActions,
disabledReason,
canImportManifest,
canDeleteManifest,
+ isManifestImported,
canEditOrganizations,
simpleContentAccess,
+ enableSimpleContentAccess,
+ disableSimpleContentAccess,
+ taskInProgress,
+ manifestActionInProgress,
} = this.props;
+ const actionInProgress = (taskInProgress || manifestActionInProgress);
const showRedHatProviderDetails = canEditOrganizations;
const showSubscriptionManifest = (canImportManifest || canDeleteManifest);
const showManifestTab = (showRedHatProviderDetails || showSubscriptionManifest);
+ const disableSCASwitch = (
+ disableManifestActions ||
+ !isManifestImported ||
+ actionInProgress ||
+ organization.loading
+ );
- const { actionInProgress } = this.state;
-
const emptyStateData = () => ({
header: __('There is no Manifest History to display.'),
description: __('Import a Manifest using the manifest tab above.'),
documentation: {
label: __('Learn more about adding Subscription Manifests'),
@@ -155,21 +151,21 @@
{showManifestTab &&
<Tab eventKey={1} title={__('Manifest')}>
<Form className="form-horizontal">
{showRedHatProviderDetails &&
<React.Fragment>
- <h5>{__('Red Hat Provider Details')}</h5>
+ <h3>{__('Red Hat Provider Details')}</h3>
<hr />
<FormGroup>
<Grid>
<Row>
- <Col sm={4}>
+ <Col sm={5}>
<ControlLabel htmlFor="cdnUrl">
{__('Red Hat CDN URL')}
</ControlLabel>
</Col>
- <Col sm={8}>
+ <Col sm={7}>
<FormControl
id="cdnUrl"
type="text"
defaultValue={this.state.redhat_repository_url || organization.redhat_repository_url || ''}
onBlur={this.updateRepositoryUrl}
@@ -179,11 +175,11 @@
</Grid>
</FormGroup>
<FormGroup>
<Grid>
<Row>
- <Col smOffset={4} sm={4}>
+ <Col smOffset={5} sm={7}>
<Button onClick={this.saveOrganization} disabled={organization.loading}>
{organization.loading ? buttonLoading : __('Update')}
</Button>
</Col>
</Row>
@@ -195,56 +191,40 @@
{showSubscriptionManifest &&
<React.Fragment>
<FormGroup>
<Grid>
- <h5>{__('Subscription Manifest')}</h5>
+ <h3>{__('Subscription Manifest')}</h3>
<hr />
<Row>
- <Col sm={4}>
- <ControlLabel
- className="control-label"
- htmlFor="usmaFile"
- style={{ paddingTop: '0' }}
- >
- <OverlayTrigger
- overlay={
- <Tooltip id="usma-tooltip">
- {__('Upstream Subscription Management Application')}
- </Tooltip>
- }
- placement="bottom"
- trigger={['hover', 'focus']}
- rootClose={false}
- >
- <div>{__('USMA')}</div>
- </OverlayTrigger>
- </ControlLabel>
+ <SimpleContentAccess
+ enableSimpleContentAccess={enableSimpleContentAccess}
+ disableSimpleContentAccess={disableSimpleContentAccess}
+ isSimpleContentAccessEnabled={simpleContentAccess}
+ canToggleSimpleContentAccess={!disableSCASwitch}
+ />
+ </Row>
+ <Row>
+ <Col sm={5}>
+ <strong>{__('Subscription Allocation')}</strong>
</Col>
- <Col sm={8}>
+ <Col sm={7}>
{getManifestName()}
</Col>
</Row>
<Row>
- <Col sm={4}>
- <div>{__('Simple Content Access')}</div>
+ <Col sm={5}>
+ {canImportManifest &&
+ <ControlLabel
+ style={{ paddingTop: '10px' }}
+ >
+ <div>{__('Import New Manifest')}</div>
+ </ControlLabel>
+ }
</Col>
- <Col sm={8} className="manifest-actions">
- <Spinner loading={actionInProgress} inline />
- {simpleContentAccess ? __('Yes') : __('No')}
- <OverlayTrigger
- overlay={
- <Tooltip id="sca-tooltip">
- {__('When Simple Content Access is enabled, hosts can consume from all repositories in their Content View regardless of subscription status.')}
- </Tooltip>
- }
- placement="bottom"
- trigger={['hover', 'focus']}
- rootClose={false}
- >
- <Icon type="pf" name="info" />
- </OverlayTrigger>
+ <Col sm={7} className="manifest-actions">
+ <Spinner loading={actionInProgress} />
{canImportManifest &&
<FormControl
id="usmaFile"
type="file"
accept=".zip"
@@ -258,20 +238,20 @@
onClick={this.refreshManifest}
tooltipId="refresh-manifest-button-tooltip"
tooltipText={disabledReason}
tooltipPlacement="top"
title={__('Refresh')}
- disabled={!manifestExists(organization) ||
+ disabled={!isManifestImported ||
actionInProgress || disableManifestActions}
/>
}
{canDeleteManifest &&
<React.Fragment>
<TooltipButton
renderedButton={(
<Button
- disabled={!manifestExists(organization) || actionInProgress}
+ disabled={!isManifestImported || actionInProgress}
bsStyle="danger"
onClick={this.showDeleteManifestModal}
>
{__('Delete')}
</Button>
@@ -327,10 +307,12 @@
ManageManifestModal.propTypes = {
upload: PropTypes.func.isRequired,
refresh: PropTypes.func.isRequired,
delete: PropTypes.func.isRequired,
+ enableSimpleContentAccess: PropTypes.func.isRequired,
+ disableSimpleContentAccess: PropTypes.func.isRequired,
loadManifestHistory: PropTypes.func.isRequired,
organization: PropTypes.shape({
loading: PropTypes.bool,
redhat_repository_url: PropTypes.string,
owner_details: PropTypes.shape({
@@ -341,10 +323,11 @@
}),
}),
}).isRequired,
canImportManifest: PropTypes.bool,
canDeleteManifest: PropTypes.bool,
+ isManifestImported: PropTypes.bool,
canEditOrganizations: PropTypes.bool,
disableManifestActions: PropTypes.bool,
disabledReason: PropTypes.string,
loadOrganization: PropTypes.func.isRequired,
saveOrganization: PropTypes.func.isRequired,
@@ -357,18 +340,21 @@
results: PropTypes.array,
}).isRequired,
setModalClosed: PropTypes.func.isRequired,
setModalOpen: PropTypes.func.isRequired,
deleteManifestModalIsOpen: PropTypes.bool,
+ manifestActionInProgress: PropTypes.bool,
};
ManageManifestModal.defaultProps = {
disableManifestActions: false,
disabledReason: '',
canImportManifest: false,
canDeleteManifest: false,
+ isManifestImported: false,
canEditOrganizations: false,
deleteManifestModalIsOpen: false,
simpleContentAccess: false,
+ manifestActionInProgress: false,
};
export default ManageManifestModal;