katello 3.6.0.1.rc2 → 3.7.0.rc1

data/webpack/scenes/Subscriptions/Manifest/DeleteManifestModalText.js

@@ -0,0 +1,22 @@
+const question = __('Are you sure you want to delete the manifest?');
+const note = __(`Note: Deleting a subscription manifest is STRONGLY discouraged.
+                 Deleting a manifest will:`);
+const l1 = __('Delete all subscriptions that are attached to running hosts.');
+const l2 = __('Delete all subscriptions attached to activation keys.');
+const l3 = __('Disable Red Hat Insights.');
+const l4 = __(`Require you to upload the subscription-manifest and re-attach
+               subscriptions to hosts and activation keys.`);
+const debug = __(`This action should only be taken in extreme circumstances or
+                  for debugging purposes.`);
+
+const DeleteManifestModalText = `<p>${question}</p>
+<p>${note}</p>
+<ul class="list-aligned">
+  <li>${l1}</li>
+  <li>${l2}</li>
+  <li>${l3}</li>
+  <li>${l4}</li>
+</ul>
+<p>${debug}</p>`;
+
+export default DeleteManifestModalText;

data/webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js

@@ -0,0 +1,243 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { Col, Tabs, Tab, Form, FormGroup, FormControl, ControlLabel } from 'react-bootstrap';
+import { bindMethods, Button, Icon, Modal, Spinner, OverlayTrigger, Tooltip } from 'patternfly-react';
+import TooltipButton from 'react-bootstrap-tooltip-button';
+import { Table } from '../../../move_to_foreman/components/common/table';
+import { columns } from './ManifestHistoryTableSchema';
+import ConfirmDialog from '../../../move_to_foreman/components/common/ConfirmDialog';
+import DeleteManifestModalText from './DeleteManifestModalText';
+
+class ManageManifestModal extends Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      showModal: props.showModal,
+      actionInProgress: props.taskInProgress,
+      showDeleteManifestModalDialog: false,
+    };
+
+    bindMethods(this, [
+      'hideModal',
+      'saveOrganization',
+      'uploadManifest',
+      'refreshManifest',
+      'deleteManifest',
+    ]);
+  }
+
+  componentDidMount() {
+    this.loadData();
+  }
+
+  componentWillReceiveProps(props) {
+    this.setState({ showModal: props.showModal });
+    this.setState({ actionInProgress: props.taskInProgress });
+  }
+
+  loadData() {
+    this.props.loadManifestHistory();
+  }
+
+  hideModal() {
+    this.setState({ showModal: false, showDeleteManifestModalDialog: false });
+    this.props.onClose();
+  }
+
+  saveOrganization(event) {
+    this.props.saveOrganization({ redhat_repository_url: event.target.value });
+  }
+
+  uploadManifest(fileList) {
+    if (fileList.length > 0) {
+      this.props.uploadManifest(fileList[0]).then(this.props.loadOrganization);
+    }
+    this.setState({ actionInProgress: true });
+  }
+
+  refreshManifest() {
+    this.props.refreshManifest();
+    this.setState({ actionInProgress: true });
+  }
+
+  deleteManifest() {
+    this.props.deleteManifest().then(this.props.loadOrganization);
+    this.setState({ actionInProgress: true });
+    this.showDeleteManifestModal(false);
+  }
+
+  showDeleteManifestModal(show) {
+    this.setState({
+      showDeleteManifestModalDialog: show,
+    });
+  }
+
+  render() {
+    const {
+      manifestHistory, organization, disableManifestActions, disabledReason,
+    } = this.props;
+
+    const { actionInProgress } = this.state;
+
+    const emptyStateData = () => ({
+      header: __('There is no Manifest History to display.'),
+      description: __('Import a Manifest using the manifest tab above.'),
+      documentation: {
+        title: __('Learn more about adding Subscription Manifests'),
+        url: 'http://redhat.com',
+      },
+    });
+
+    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('/');
+
+        name = (
+          <a href={link}>{organization.owner_details.upstreamConsumer.name}</a>
+        );
+      }
+
+      return name;
+    };
+
+    return (
+      <Modal show={this.state.showModal} onHide={this.hideModal}>
+        <Modal.Header>
+          <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>
+          <Tabs id="manifest-history-tabs">
+            <Tab eventKey={1} title={__('Manifest')}>
+              <Form className="form-horizontal">
+                <h5>{__('Red Hat Provider Details')}</h5>
+                <hr />
+                <FormGroup>
+                  <ControlLabel className="col-sm-3" htmlFor="cdnUrl">
+                    {__('Red Hat CDN URL')}
+                  </ControlLabel>
+                  <Col sm={9}>
+                    <FormControl
+                      id="cdnUrl"
+                      type="text"
+                      value={organization.redhat_repository_url}
+                      onChange={this.saveOrganization}
+                    />
+                  </Col>
+                </FormGroup>
+                <br />
+
+                <h5>{__('Subscription Manifest')}</h5>
+                <hr />
+
+                <FormGroup>
+                  <ControlLabel className="col-sm-3 control-label" htmlFor="usmaFile">
+                    <OverlayTrigger
+                      overlay={
+                        <Tooltip id="usma-tooltip">{__('Upstream Subscription Management Application')}</Tooltip>
+                        }
+                      placement="bottom"
+                      trigger={['hover', 'focus']}
+                      rootClose={false}
+                    >
+                      <span>{__('USMA')}</span>
+                    </OverlayTrigger>
+                  </ControlLabel>
+
+                  <Col sm={9} className="manifest-actions">
+                    <Spinner loading={actionInProgress} inline />
+
+                    {getManifestName()}
+
+                    <FormControl
+                      id="usmaFile"
+                      type="file"
+                      accept=".zip"
+                      disabled={actionInProgress}
+                      onChange={e => this.uploadManifest(e.target.files)}
+                    />
+
+                    <TooltipButton
+                      onClick={this.refreshManifest}
+                      tooltipId="refresh-manifest-button-tooltip"
+                      tooltipText={disabledReason}
+                      tooltipPlacement="top"
+                      title={__('Refresh')}
+                      disabled={actionInProgress || disableManifestActions}
+                    />
+
+                    <TooltipButton
+                      onClick={() => this.showDeleteManifestModal(true)}
+                      tooltipId="delete-manifest-button-tooltip"
+                      tooltipText={__('This is disabled because a manifest task is in progress.')}
+                      tooltipPlacement="top"
+                      title={__('Delete')}
+                      disabled={actionInProgress}
+                    />
+
+                    <ConfirmDialog
+                      show={this.state.showDeleteManifestModalDialog}
+                      title={__('Confirm delete manifest')}
+                      dangerouslySetInnerHTML={{
+                        __html: DeleteManifestModalText,
+                      }}
+                      confirmLabel={__('Delete')}
+                      confirmStyle="danger"
+                      onConfirm={() => this.deleteManifest()}
+                      onCancel={() => this.showDeleteManifestModal(false)}
+                    />
+                  </Col>
+                </FormGroup>
+              </Form>
+            </Tab>
+
+            <Tab eventKey={2} title={__('Manifest History')}>
+              <Spinner loading={manifestHistory.loading} className="small-spacer">
+                <Table
+                  rows={manifestHistory.results}
+                  columns={columns}
+                  emptyState={emptyStateData()}
+                />
+              </Spinner>
+            </Tab>
+          </Tabs>
+        </Modal.Body>
+        <Modal.Footer>
+          <Button bsStyle="primary" onClick={this.hideModal}>
+            {__('Close')}
+          </Button>
+        </Modal.Footer>
+      </Modal>
+    );
+  }
+}
+
+ManageManifestModal.propTypes = {
+  uploadManifest: PropTypes.func.isRequired,
+  refreshManifest: PropTypes.func.isRequired,
+  deleteManifest: PropTypes.func.isRequired,
+  loadManifestHistory: PropTypes.func.isRequired,
+  organization: PropTypes.shape({}).isRequired,
+  disableManifestActions: PropTypes.bool,
+  disabledReason: PropTypes.string,
+  loadOrganization: PropTypes.func.isRequired,
+  saveOrganization: PropTypes.func.isRequired,
+  taskInProgress: PropTypes.bool.isRequired,
+  manifestHistory: PropTypes.shape({}).isRequired,
+  showModal: PropTypes.bool.isRequired,
+  onClose: PropTypes.func,
+};
+
+ManageManifestModal.defaultProps = {
+  disableManifestActions: false,
+  disabledReason: '',
+  onClose() {},
+};
+
+export default ManageManifestModal;

