updated showAsset to use an id
This commit is contained in:
parent
f38a4fb7e5
commit
c96c4d1fbd
15 changed files with 42 additions and 60 deletions
|
@ -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 },
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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],
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -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) &&
|
||||
|
|
|
@ -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],
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -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 &&
|
||||
|
|
|
@ -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,
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -3,7 +3,7 @@ import View from './view';
|
|||
|
||||
const mapStateToProps = ({ show }) => {
|
||||
return {
|
||||
claimData: show.showAsset.claimData,
|
||||
asset: show.assetList[show.showAsset.id],
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -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 />
|
||||
|
|
|
@ -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],
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -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) &&
|
||||
|
|
|
@ -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';
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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 (
|
||||
<ErrorPage error={error}/>
|
||||
);
|
||||
}
|
||||
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 (
|
||||
<ShowAssetLite />
|
||||
|
|
|
@ -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]: {
|
||||
|
|
|
@ -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 () {
|
||||
|
|
Loading…
Reference in a new issue