webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js in katello-4.12.1 vs webpack/scenes/Subscriptions/Manifest/ManageManifestModal.js in katello-4.13.0.rc1

@@ -1,9 +1,12 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { Grid, Col, Row, Tabs, Tab, FormControl, ControlLabel } from 'react-bootstrap';
+import { FormattedMessage } from 'react-intl';
 import { Button, Spinner } from 'patternfly-react';
+import { Alert } from '@patternfly/react-core';
+import { propsToCamelCase } from 'foremanReact/common/helpers';
 import ForemanModal from 'foremanReact/components/ForemanModal';
 import Slot from 'foremanReact/components/common/Slot';
 import { translate as __ } from 'foremanReact/common/I18n';
 import TooltipButton from '../../../components/TooltipButton';
 import { LoadingState } from '../../../components/LoadingState';
@@ -90,26 +93,33 @@
       taskInProgress,
       manifestActionStarted,
       contentCredentials,
     } = this.props;
 
+    const {
+      manifestExpiringSoon,
+      manifestExpired,
+      manifestExpirationDate,
+      manifestExpireDaysRemaining,
+    } = propsToCamelCase(organization);
+
     const actionInProgress = (taskInProgress || manifestActionStarted);
     const showCdnConfigurationTab = canEditOrganizations;
     const showSubscriptionManifest = (canImportManifest || canDeleteManifest);
     const showManifestTab = (canEditOrganizations || showSubscriptionManifest);
 
     const emptyStateData = () => ({
-      header: __('There is no Manifest History to display.'),
-      description: __('Import a Manifest using the manifest tab above.'),
+      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 '),
+        label: __('Learn more about adding subscription manifests '),
         url: 'https://access.redhat.com/solutions/3410771',
       },
     });
 
     const getManifestName = () => {
-      let name = __('No Manifest Uploaded');
+      let name = __('No manifest imported');
 
       if (
         organization.owner_details &&
         organization.owner_details.upstreamConsumer
       ) {
@@ -137,25 +147,74 @@
             >
                 {showSubscriptionManifest &&
                   <React.Fragment>
                     <Grid>
                       <h3>{__('Subscription Manifest')}</h3>
+                      {manifestExpiringSoon &&
+                        <Alert
+                          ouiaId="manifest-expiring-soon-alert"
+                          variant="warning"
+                          title={__('Manifest expiring soon')}
+                        >
+                          <FormattedMessage
+                            defaultMessage={__('Your manifest will expire in {daysMessage}. To extend the expiration date, refresh your manifest. Or, if your Foreman is disconnected, import a new manifest.')}
+                            values={{
+                              daysMessage: (
+                                <FormattedMessage
+                                  defaultMessage="{daysRemaining, plural, one {{singular}} other {# {plural}}}"
+                                  values={{
+                                    daysRemaining: manifestExpireDaysRemaining,
+                                    singular: __('day'),
+                                    plural: __('days'),
+                                  }}
+                                  id="manage-manifest-expire-days-i18n"
+                                />
+                              ),
+                            }}
+                            id="manage-manifest-expire-i18n"
+                          />
+                        </Alert>
+                      }
+                      {manifestExpired && isManifestImported &&
+                        <Alert
+                          ouiaId="manifest-expired-alert"
+                          variant="danger"
+                          title={__('Manifest expired')}
+                        >
+                          <FormattedMessage
+                            defaultMessage={__('Your manifest expired on {expirationDate}. To continue using Red Hat content, import a new manifest.')}
+                            values={{
+                              expirationDate: new Date(manifestExpirationDate).toDateString(),
+                            }}
+                            id="manage-manifest-expired-i18n"
+                          />
+                        </Alert>
+                      }
                       <hr />
                       <Row>
                         <Col sm={5}>
                           <strong>{__('Manifest')}</strong>
                         </Col>
                         <Col sm={7}>
                           {getManifestName()}
                         </Col>
                       </Row>
+                      {isManifestImported && manifestExpirationDate &&
+                        <Row>
+                          <Col sm={5} />
+                          <Col sm={7}>
+                            {manifestExpired ? __('Expired ') : __('Expires ')}
+                            {new Date(manifestExpirationDate).toDateString()}
+                          </Col>
+                        </Row>
+                      }
                       <Row>
                         <Col sm={5}>
                           {canImportManifest &&
                           <ControlLabel
                             style={{ paddingTop: '10px' }}
                           >
-                            <div>{__('Import New Manifest')}</div>
+                            <div>{__('Import new manifest')}</div>
                           </ControlLabel>
                           }
                         </Col>
                         <Col sm={7} className="manifest-actions">
                           <Spinner loading={actionInProgress} />