data/webpack/scenes/Subscriptions/Manifest/Manifest.scss

@@ -0,0 +1,3 @@
+.manifest-actions > * {
+  margin: 10px 5px 0 0 ;
+}

data/webpack/scenes/Subscriptions/Manifest/ManifestActions.js

@@ -0,0 +1,114 @@
+import api, { orgId } from '../../../services/api';
+import { propsToSnakeCase } from '../../../services/index';
+
+import {
+  UPLOAD_MANIFEST_REQUEST,
+  UPLOAD_MANIFEST_SUCCESS,
+  UPLOAD_MANIFEST_FAILURE,
+  REFRESH_MANIFEST_REQUEST,
+  REFRESH_MANIFEST_SUCCESS,
+  REFRESH_MANIFEST_FAILURE,
+  DELETE_MANIFEST_REQUEST,
+  DELETE_MANIFEST_SUCCESS,
+  DELETE_MANIFEST_FAILURE,
+  MANIFEST_HISTORY_REQUEST,
+  MANIFEST_HISTORY_SUCCESS,
+  MANIFEST_HISTORY_FAILURE,
+} from './ManifestConstants';
+
+export const uploadManifest = file => (dispatch) => {
+  dispatch({ type: UPLOAD_MANIFEST_REQUEST });
+
+  const formData = new FormData();
+  formData.append('content', file);
+
+  const config = {
+    'Content-Type': 'multipart/form-data',
+  };
+
+  return api
+    .post(`/organizations/${orgId}/subscriptions/upload`, formData, config)
+    .then(({ data }) => {
+      dispatch({
+        type: UPLOAD_MANIFEST_SUCCESS,
+        response: data,
+      });
+    })
+    .catch((result) => {
+      dispatch({
+        type: UPLOAD_MANIFEST_FAILURE,
+        result,
+      });
+    });
+};
+
+export const refreshManifest = (extendedParams = {}) => (dispatch) => {
+  dispatch({ type: REFRESH_MANIFEST_REQUEST });
+
+  const params = {
+    ...propsToSnakeCase(extendedParams),
+  };
+
+  return api
+    .put(`/organizations/${orgId}/subscriptions/refresh_manifest`, {}, params)
+    .then(({ data }) => {
+      dispatch({
+        type: REFRESH_MANIFEST_SUCCESS,
+        response: data,
+      });
+    })
+    .catch((result) => {
+      dispatch({
+        type: REFRESH_MANIFEST_FAILURE,
+        result,
+      });
+    });
+};
+
+export const deleteManifest = (extendedParams = {}) => (dispatch) => {
+  dispatch({ type: DELETE_MANIFEST_REQUEST });
+
+  const params = {
+    ...propsToSnakeCase(extendedParams),
+  };
+
+  return api
+    .post(`/organizations/${orgId}/subscriptions/delete_manifest`, {}, params)
+    .then(({ data }) => {
+      dispatch({
+        type: DELETE_MANIFEST_SUCCESS,
+        response: data,
+      });
+    })
+    .catch((result) => {
+      dispatch({
+        type: DELETE_MANIFEST_FAILURE,
+        result,
+      });
+    });
+};
+
+export const loadManifestHistory = (extendedParams = {}) => (dispatch) => {
+  dispatch({ type: MANIFEST_HISTORY_REQUEST });
+
+  const params = {
+    ...propsToSnakeCase(extendedParams),
+  };
+
+  return api
+    .get(`/organizations/${orgId}/subscriptions/manifest_history`, {}, params)
+    .then(({ data }) => {
+      dispatch({
+        type: MANIFEST_HISTORY_SUCCESS,
+        response: data,
+      });
+    })
+    .catch((result) => {
+      dispatch({
+        type: MANIFEST_HISTORY_FAILURE,
+        result,
+      });
+    });
+};
+
+export default loadManifestHistory;

