LBRYCommunity/spee.ch
1
0
Fork 0
Code Issues 95 Pull requests 2 Projects Releases 4 Packages Wiki Activity

added proptype checks to components

Browse source
This commit is contained in:
bill bittner 2018-02-04 16:40:28 -08:00
parent 339f213482
commit 0a541b6dd9
7 changed files with 54 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
react/components/AssetDisplay/index.js
View file

@ -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;

17
react/components/AssetInfo/index.js
View file

@ -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;

11
react/components/AssetPreview/index.js
View file

@ -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%',

16
react/components/ShowAssetDetails/index.js
View file

@ -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;

6
react/components/ShowAssetLite/index.js
View file

@ -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;

4
react/containers/ChannelClaimsDisplay/view.jsx
View file

@ -82,8 +82,4 @@ class ChannelClaimsDisplay extends React.Component {
}
};
// PropTypes
// name
// id
export default ChannelClaimsDisplay;

29
react/containers/ShowAsset/view.jsx
View file

@ -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>
);
}
};