fixed issue where ShowPage wasnot re-rendering on new props
This commit is contained in:
parent
aeaab8bf2d
commit
a5f383aff8
2 changed files with 17 additions and 5 deletions
|
@ -1,7 +1,9 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
|
||||||
const AssetPreview = ({ name, claimId, fileExt, contentType }) => {
|
const AssetPreview = ({ name, claimId, fileExt, contentType }) => {
|
||||||
const directSourceLink = `${claimId}/${name}.${fileExt}`;
|
const directSourceLink = `${claimId}/${name}.${fileExt}`;
|
||||||
|
const showUrlLink = `${claimId}/${name}`;
|
||||||
const previewHolderStyle = {
|
const previewHolderStyle = {
|
||||||
clear: 'both',
|
clear: 'both',
|
||||||
display: 'inline-block',
|
display: 'inline-block',
|
||||||
|
@ -21,7 +23,9 @@ const AssetPreview = ({ name, claimId, fileExt, contentType }) => {
|
||||||
case 'image/png':
|
case 'image/png':
|
||||||
return (
|
return (
|
||||||
<div style={previewHolderStyle}>
|
<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>
|
</div>
|
||||||
);
|
);
|
||||||
case 'image/gif':
|
case 'image/gif':
|
||||||
|
|
|
@ -20,17 +20,25 @@ class ShowPage extends React.Component {
|
||||||
}
|
}
|
||||||
componentDidMount () {
|
componentDidMount () {
|
||||||
console.log('ShowPage did mount');
|
console.log('ShowPage did mount');
|
||||||
this.parseUrlAndUpdateState();
|
|
||||||
}
|
|
||||||
parseUrlAndUpdateState () {
|
|
||||||
const identifier = this.props.match.params.identifier;
|
const identifier = this.props.match.params.identifier;
|
||||||
const claim = this.props.match.params.claim;
|
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) {
|
if (identifier) {
|
||||||
return this.parseAndUpdateIdentifierAndClaim(identifier, claim);
|
return this.parseAndUpdateIdentifierAndClaim(identifier, claim);
|
||||||
}
|
}
|
||||||
this.parseAndUpdateClaimOnly(claim);
|
this.parseAndUpdateClaimOnly(claim);
|
||||||
}
|
}
|
||||||
parseAndUpdateIdentifierAndClaim(identifier, claim) {
|
parseAndUpdateIdentifierAndClaim (identifier, claim) {
|
||||||
// handle case of identifier and claim
|
// handle case of identifier and claim
|
||||||
// this is a request for an asset
|
// this is a request for an asset
|
||||||
// claim will be an asset claim
|
// claim will be an asset claim
|
||||||
|
|
Loading…
Reference in a new issue