updated showAsset to use an id

react/components/AssetDisplay/index.js

@@ -6,7 +6,7 @@ const mapStateToProps = ({ show }) => {
   return {
     error    : show.displayAsset.error,
     status   : show.displayAsset.status,
-    claimData: show.showAsset.claimData,
+    asset    : show.assetList[show.showAsset.id],
   };
 };
 

react/components/AssetDisplay/view.jsx

@@ -4,10 +4,12 @@ import { LOCAL_CHECK, UNAVAILABLE, ERROR, AVAILABLE } from 'constants/asset_disp
 
 class AssetDisplay extends React.Component {
   componentDidMount () {
-    this.props.onFileRequest(this.props.claimData.name, this.props.claimData.claimId);
+    const { asset: { claimData: { name, claimId } } } = this.props;
+    this.props.onFileRequest(name, claimId);
   }
   render () {
-    const { status, error, claimData: { name, claimId, contentType, fileExt, thumbnail } } = this.props;
+    console.log('rendering assetdisplay', this.props);
+    const { status, error, asset: { claimData: { name, claimId, contentType, fileExt, thumbnail } } } = this.props;
     return (
       <div id="asset-display-component">
         {(status === LOCAL_CHECK) &&

react/components/AssetInfo/index.js

@@ -3,16 +3,7 @@ import View from './view';
 
 const mapStateToProps = ({ show }) => {
   return {
-    shortId      : show.showAsset.shortId,
-    channelName  : show.showAsset.claimData.channelName,
-    certificateId: show.showAsset.claimData.certificateId,
-    description  : show.showAsset.claimData.description,
-    name         : show.showAsset.claimData.name,
-    claimId      : show.showAsset.claimData.claimId,
-    fileExt      : show.showAsset.claimData.fileExt,
-    contentType  : show.showAsset.claimData.contentType,
-    thumbnail    : show.showAsset.claimData.thumbnail,
-    host         : show.showAsset.claimData.host,
+    asset: show.assetList[show.showAsset.id],
   };
 };
 

react/components/AssetInfo/view.jsx

@@ -27,7 +27,7 @@ class AssetInfo extends React.Component {
     }
   }
   render () {
-    const { shortId, channelName, certificateId, description, name, claimId, fileExt, contentType, thumbnail, host } = this.props;
+    const { asset: { shortId, claimData : { channelName, certificateId, description, name, claimId, fileExt, contentType, thumbnail, host } } } = this.props;
     return (
       <div>
         {channelName &&

react/components/AssetTitle/index.js

@@ -3,7 +3,7 @@ import View from './view';
 
 const mapStateToProps = ({ show }) => {
   return {
-    title: show.showAsset.claimData.title,
+    title: show.assetList[show.showAsset.id].claimData.title,
   };
 };
 

react/components/ShowAssetDetails/index.js

@@ -3,7 +3,7 @@ import View from './view';
 
 const mapStateToProps = ({ show }) => {
   return {
-    claimData: show.showAsset.claimData,
+    asset: show.assetList[show.showAsset.id],
   };
 };
 

react/components/ShowAssetDetails/view.jsx

@@ -7,11 +7,11 @@ import AssetInfo from 'components/AssetInfo';
 
 class ShowAssetDetails extends React.Component {
   render () {
-    const { claimData } = this.props;
+    const { asset } = this.props;
     return (
       <div>
         <NavBar/>
-        {claimData &&
+        {asset &&
         <div className="row row--tall row--padded">
           <div className="column column--10">
             <AssetTitle />

react/components/ShowAssetLite/index.js

@@ -3,8 +3,7 @@ import View from './view';
 
 const mapStateToProps = ({ show }) => {
   return {
-    name   : show.showAsset.claimData.name,
-    claimId: show.showAsset.claimData.claimId,
+    asset: show.assetList[show.showAsset.id],
   };
 };
 

react/components/ShowAssetLite/view.jsx

@@ -4,7 +4,7 @@ import AssetDisplay from 'components/AssetDisplay';
 
 class ShowLite extends React.Component {
   render () {
-    const { name, claimId } = this.props;
+    const { asset: { name, claimId } } = this.props;
     return (
       <div className="row row--tall flex-container--column flex-container--center-center">
         { (name && claimId) &&