From a5f383aff80830b47afaf1bb23ed7e7e44ee2a5c Mon Sep 17 00:00:00 2001
From: bill bittner <bittner.w@gmail.com>
Date: Wed, 31 Jan 2018 14:50:35 -0800
Subject: [PATCH] fixed issue where ShowPage wasnot re-rendering on new props

---
 react/components/AssetPreview/index.js |  6 +++++-
 react/components/ShowPage/index.js     | 16 ++++++++++++----
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/react/components/AssetPreview/index.js b/react/components/AssetPreview/index.js
index 79eefb3c..f298949b 100644
--- a/react/components/AssetPreview/index.js
+++ b/react/components/AssetPreview/index.js
@@ -1,7 +1,9 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 
 const AssetPreview = ({ name, claimId, fileExt, contentType }) => {
   const directSourceLink = `${claimId}/${name}.${fileExt}`;
+  const showUrlLink = `${claimId}/${name}`;
   const previewHolderStyle = {
     clear: 'both',
     display: 'inline-block',
@@ -21,7 +23,9 @@ const AssetPreview = ({ name, claimId, fileExt, contentType }) => {
     case 'image/png':
       return (
         <div style={previewHolderStyle}>
-          <img style={assetStyle} className={'asset-preview--image'} src={directSourceLink} alt={name} />
+          <Link to={showUrlLink} >
+            <img style={assetStyle} className={'asset-preview--image'} src={directSourceLink} alt={name} />
+          </Link>
         </div>
       );
     case 'image/gif':
diff --git a/react/components/ShowPage/index.js b/react/components/ShowPage/index.js
index ef3e4c20..6945e729 100644
--- a/react/components/ShowPage/index.js
+++ b/react/components/ShowPage/index.js
@@ -20,17 +20,25 @@ class ShowPage extends React.Component {
   }
   componentDidMount () {
     console.log('ShowPage did mount');
-    this.parseUrlAndUpdateState();
-  }
-  parseUrlAndUpdateState () {
     const identifier = this.props.match.params.identifier;
     const claim = this.props.match.params.claim;
+    this.parseUrlAndUpdateState(identifier, claim);
+  }
+  componentWillReceiveProps (nextProps) {
+    if (this.props.match.params !== nextProps.match.params) {
+      console.log('received new params props');
+      const identifier = nextProps.match.params.identifier;
+      const claim = nextProps.match.params.claim;
+      this.parseUrlAndUpdateState(identifier, claim);
+    }
+  }
+  parseUrlAndUpdateState (identifier, claim) {
     if (identifier) {
       return this.parseAndUpdateIdentifierAndClaim(identifier, claim);
     }
     this.parseAndUpdateClaimOnly(claim);
   }
-  parseAndUpdateIdentifierAndClaim(identifier, claim) {
+  parseAndUpdateIdentifierAndClaim (identifier, claim) {
     // handle case of identifier and claim
     // this is a request for an asset
     // claim will be an asset claim