INTLY-2213: Add Integreatly version to About (#468)

* add integreatly ver to about and fix console error * fix spacing * fix tests * add Integreatly Version
integr8ly · Jun 12, 2019 · a02babf · a02babf
1 parent 87406c5
commit a02babf
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 16 deletions.
diff --git a/server.js b/server.js
@@ -489,6 +489,7 @@ function getWalkthroughHeader(basePath) {
 function getMockConfigData() {
   return `window.OPENSHIFT_CONFIG = {
     masterUri: 'mock-openshift-console-url',
+    integreatlyVersion: '${process.env.INTEGREATLY_VERSION || ''}',
     threescaleWildcardDomain: '${process.env.THREESCALE_WILDCARD_DOMAIN || ''}',
     mockData: {
       serviceInstances: [
@@ -601,9 +602,10 @@ function getConfigData(req) {
     masterUri: 'https://${process.env.OPENSHIFT_HOST}',
     wssMasterUri: 'wss://${process.env.OPENSHIFT_HOST}',
     ssoLogoutUri: 'https://${
-    process.env.SSO_ROUTE
+      process.env.SSO_ROUTE
     }/auth/realms/openshift/protocol/openid-connect/logout?redirect_uri=${logoutRedirectUri}',
-    threescaleWildcardDomain: '${process.env.THREESCALE_WILDCARD_DOMAIN || ''}'
+    threescaleWildcardDomain: '${process.env.THREESCALE_WILDCARD_DOMAIN || ''}',
+    integreatlyVersion: '${process.env.INTEGREATLY_VERSION || ''}'
   };`;
 }
 

diff --git a/src/components/aboutModal/__tests__/__snapshots__/aboutModal.test.js.snap b/src/components/aboutModal/__tests__/__snapshots__/aboutModal.test.js.snap
@@ -20,8 +20,8 @@ exports[`AboutModal Component should render a non-connected component: hidden mo
     heroimagealt="Red Hat Solutions Explorer background image"
     heroimagesrc="PF4DownstreamBG.svg"
     isOpen={false}
-    logoImageAlt="Red Hat Solutions Explorer logo"
-    logoImageSrc="logo-alt.svg"
+    logoImageAlt=""
+    logoImageSrc=""
     noAboutModalBoxContentContainer={false}
     onClose={null}
     productName="Red Hat Solution Explorer"
@@ -39,8 +39,8 @@ exports[`AboutModal Component should render a non-connected component: hidden mo
         heroimagealt="Red Hat Solutions Explorer background image"
         heroimagesrc="PF4DownstreamBG.svg"
         isOpen={false}
-        logoImageAlt="Red Hat Solutions Explorer logo"
-        logoImageSrc="logo-alt.svg"
+        logoImageAlt=""
+        logoImageSrc=""
         noAboutModalBoxContentContainer={false}
         onClose={null}
         productName="Red Hat Solution Explorer"
@@ -71,8 +71,8 @@ exports[`AboutModal Component should render a non-connected component: show moda
     heroimagealt="Red Hat Solutions Explorer background image"
     heroimagesrc="PF4DownstreamBG.svg"
     isOpen={false}
-    logoImageAlt="Red Hat Solutions Explorer logo"
-    logoImageSrc="logo-alt.svg"
+    logoImageAlt=""
+    logoImageSrc=""
     noAboutModalBoxContentContainer={false}
     onClose={null}
     productName="Red Hat Solution Explorer"
@@ -90,8 +90,8 @@ exports[`AboutModal Component should render a non-connected component: show moda
         heroimagealt="Red Hat Solutions Explorer background image"
         heroimagesrc="PF4DownstreamBG.svg"
         isOpen={false}
-        logoImageAlt="Red Hat Solutions Explorer logo"
-        logoImageSrc="logo-alt.svg"
+        logoImageAlt=""
+        logoImageSrc=""
         noAboutModalBoxContentContainer={false}
         onClose={null}
         productName="Red Hat Solution Explorer"

diff --git a/src/components/aboutModal/aboutModal.js b/src/components/aboutModal/aboutModal.js
@@ -4,7 +4,6 @@ import PropTypes from 'prop-types';
 import { AboutModal as PfAboutModal, TextContent, TextList, TextListItem } from '@patternfly/react-core';
 
 import { detect } from 'detect-browser';
-import solutionsExplorerLogo from '../../img/logo-alt.svg';
 import redHatLogo from '../../img/Logo-RedHat-Hat-Color-RGB.png';
 import pfBackgroundImage from '../../img/PF4DownstreamBG.svg';
 
@@ -31,12 +30,14 @@ class AboutModal extends React.Component {
           heroimagealt="Red Hat Solutions Explorer background image"
           brandImageSrc={redHatLogo}
           brandImageAlt="Red Hat logo"
-          logoImageSrc={solutionsExplorerLogo}
-          logoImageAlt="Red Hat Solutions Explorer logo"
         >
           <TextContent>
             <TextList component="dl">
-              <TextListItem component="dt">Web App Version</TextListItem>
+              <TextListItem component="dt">Integreatly Version</TextListItem>
+              <TextListItem component="dd">
+                {window.OPENSHIFT_CONFIG ? window.OPENSHIFT_CONFIG.integreatlyVersion : ' '}
+              </TextListItem>
+              <TextListItem component="dt">Console Version</TextListItem>
               <TextListItem component="dd">{pkgJson.version}</TextListItem>
               <TextListItem component="dt">User Name</TextListItem>
               <TextListItem component="dd">{window.localStorage.getItem('currentUserName')}</TextListItem>

diff --git a/src/components/tutorialDashboard/tutorialDashboard.js b/src/components/tutorialDashboard/tutorialDashboard.js
@@ -110,7 +110,10 @@ const TutorialDashboard = props => {
         );
       });
       htmlSnippet.push(
-        <div className="integr8ly-tutorial-dashboard-title pf-u-display-flex pf-u-py-sm">
+        <div
+          className="integr8ly-tutorial-dashboard-title pf-u-display-flex pf-u-py-sm"
+          key={`category-${allRepos[i]}`}
+        >
           {addCategory(filteredWalkthroughs)}
           <div className="integr8ly-walkthrough-counter pf-u-mt-md pf-u-mr-md pf-u-text-align-right pf-m-sm">
             {filteredWalkthroughs.length === 1 ? (
@@ -121,7 +124,11 @@ const TutorialDashboard = props => {
           </div>
         </div>
       );
-      htmlSnippet.push(<Gallery gutter="md">{cards}</Gallery>);
+      htmlSnippet.push(
+        <Gallery gutter="md" key={`gallery-${allRepos[i]}`}>
+          {cards}
+        </Gallery>
+      );
     }
     return htmlSnippet;
   }