webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js in katello-3.7.1.1 vs webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js in katello-3.8.0.rc1

- old
+ new

@@ -1,17 +1,15 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { Col, Tabs, Tab, Form, FormGroup, FormControl, ControlLabel, Row } from 'react-bootstrap'; +import { Col, Tabs, Tab, Form, FormGroup, FormControl, ControlLabel } from 'react-bootstrap'; import { bindMethods, Button, Icon, Modal, Spinner, OverlayTrigger, Tooltip } from 'patternfly-react'; import { isEqual } from 'lodash'; import TooltipButton from 'react-bootstrap-tooltip-button'; import { LoadingState } from '../../../move_to_pf/LoadingState'; import { Table } from '../../../move_to_foreman/components/common/table'; -import ConfirmDialog from '../../../move_to_foreman/components/common/ConfirmDialog'; -import { manifestExists } from '../SubscriptionHelpers'; import { columns } from './ManifestHistoryTableSchema'; -import { renderTaskStartedToast } from '../../Tasks/helpers'; +import ConfirmDialog from '../../../move_to_foreman/components/common/ConfirmDialog'; import DeleteManifestModalText from './DeleteManifestModalText'; import { BLOCKING_FOREMAN_TASK_TYPES, MANIFEST_TASKS_BULK_SEARCH_ID, } from '../SubscriptionConstants'; @@ -30,15 +28,19 @@ 'hideModal', 'saveOrganization', 'uploadManifest', 'refreshManifest', 'deleteManifest', + 'manifestExists', 'disabledTooltipText', - 'updateRepositoryUrl', ]); } + componentDidMount() { + this.loadData(); + } + static getDerivedStateFromProps(newProps, prevState) { if ( !isEqual(newProps.showModal, prevState.showModal) || !isEqual(newProps.taskInProgress, prevState.actionInProgress) ) { @@ -48,14 +50,10 @@ }; } return null; } - componentDidMount() { - this.loadData(); - } - componentDidUpdate(prevProp, prevState) { const { actionInProgress } = this.state; if (prevState.actionInProgress && !actionInProgress) { this.props.loadOrganization(); @@ -69,51 +67,36 @@ hideModal() { this.setState({ showModal: false, showDeleteManifestModalDialog: false }); this.props.onClose(); } - updateRepositoryUrl(event) { - this.setState({ redhat_repository_url: event.target.value }); + saveOrganization(event) { + this.props.saveOrganization({ redhat_repository_url: event.target.value }); } - saveOrganization() { - this.props.saveOrganization({ redhat_repository_url: this.state.redhat_repository_url }); - } - uploadManifest(fileList) { this.setState({ actionInProgress: true }); if (fileList.length > 0) { - this.props - .uploadManifest(fileList[0]) - .then(() => - this.props.bulkSearch({ - search_id: MANIFEST_TASKS_BULK_SEARCH_ID, - type: 'all', - active_only: true, - action_types: BLOCKING_FOREMAN_TASK_TYPES, - })) - .then(() => renderTaskStartedToast(this.props.taskDetails)); + this.props.uploadManifest(fileList[0]); } } refreshManifest() { this.props.refreshManifest(); this.setState({ actionInProgress: true }); } deleteManifest() { this.setState({ actionInProgress: true }); - this.props - .deleteManifest() + this.props.deleteManifest() .then(() => this.props.bulkSearch({ search_id: MANIFEST_TASKS_BULK_SEARCH_ID, type: 'all', active_only: true, action_types: BLOCKING_FOREMAN_TASK_TYPES, - })) - .then(() => renderTaskStartedToast(this.props.taskDetails)); + })); this.showDeleteManifestModal(false); } showDeleteManifestModal(show) { this.setState({ @@ -126,16 +109,19 @@ return __('This is disabled because a manifest task is in progress'); } return __('This is disabled because no manifest exists'); } + manifestExists() { + const { organization } = this.props; + + return organization.owner_details && organization.owner_details.upstreamConsumer; + } + render() { const { - manifestHistory, - organization, - disableManifestActions, - disabledReason, + manifestHistory, organization, disableManifestActions, disabledReason, } = this.props; const { actionInProgress } = this.state; const emptyStateData = () => ({ @@ -144,27 +130,17 @@ documentation: { title: __('Learn more about adding Subscription Manifests'), url: 'http://redhat.com', }, }); - const buttonLoading = ( - <span> - {__('Updating...')} - <span className="fa fa-spinner fa-spin" /> - </span>); + const getManifestName = () => { let name = __('No Manifest Uploaded'); - if ( - organization.owner_details && - organization.owner_details.upstreamConsumer - ) { - const link = [ - 'https://', - organization.owner_details.upstreamConsumer.webUrl, - organization.owner_details.upstreamConsumer.uuid, - ].join('/'); + if (organization.owner_details && organization.owner_details.upstreamConsumer) { + const link = ['https://', organization.owner_details.upstreamConsumer.webUrl, + organization.owner_details.upstreamConsumer.uuid].join('/'); name = ( <a href={link}>{organization.owner_details.upstreamConsumer.name}</a> ); } @@ -173,15 +149,11 @@ }; return ( <Modal show={this.state.showModal} onHide={this.hideModal}> <Modal.Header> - <button - className="close" - onClick={this.hideModal} - aria-label={__('Close')} - > + <button className="close" onClick={this.hideModal} aria-label={__('Close')}> <Icon type="pf" name="close" /> </button> <Modal.Title>{__('Manage Manifest')}</Modal.Title> </Modal.Header> <Modal.Body> @@ -189,47 +161,33 @@ <Tab eventKey={1} title={__('Manifest')}> <Form className="form-horizontal"> <h5>{__('Red Hat Provider Details')}</h5> <hr /> <FormGroup> - <Col sm={3}> - <ControlLabel htmlFor="cdnUrl"> - {__('Red Hat CDN URL')} - </ControlLabel> - </Col> + <ControlLabel className="col-sm-3" htmlFor="cdnUrl"> + {__('Red Hat CDN URL')} + </ControlLabel> <Col sm={9}> <FormControl id="cdnUrl" type="text" - value={this.state.redhat_repository_url || organization.redhat_repository_url || ''} - onChange={this.updateRepositoryUrl} + value={organization.redhat_repository_url || ''} + onChange={this.saveOrganization} /> </Col> </FormGroup> - <FormGroup> - <Col smOffset={3} sm={3}> - <Button onClick={this.saveOrganization} disabled={organization.loading}> - {organization.loading ? buttonLoading : __('Update')} - </Button> - </Col> - </FormGroup> <br /> <h5>{__('Subscription Manifest')}</h5> <hr /> <FormGroup> - <ControlLabel - className="col-sm-3 control-label" - htmlFor="usmaFile" - > + <ControlLabel className="col-sm-3 control-label" htmlFor="usmaFile"> <OverlayTrigger overlay={ - <Tooltip id="usma-tooltip"> - {__('Upstream Subscription Management Application')} - </Tooltip> - } + <Tooltip id="usma-tooltip">{__('Upstream Subscription Management Application')}</Tooltip> + } placement="bottom" trigger={['hover', 'focus']} rootClose={false} > <span>{__('USMA')}</span> @@ -253,21 +211,21 @@ onClick={this.refreshManifest} tooltipId="refresh-manifest-button-tooltip" tooltipText={disabledReason} tooltipPlacement="top" title={__('Refresh')} - disabled={!manifestExists(organization) || + disabled={!this.manifestExists() || actionInProgress || disableManifestActions} /> <TooltipButton onClick={() => this.showDeleteManifestModal(true)} tooltipId="delete-manifest-button-tooltip" tooltipText={this.disabledTooltipText()} tooltipPlacement="top" title={__('Delete')} - disabled={!manifestExists(organization) || actionInProgress} + disabled={!this.manifestExists() || actionInProgress} /> <ConfirmDialog show={this.state.showDeleteManifestModalDialog} title={__('Confirm delete manifest')} @@ -318,14 +276,12 @@ taskInProgress: PropTypes.bool.isRequired, manifestHistory: PropTypes.shape({}).isRequired, showModal: PropTypes.bool.isRequired, onClose: PropTypes.func, bulkSearch: PropTypes.func.isRequired, - taskDetails: PropTypes.shape({}), }; ManageManifestModal.defaultProps = { - taskDetails: undefined, disableManifestActions: false, disabledReason: '', onClose() {}, };