From 0a541b6dd923f0dae5fe2f76b1cb061c3e6cff41 Mon Sep 17 00:00:00 2001
From: bill bittner <bittner.w@gmail.com>
Date: Sun, 4 Feb 2018 16:40:28 -0800
Subject: [PATCH] added proptype checks to components
---
react/components/AssetDisplay/index.js | 3 +-
react/components/AssetInfo/index.js | 17 +++++++++--
react/components/AssetPreview/index.js | 11 ++++---
react/components/ShowAssetDetails/index.js | 16 +++++-----
react/components/ShowAssetLite/index.js | 6 ++++
.../containers/ChannelClaimsDisplay/view.jsx | 4 ---
react/containers/ShowAsset/view.jsx | 29 ++++++++++++-------
7 files changed, 54 insertions(+), 32 deletions(-)
diff --git a/react/components/AssetDisplay/index.js b/react/components/AssetDisplay/index.js
index 973f47c3..66b4e989 100644
--- a/react/components/AssetDisplay/index.js
+++ b/react/components/AssetDisplay/index.js
@@ -1,8 +1,8 @@
import React from 'react';
+import PropTypes from 'prop-types';
import ProgressBar from 'components/ProgressBar';
import Request from 'utils/request';
import { LOCAL_CHECK, SEARCHING, UNAVAILABLE, AVAILABLE } from 'constants/asset_display_states';
-import PropTypes from 'prop-types';
class AssetDisplay extends React.Component {
constructor (props) {
@@ -128,7 +128,6 @@ AssetDisplay.propTypes = {
contentType: PropTypes.string.isRequired,
fileExt : PropTypes.string.isRequired,
thumbnail : PropTypes.string,
- // shortId : PropTypes.string.isRequired,
};
export default AssetDisplay;
diff --git a/react/components/AssetInfo/index.js b/react/components/AssetInfo/index.js
index b0ab729f..1cf29044 100644
--- a/react/components/AssetInfo/index.js
+++ b/react/components/AssetInfo/index.js
@@ -1,11 +1,12 @@
import React from 'react';
+import PropTypes from 'prop-types';
class AssetInfo extends React.Component {
constructor (props) {
super(props);
this.state = {
showDetails: false,
- }
+ };
this.toggleDetails = this.toggleDetails.bind(this);
this.copyToClipboard = this.copyToClipboard.bind(this);
}
@@ -80,7 +81,7 @@ class AssetInfo extends React.Component {
{(this.props.contentType === 'video/mp4') ? (
<input type="text" id="embed-text" className="input-disabled input-text--full-width" readOnly
onClick={this.select} spellCheck="false"
- value={`<video width="100%" controls poster="${this.props.thumbnail}" src="${this.props.host}/{claimInfo.claimId}/${this.props.name}.${this.props.fileExt}"/></video>`}/>
+ value={`<video width="100%" controls poster="${this.props.thumbnail}" src="${this.props.host}/${this.props.claimId}/${this.props.name}.${this.props.fileExt}"/></video>`}/>
) : (
<input type="text" id="embed-text" className="input-disabled input-text--full-width" readOnly
onClick={this.select} spellCheck="false"
@@ -162,5 +163,17 @@ class AssetInfo extends React.Component {
// required props
// {channelName, certificateId, description, shortClaimId, name, fileExt, claimId, contentType, thumbnail, host}
+AssetInfo.propTypes = {
+ channelName : PropTypes.string,
+ certificateId: PropTypes.string,
+ description : PropTypes.string,
+ // shortClaimId : PropsTypes.string.isRequired,
+ name : PropTypes.string.isRequired,
+ claimId : PropTypes.string.isRequired,
+ contentType : PropTypes.string.isRequired,
+ fileExt : PropTypes.string.isRequired,
+ thumbnail : PropTypes.string,
+ host : PropTypes.string.isRequired,
+};
export default AssetInfo;
diff --git a/react/components/AssetPreview/index.js b/react/components/AssetPreview/index.js
index b2ec8b4a..e147a57d 100644
--- a/react/components/AssetPreview/index.js
+++ b/react/components/AssetPreview/index.js
@@ -5,12 +5,11 @@ const AssetPreview = ({ name, claimId, fileExt, contentType }) => {
const directSourceLink = `${claimId}/${name}.${fileExt}`;
const showUrlLink = `${claimId}/${name}`;
const previewHolderStyle = {
- clear : 'both',
- display : 'inline-block',
- width : '31%',
- padding : '0px',
- margin : '1%',
- backgroundColor: 'black',
+ clear : 'both',
+ display: 'inline-block',
+ width : '31%',
+ padding: '0px',
+ margin : '1%',
};
const assetStyle = {
width : '100%',
diff --git a/react/components/ShowAssetDetails/index.js b/react/components/ShowAssetDetails/index.js
index 2972fa94..3d3574e7 100644
--- a/react/components/ShowAssetDetails/index.js
+++ b/react/components/ShowAssetDetails/index.js
@@ -1,4 +1,5 @@
import React from 'react';
+import PropTypes from 'prop-types';
import NavBar from 'containers/NavBar';
import AssetTitle from 'components/AssetTitle';
import AssetDisplay from 'components/AssetDisplay';
@@ -39,10 +40,10 @@ class ShowAssetDetails extends React.Component {
channelName={this.props.claimData.channelName}
certificateId={this.props.claimData.certificateId}
description={this.props.claimData.description}
- shortClaimId={this.props.claimData.shortClaimId}
name={this.props.claimData.name}
- fileExt={this.props.claimData.fileExt}
claimId={this.props.claimData.claimId}
+ shortClaimId={this.props.claimData.shortClaimId}
+ fileExt={this.props.claimData.fileExt}
contentType={this.props.claimData.contentType}
thumbnail={this.props.claimData.thumbnail}
host={this.props.claimData.host}
@@ -56,11 +57,10 @@ class ShowAssetDetails extends React.Component {
}
};
-// required props
-// isChannel
-// channelName
-// channelClaimId
-// claimId
-// claimName
+ShowAssetDetails.propTypes = {
+ error : PropTypes.string,
+ claimData: PropTypes.object.isRequired,
+ // shortUrl: PropTypes.string.isRequired,
+};
export default ShowAssetDetails;
diff --git a/react/components/ShowAssetLite/index.js b/react/components/ShowAssetLite/index.js
index 72b81a78..862fc2db 100644
--- a/react/components/ShowAssetLite/index.js
+++ b/react/components/ShowAssetLite/index.js
@@ -1,4 +1,5 @@
import React from 'react';
+import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
import AssetDisplay from 'components/AssetDisplay';
@@ -27,4 +28,9 @@ class ShowLite extends React.Component {
}
};
+ShowLite.propTypes = {
+ error : PropTypes.string,
+ claimData: PropTypes.object.isRequired,
+};
+
export default ShowLite;
diff --git a/react/containers/ChannelClaimsDisplay/view.jsx b/react/containers/ChannelClaimsDisplay/view.jsx
index bd6d4439..9db4bc92 100644
--- a/react/containers/ChannelClaimsDisplay/view.jsx
+++ b/react/containers/ChannelClaimsDisplay/view.jsx
@@ -82,8 +82,4 @@ class ChannelClaimsDisplay extends React.Component {
}
};
-// PropTypes
-// name
-// id
-
export default ChannelClaimsDisplay;
diff --git a/react/containers/ShowAsset/view.jsx b/react/containers/ShowAsset/view.jsx
index 9f87cf1a..b6eff043 100644
--- a/react/containers/ShowAsset/view.jsx
+++ b/react/containers/ShowAsset/view.jsx
@@ -82,21 +82,30 @@ class ShowAsset extends React.Component {
});
});
}
+ componentWillUnmount () {
+ this.props.onAssetClaimDataClear();
+ }
render () {
- if (this.props.extension) {
+ if (this.props.claimData) {
return (
- <ShowAssetLite
- error={this.state.error}
- claimData={this.props.claimData}
- />
+ <div>
+ { this.props.extension ? (
+ <ShowAssetLite
+ error={this.state.error}
+ claimData={this.props.claimData}
+ />
+ ) : (
+ <ShowAssetDetails
+ error={this.state.error}
+ claimData={this.props.claimData}
+ // shortUrl={this.props.shortUrl}
+ />
+ )}
+ </div>
);
}
return (
- <ShowAssetDetails
- error={this.state.error}
- claimData={this.props.claimData}
- // shortUrl={this.props.shortUrl}
- />
+ <div></div>
);
}
};