Add errata link to about dialog and cluster settings page

frontend/public/components/about-modal.tsx

@@ -6,11 +6,11 @@ import { Link } from 'react-router-dom';
 import { FLAGS } from '../const';
 import { connectToFlags } from '../reducers/features';
 import { getBrandingDetails } from './masthead';
-import { Firehose } from './utils';
+import { ExternalLink, Firehose } from './utils';
 import { ClusterVersionModel } from '../models';
 import { ClusterVersionKind, referenceForModel } from '../module/k8s';
 import { k8sVersion } from '../module/status';
-import { hasAvailableUpdates, getK8sGitVersion, getOpenShiftVersion, getClusterID } from '../module/k8s/cluster-settings';
+import { hasAvailableUpdates, getK8sGitVersion, getOpenShiftVersion, getClusterID, getErrataLink } from '../module/k8s/cluster-settings';
 
 const AboutModalItems: React.FC<AboutModalItemsProps> = ({closeAboutModal, cv}) => {
   const [kubernetesVersion, setKubernetesVersion] = React.useState('');
@@ -24,6 +24,7 @@ const AboutModalItems: React.FC<AboutModalItemsProps> = ({closeAboutModal, cv})
   const clusterID = getClusterID(clusterVersion);
   const channel: string = _.get(cv, 'data.spec.channel');
   const openshiftVersion = getOpenShiftVersion(clusterVersion);
+  const errataLink = getErrataLink(clusterVersion);
   return (
     <React.Fragment>
       {clusterVersion && hasAvailableUpdates(clusterVersion) && <Alert className="co-alert co-about-modal__alert" variant="info" title={<React.Fragment>Update available. <Link to="/settings/cluster" onClick={closeAboutModal}>View Cluster Settings</Link></React.Fragment>} />}
@@ -32,7 +33,10 @@ const AboutModalItems: React.FC<AboutModalItemsProps> = ({closeAboutModal, cv})
           {openshiftVersion && (
             <React.Fragment>
               <TextListItem component="dt">OpenShift Version</TextListItem>
-              <TextListItem component="dd" className="co-select-to-copy">{openshiftVersion}</TextListItem>
+              <TextListItem component="dd">
+                <div className="co-select-to-copy">{openshiftVersion}</div>
+                {errataLink && <div><ExternalLink text="View Errata" href={errataLink} /></div>}
+              </TextListItem>
             </React.Fragment>
           )}
           <TextListItem component="dt">Kubernetes Version</TextListItem>

frontend/public/components/cluster-settings/cluster-settings.tsx

@@ -19,15 +19,16 @@ import {
   ClusterVersionKind,
   clusterVersionReference,
   getAvailableClusterUpdates,
+  getClusterID,
   getClusterUpdateStatus,
   getClusterVersionCondition,
   getDesiredClusterVersion,
+  getErrataLink,
   getLastCompletedUpdate,
   k8sPatch,
   K8sResourceConditionStatus,
   K8sResourceKind,
   referenceForModel,
-  getClusterID,
 } from '../../module/k8s';
 import {
   EmptyBox,
@@ -155,6 +156,7 @@ export const CurrentVersionHeader: React.SFC<CurrentVersionProps> = ({cv}) => {
 export const ClusterVersionDetailsTable: React.SFC<ClusterVersionDetailsTableProps> = ({obj: cv, autoscalers}) => {
   const { history = [] } = cv.status;
   const clusterID = getClusterID(cv);
+  const errataLink = getErrataLink(cv);
   const desiredImage: string = _.get(cv, 'status.desired.image') || '';
   // Split image on `@` to emphasize the digest.
   const imageParts = desiredImage.split('@');
@@ -222,7 +224,9 @@ export const ClusterVersionDetailsTable: React.SFC<ClusterVersionDetailsTablePro
       </div>
     </div>
     <div className="co-m-pane__body">
-      <SectionHeading text="Update History" />
+      <SectionHeading text="Update History">
+        {errataLink && <small><ExternalLink text="View Errata" href={errataLink} /></small>}
+      </SectionHeading>
       {_.isEmpty(history)
         ? <EmptyBox label="History" />
         : <div className="co-table-container">

frontend/public/module/k8s/cluster-settings.ts

@@ -1,4 +1,5 @@
 import * as _ from 'lodash-es';
+import * as semver from 'semver';
 
 import { ClusterVersionModel } from '../../models';
 import { referenceForModel } from './k8s';
@@ -96,6 +97,23 @@ export const getOpenShiftVersion = (cv: ClusterVersionKind): string => {
   return lastUpdate.state === 'Partial' ? `Updating to ${lastUpdate.version}` : lastUpdate.version;
 };
 
+// example link: https://access.redhat.com/downloads/content/290/ver=4.1/rhel---7/4.1.13/x86_64/product-errata
+export const getErrataLink = (cv: ClusterVersionKind): string => {
+  const version: string = _.get(cv, 'status.history[0].version');
+  if (!version) {
+    return null;
+  }
+
+  const parsed = semver.parse(version);
+  if (!parsed) {
+    return null;
+  }
+
+  // TODO: Determine architecture instead of assuming x86_64.
+  const { major, minor, patch } = parsed;
+  return `https://access.redhat.com/downloads/content/290/ver=${major}.${minor}/rhel---7/${major}.${minor}.${patch}/x86_64/product-errata`;
+};
+
 export const getClusterName = (): string => window.SERVER_FLAGS.kubeAPIServerURL || null;
 
 export const getClusterID = (cv: ClusterVersionKind): string => _.get(cv, 'spec.clusterID');