data/webpack/scenes/Subscriptions/Manifest/ManifestConstants.js

@@ -0,0 +1,15 @@
+export const UPLOAD_MANIFEST_REQUEST = 'UPLOAD_MANIFEST_REQUEST';
+export const UPLOAD_MANIFEST_SUCCESS = 'UPLOAD_MANIFEST_SUCCESS';
+export const UPLOAD_MANIFEST_FAILURE = 'UPLOAD_MANIFEST_FAILURE';
+
+export const REFRESH_MANIFEST_REQUEST = 'REFRESH_MANIFEST_REQUEST';
+export const REFRESH_MANIFEST_SUCCESS = 'REFRESH_MANIFEST_SUCCESS';
+export const REFRESH_MANIFEST_FAILURE = 'REFRESH_MANIFEST_FAILURE';
+
+export const DELETE_MANIFEST_REQUEST = 'DELETE_MANIFEST_REQUEST';
+export const DELETE_MANIFEST_SUCCESS = 'DELETE_MANIFEST_SUCCESS';
+export const DELETE_MANIFEST_FAILURE = 'DELETE_MANIFEST_FAILURE';
+
+export const MANIFEST_HISTORY_REQUEST = 'MANIFEST_HISTORY_REQUEST';
+export const MANIFEST_HISTORY_SUCCESS = 'MANIFEST_HISTORY_SUCCESS';
+export const MANIFEST_HISTORY_FAILURE = 'MANIFEST_HISTORY_FAILURE';

