Merge pull request RedHatInsights#73 from Hyperkid123/platform-click

Platforms link
gmcculloug · Jan 24, 2019 · 0da385f · 0da385f
2 parents 39bd3a5 + a1fa765
commit 0da385f
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 13 deletions.
diff --git a/src/App.scss b/src/App.scss
@@ -34,3 +34,10 @@ ul.navigation-secondary {
 .toolbar-padding {
   padding: 24px 24px 0 24px
 }
+
+.card-link {
+  &:hover {
+    text-decoration: none;
+  }
+  cursor: pointer;
+}
diff --git a/src/PresentationalComponents/Platform/PlatformCard.js b/src/PresentationalComponents/Platform/PlatformCard.js
@@ -1,12 +1,13 @@
 import React from 'react';
-import './platformcard.scss';
 import propTypes from 'prop-types';
+import { Link } from 'react-router-dom';
+import { GridItem, Card, CardHeader, CardBody, CardFooter } from '@patternfly/react-core';
 import DefaultPlatformImg from '../../assets/images/platform-default.svg';
 import OpenshiftPlatformImg from '../../assets/images/platform-openshift.svg';
 import AmazonPlatformImg from '../../assets/images/platform-amazon.png';
 import ImageWithDefault from '../Shared/ImageWithDefault';
 import ItemDetails from '../Shared/CardCommon';
-import { GridItem, Card, CardHeader, CardBody, CardFooter } from '@patternfly/react-core';
+import './platformcard.scss';
 
 const TO_DISPLAY = [ 'description', 'modified' ];
 
@@ -24,16 +25,18 @@ const platformTypeImg = (sourceTypeId) => {
 
 const PlatformCard = ({ name, id, ...props }) => (
   <GridItem sm={ 6 } md={ 4 } lg={ 4 } xl={ 3 }>
-    <Card className="card_style" key={ id }>
-      <CardHeader className="pcard_header">
-        <ImageWithDefault src={ platformTypeImg(props.source_type_id || '0') } defaultSrc={ DefaultPlatformImg } width="80" height="40"/>
-      </CardHeader>
-      <CardBody className="pcard_body">
-        <h4>{ name }</h4>
-        <ItemDetails { ...{ name, ...props } } toDisplay={ TO_DISPLAY } />
-      </CardBody>
-      <CardFooter/>
-    </Card>
+    <Link to={ `/platform/${id}` } className="card-link">
+      <Card key={ id }>
+        <CardHeader className="pcard_header">
+          <ImageWithDefault src={ platformTypeImg(props.source_type_id || '0') } defaultSrc={ DefaultPlatformImg } width="80" height="40"/>
+        </CardHeader>
+        <CardBody className="pcard_body">
+          <h4>{ name }</h4>
+          <ItemDetails { ...{ name, ...props } } toDisplay={ TO_DISPLAY } />
+        </CardBody>
+        <CardFooter/>
+      </Card>
+    </Link>
   </GridItem>
 );
 

diff --git a/src/PresentationalComponents/Portfolio/PorfolioCard.js b/src/PresentationalComponents/Portfolio/PorfolioCard.js
@@ -34,7 +34,7 @@ const createToolbarActions = (portfolioName, portfolioId) => [
 
 const PortfolioCard = ({ imageUrl, name, id, ...props }) => (
   <GridItem sm={ 6 } md={ 4 } lg={ 4 } xl={ 3 }>
-    <Link style={ { textDecoration: 'none' } } to={ `/portfolio/${id}` }>
+    <Link className="card-link" to={ `/portfolio/${id}` }>
       <Card>
         <CardHeader className="card-image-header">
           <PortfolioCardHeader