From c96c4d1fbdbda1830708408010cf1083cfe861e6 Mon Sep 17 00:00:00 2001 From: bill bittner Date: Thu, 8 Feb 2018 16:23:09 -0800 Subject: [PATCH] updated showAsset to use an id --- react/actions/show.js | 8 ++++---- react/components/AssetDisplay/index.js | 2 +- react/components/AssetDisplay/view.jsx | 6 ++++-- react/components/AssetInfo/index.js | 11 +---------- react/components/AssetInfo/view.jsx | 2 +- react/components/AssetTitle/index.js | 2 +- react/components/ShowAssetDetails/index.js | 2 +- react/components/ShowAssetDetails/view.jsx | 4 ++-- react/components/ShowAssetLite/index.js | 3 +-- react/components/ShowAssetLite/view.jsx | 2 +- react/constants/show_action_types.js | 2 +- react/containers/ShowAsset/index.js | 10 +++++----- react/containers/ShowAsset/view.jsx | 11 +++++------ react/reducers/show.js | 23 +++++++--------------- react/sagas/show_asset.js | 14 ++++++------- 15 files changed, 42 insertions(+), 60 deletions(-) diff --git a/react/actions/show.js b/react/actions/show.js index c1b1e96e..87a11aab 100644 --- a/react/actions/show.js +++ b/react/actions/show.js @@ -61,10 +61,10 @@ export function showNewAsset (name, claimId) { }; }; -export function updateShowAsset (error, name, claimId, shortId, claimData) { +export function updateShowAsset (error, id) { return { type: actions.SHOW_ASSET_UPDATE, - data: { error, name, claimId, shortId, claimData }, + data: { error, id }, }; }; @@ -76,9 +76,9 @@ export function clearShowAsset () { // add asset to asset list -export function addAssetToAssetList (id, error, name, claimId, shortId, claimData) { +export function upsertAssetToAssetList (id, error, name, claimId, shortId, claimData) { return { - type: actions.ASSET_LIST_ADD, + type: actions.ASSET_LIST_UPSERT, data: { id, error, name, claimId, shortId, claimData }, }; } diff --git a/react/components/AssetDisplay/index.js b/react/components/AssetDisplay/index.js index 1250c997..09fbc0de 100644 --- a/react/components/AssetDisplay/index.js +++ b/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], }; }; diff --git a/react/components/AssetDisplay/view.jsx b/react/components/AssetDisplay/view.jsx index fa719ac9..ecac5e6d 100644 --- a/react/components/AssetDisplay/view.jsx +++ b/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 (
{(status === LOCAL_CHECK) && diff --git a/react/components/AssetInfo/index.js b/react/components/AssetInfo/index.js index a4cd0814..899555e6 100644 --- a/react/components/AssetInfo/index.js +++ b/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], }; }; diff --git a/react/components/AssetInfo/view.jsx b/react/components/AssetInfo/view.jsx index 42eaffdb..0f1f3efe 100644 --- a/react/components/AssetInfo/view.jsx +++ b/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 (
{channelName && diff --git a/react/components/AssetTitle/index.js b/react/components/AssetTitle/index.js index 970bbe6f..9766d497 100644 --- a/react/components/AssetTitle/index.js +++ b/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, }; }; diff --git a/react/components/ShowAssetDetails/index.js b/react/components/ShowAssetDetails/index.js index 9d3f8eb8..899555e6 100644 --- a/react/components/ShowAssetDetails/index.js +++ b/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], }; }; diff --git a/react/components/ShowAssetDetails/view.jsx b/react/components/ShowAssetDetails/view.jsx index c1bf7e6a..eaef0a1d 100644 --- a/react/components/ShowAssetDetails/view.jsx +++ b/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 (
- {claimData && + {asset &&
diff --git a/react/components/ShowAssetLite/index.js b/react/components/ShowAssetLite/index.js index b47c7407..899555e6 100644 --- a/react/components/ShowAssetLite/index.js +++ b/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], }; }; diff --git a/react/components/ShowAssetLite/view.jsx b/react/components/ShowAssetLite/view.jsx index 74dc1beb..d9892d90 100644 --- a/react/components/ShowAssetLite/view.jsx +++ b/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 (
{ (name && claimId) && diff --git a/react/constants/show_action_types.js b/react/constants/show_action_types.js index d4d262f8..26302b22 100644 --- a/react/constants/show_action_types.js +++ b/react/constants/show_action_types.js @@ -11,7 +11,7 @@ export const SHOW_ASSET_NEW = 'SHOW_ASSET_NEW'; export const SHOW_ASSET_UPDATE = 'SHOW_ASSET_UPDATE'; export const SHOW_ASSET_CLEAR = 'SHOW_ASSET_CLEAR'; -export const ASSET_LIST_ADD = `ASSET_LIST_ADD`; +export const ASSET_LIST_UPSERT = `ASSET_LIST_UPSERT`; // channel request actions export const CHANNEL_REQUEST_NEW = 'CHANNEL_REQUEST_NEW'; diff --git a/react/containers/ShowAsset/index.js b/react/containers/ShowAsset/index.js index 6f5ce1b6..e375e2ab 100644 --- a/react/containers/ShowAsset/index.js +++ b/react/containers/ShowAsset/index.js @@ -13,25 +13,25 @@ const mapStateToProps = ({ show }) => { assetList : show.assetList, // show asset error : show.showAsset.error, - name : show.showAsset.name, - claimData : show.showAsset.claimData, + id : show.showAsset.id, }; }; const mapDispatchToProps = dispatch => { return { - // new + // request onNewRequest: (id, name, modifier) => { dispatch(newAssetRequest(id, name, modifier)); }, onRequestError: (error) => { dispatch(updateRequestError(error, null, null)); }, + // show asset onShowNewAsset: (name, claimId) => { dispatch(showNewAsset(name, claimId)); }, - onShowExistingAsset: (error, name, claimId, shortId, claimData) => { - dispatch(updateShowAsset(error, name, claimId, shortId, claimData)); + onShowExistingAsset: (assetId) => { + dispatch(updateShowAsset(null, assetId)); }, onLeaveShowAsset: () => { dispatch(clearShowAsset()); // clear any errors diff --git a/react/containers/ShowAsset/view.jsx b/react/containers/ShowAsset/view.jsx index 123ed807..3e3de33d 100644 --- a/react/containers/ShowAsset/view.jsx +++ b/react/containers/ShowAsset/view.jsx @@ -52,7 +52,7 @@ class ShowAsset extends React.Component { const assetId = `a#${name}#${claimId}`; const existingAssetRecord = assetList[assetId]; if (existingAssetRecord) { // case: the asset data already exists - this.showExistingAsset(existingAssetRecord); + this.showExistingAsset(assetId); } else { // case: the asset data does not exist yet this.showNewAsset(name, claimId); } @@ -60,21 +60,20 @@ class ShowAsset extends React.Component { showNewAsset (name, claimId) { this.props.onShowNewAsset(name, claimId); } - showExistingAsset (existingAssetRecord) { - let { error, name, claimId, shortId, claimData } = existingAssetRecord; - this.props.onShowExistingAsset(error, name, claimId, shortId, claimData); + showExistingAsset (assetId) { + this.props.onShowExistingAsset(assetId); } componentWillUnmount () { this.props.onLeaveShowAsset(); } render () { - const { error, name, requestExtension } = this.props; + const { error, id, requestExtension } = this.props; if (error) { return ( ); } - if (name) { // direct requests are passing because name is present so it just goes + if (id) { // direct requests are passing because name is present so it just goes if (requestExtension) { return ( diff --git a/react/reducers/show.js b/react/reducers/show.js index 5e1a7ac4..3a78bc2f 100644 --- a/react/reducers/show.js +++ b/react/reducers/show.js @@ -24,11 +24,8 @@ const initialState = { }, }, showAsset: { - error : null, - name : null, - claimId : null, - shortId : null, - claimData: null, + error: null, + id : null, }, displayAsset: { error : null, @@ -93,25 +90,19 @@ export default function (state = initialState, action) { case actions.SHOW_ASSET_UPDATE: return Object.assign({}, state, { showAsset: Object.assign({}, state.showAsset, { - error : action.data.error, - name : action.data.name, - claimId : action.data.claimId, - shortId : action.data.shortId, - claimData: action.data.claimData, + error: action.data.error, + id : action.data.id, }), }); case actions.SHOW_ASSET_CLEAR: return Object.assign({}, state, { showAsset: Object.assign({}, state.showAsset, { - error : null, - name : null, - claimId : null, - shortId : null, - claimData: null, + error: null, + id : null, }), }); // add asset to asset list - case actions.ASSET_LIST_ADD: + case actions.ASSET_LIST_UPSERT: return Object.assign({}, state, { assetList: Object.assign({}, state.assetList, { [action.data.id]: { diff --git a/react/sagas/show_asset.js b/react/sagas/show_asset.js index 61761c89..1b99e5b6 100644 --- a/react/sagas/show_asset.js +++ b/react/sagas/show_asset.js @@ -1,6 +1,6 @@ import { call, put, takeLatest } from 'redux-saga/effects'; import * as actions from 'constants/show_action_types'; -import { updateShowAsset, addAssetToAssetList } from 'actions/show'; +import { updateShowAsset, upsertAssetToAssetList } from 'actions/show'; import { getShortId, getClaimData } from 'api/assetApi'; function* getAssetDataAndShowAsset (action) { @@ -10,10 +10,10 @@ function* getAssetDataAndShowAsset (action) { try { ({success, message, data: shortId} = yield call(getShortId, name, claimId)); } catch (error) { - return yield put(updateShowAsset(error.message, name, claimId)); + return yield put(updateShowAsset(error.message, null)); } if (!success) { - return yield put(updateShowAsset(message, name, claimId)); + return yield put(updateShowAsset(message, null)); } // if no error, get claim data success = null; @@ -21,13 +21,13 @@ function* getAssetDataAndShowAsset (action) { try { ({success, message, data: claimData} = yield call(getClaimData, name, claimId)); } catch (error) { - return yield put(updateShowAsset(error.message, name, claimId)); + return yield put(updateShowAsset(error.message, null)); } if (!success) { - return yield put(updateShowAsset(message, name, claimId)); + return yield put(updateShowAsset(message, null)); } - yield put(updateShowAsset(null, name, claimId, shortId, claimData)); - yield put(addAssetToAssetList(id, null, name, claimId, shortId, claimData)); + yield put(updateShowAsset(null, id)); + yield put(upsertAssetToAssetList(id, null, name, claimId, shortId, claimData)); } export function* watchShowNewAsset () {