data/webpack/scenes/Subscriptions/Manifest/ManifestHistoryReducer.js

@@ -0,0 +1,34 @@
+import Immutable from 'seamless-immutable';
+
+import {
+  MANIFEST_HISTORY_REQUEST,
+  MANIFEST_HISTORY_SUCCESS,
+  MANIFEST_HISTORY_FAILURE,
+} from './ManifestConstants';
+
+const initialState = Immutable({ loading: true, results: [] });
+
+export default (state = initialState, action) => {
+  switch (action.type) {
+    case MANIFEST_HISTORY_REQUEST:
+      return state.set('loading', true);
+
+    case MANIFEST_HISTORY_SUCCESS: {
+      const results = action.response;
+
+      return state.merge({
+        results,
+        loading: false,
+      });
+    }
+
+    case MANIFEST_HISTORY_FAILURE:
+      return state.merge({
+        error: action.error,
+        loading: false,
+      });
+
+    default:
+      return state;
+  }
+};

data/webpack/scenes/Subscriptions/Manifest/ManifestHistoryTableSchema.js

@@ -0,0 +1,46 @@
+import { headerFormat, cellFormat } from '../../../move_to_foreman/components/common/table';
+
+export const columns = [
+  {
+    property: 'status',
+    header: {
+      label: __('Status'),
+      formatters: [headerFormat],
+      props: {
+        index: 0,
+      },
+    },
+    cell: {
+      formatters: [cellFormat],
+    },
+  },
+  {
+    property: 'statusMessage',
+    header: {
+      label: __('Message'),
+      formatters: [headerFormat],
+      props: {
+        index: 1,
+      },
+    },
+    cell: {
+      formatters: [cellFormat],
+    },
+  },
+  // TODO: use date formatter from tomas' PR
+  {
+    property: 'created',
+    header: {
+      label: __('Timestamp'),
+      formatters: [headerFormat],
+      props: {
+        index: 2,
+      },
+    },
+    cell: {
+      formatters: [cellFormat],
+    },
+  },
+];
+
+export default columns;