From 6c10eeef71bb5a7c28aa53d2d97b15df8c2f4907 Mon Sep 17 00:00:00 2001 From: bill bittner Date: Wed, 7 Feb 2018 13:26:07 -0800 Subject: [PATCH] moved newAssetRequest into store --- react/actions/show.js | 23 +++++++ react/api/AssetApi.js | 26 ++++++++ react/constants/show_action_types.js | 5 ++ react/containers/ShowAsset/index.js | 15 +++-- react/containers/ShowAsset/view.jsx | 99 +++++++--------------------- react/reducers/show.js | 42 +++++++++++- react/sagas/index.js | 3 +- react/sagas/show.js | 65 +++++++++++++++++- 8 files changed, 192 insertions(+), 86 deletions(-) create mode 100644 react/api/AssetApi.js diff --git a/react/actions/show.js b/react/actions/show.js index 6e1c65df..9e6ba771 100644 --- a/react/actions/show.js +++ b/react/actions/show.js @@ -104,3 +104,26 @@ export function updateDisplayAssetError (error) { data: error, }; }; + +// new + +export function newAssetRequest (id, name, modifier) { + return { + type: actions.NEW_ASSET_REQUEST, + data: { id, name, modifier }, + }; +}; + +export function addAssetRequest (id, error, claimId) { + return { + type: actions.ASSET_REQUEST_ADD, + data: { id, error, claimId }, + }; +}; + +// export function addAsset (error, name, claimId, claimData, shortId, display) { +// return { +// type: actions.ASSET_ADD, +// data: { error, name, claimId, claimData, shortId, display }, +// }; +// }; diff --git a/react/api/AssetApi.js b/react/api/AssetApi.js new file mode 100644 index 00000000..3603a94b --- /dev/null +++ b/react/api/AssetApi.js @@ -0,0 +1,26 @@ +import Request from 'utils/request'; + +export function getLongClaimId (name, modifier) { + let body = {}; + // create request params + if (modifier) { + if (modifier.id) { + body['claimId'] = modifier.id; + } else { + body['channelName'] = modifier.channel.name; + body['channelClaimId'] = modifier.channel.id; + } + } + body['claimName'] = name; + const params = { + method : 'POST', + headers: new Headers({ + 'Content-Type': 'application/json', + }), + body: JSON.stringify(body), + } + // crate url + const url = `/api/claim/long-id`; + // return the request promise + return Request(url, params); +} diff --git a/react/constants/show_action_types.js b/react/constants/show_action_types.js index 788aaa4f..fb6ae64a 100644 --- a/react/constants/show_action_types.js +++ b/react/constants/show_action_types.js @@ -12,3 +12,8 @@ export const ASSET_CLAIM_DATA_UPDATE = 'ASSET_CLAIM_DATA_UPDATE'; export const FILE_REQUESTED = 'FILE_REQUESTED'; export const FILE_AVAILABILITY_UPDATE = 'FILE_AVAILABILITY_UPDATE'; export const DISPLAY_ASSET_ERROR = 'DISPLAY_ASSET_ERROR'; + +/ new +export const NEW_ASSET_REQUEST = 'NEW_ASSET_REQUEST'; +export const ASSET_REQUEST_ADD = 'ASSET_REQUEST_ADD'; +export const ASSET_ADD = 'ASSET_ADD'; diff --git a/react/containers/ShowAsset/index.js b/react/containers/ShowAsset/index.js index c8949a6b..ddcfdf06 100644 --- a/react/containers/ShowAsset/index.js +++ b/react/containers/ShowAsset/index.js @@ -1,12 +1,14 @@ import { connect } from 'react-redux'; import View from './view'; -import { updateAssetClaimData, updateShowAssetError } from 'actions/show'; +import { newAssetRequest, updateAssetClaimData, updateShowAssetError } from 'actions/show'; const mapStateToProps = ({ show }) => { return { - modifier : show.assetRequest.modifier, - name : show.assetRequest.name, - extension: show.assetRequest.extension, + // new + request : show.assetRequest, + assetRequests: show.assetRequests, + extension : show.assetRequest.extension, + // old error : show.showAsset.error, claimData: show.showAsset.claimData, }; @@ -14,6 +16,11 @@ const mapStateToProps = ({ show }) => { const mapDispatchToProps = dispatch => { return { + // new + onNewAssetRequest (name, modifier) { + dispatch(newAssetRequest(name, modifier)); + }, + // old onShowAssetError: (error) => { dispatch(updateShowAssetError(error)); }, diff --git a/react/containers/ShowAsset/view.jsx b/react/containers/ShowAsset/view.jsx index 97136a55..e7ae410f 100644 --- a/react/containers/ShowAsset/view.jsx +++ b/react/containers/ShowAsset/view.jsx @@ -4,6 +4,16 @@ import ShowAssetLite from 'components/ShowAssetLite'; import ShowAssetDetails from 'components/ShowAssetDetails'; import request from 'utils/request'; +function buildIdFromModifierObject (modifier) { + if (modifier) { + if (modifier.channel.name) { + return `${modifier.channel.name}#${modifier.channel.id}`; + } + return modifier.id; + } + return ''; +} + class ShowAsset extends React.Component { constructor (props) { super(props); @@ -11,84 +21,21 @@ class ShowAsset extends React.Component { this.getClaimData = this.getClaimData.bind(this); } componentDidMount () { - const { name, modifier } = this.props; - // create request params - let body = {}; - if (modifier) { - if (modifier.id) { - body['claimId'] = modifier.id; - } else { - body['channelName'] = modifier.channel.name; - body['channelClaimId'] = modifier.channel.id; - } + const { request: { name, modifier }, assetRequests } = this.props; + const id = buildIdFromModifierObject(modifier); + // check to see if we have this asset + if (assetRequests[id]) { + // case: the assetRequest exists + this.props.onNewAssetRequest(id, name, modifier); // request the long id and update the store with a new asset request record. + } else { + // case: the asset request does not exist + this.onRepeatAssetRequest(name, modifier); // get the asset request record...? } - body['claimName'] = name; - const params = { - method : 'POST', - headers: new Headers({ - 'Content-Type': 'application/json', - }), - body: JSON.stringify(body), - } - // make request - this.getLongClaimId(params) - .then(claimLongId => { - return Promise.all([this.getShortClaimId(claimLongId, name), this.getClaimData(claimLongId, name)]); - }) - .then(([shortId, claimData]) => { - this.props.onAssetClaimDataUpdate(claimData, shortId); - }) - .catch(error => { - this.props.onShowAssetError(error); - }); } - getLongClaimId (params) { - const url = `/api/claim/long-id`; - return new Promise((resolve, reject) => { - request(url, params) - .then(({ success, message, data }) => { - console.log('get long claim id response:', message); - if (!success) { - reject(message); - } - resolve(data); - }) - .catch((error) => { - reject(error.message); - }); - }); - } - getShortClaimId (longId, name) { - const url = `/api/claim/short-id/${longId}/${name}`; - return new Promise((resolve, reject) => { - request(url) - .then(({ success, message, data }) => { - console.log('get short claim id response:', data); - if (!success) { - reject(message); - } - resolve(data); - }) - .catch((error) => { - reject(error.message); - }); - }); - } - getClaimData (claimId, claimName) { - return new Promise((resolve, reject) => { - const url = `/api/claim/data/${claimName}/${claimId}`; - return request(url) - .then(({ success, message }) => { - console.log('get claim data response:', message); - if (!success) { - reject(message); - } - resolve(message); - }) - .catch((error) => { - reject(error.message); - }); - }); + onRepeatAssetRequest (id, modifier, assetRequests) { + // get the results of the existing asset request + const {error, claimId} = assetRequests[id]; + console.log(`results form past request ${id}:`, error, claimId); } componentWillUnmount () { this.props.onAssetClaimDataClear(); diff --git a/react/reducers/show.js b/react/reducers/show.js index 781bda61..b3649af3 100644 --- a/react/reducers/show.js +++ b/react/reducers/show.js @@ -45,10 +45,31 @@ const initialState = { error : null, status: LOCAL_CHECK, }, - viewedChannels: [], - viewedClaims : [], + channelRequests: {}, + assetRequests : {}, + channels : {}, + assets : {}, }; +/* asset request schema: +name#someidfrommodifier: { + error : null + claimId: null, +} */ + +/* asset schema: +name#claimId: { + error : null, + name : null, + claimId : null, + claimData: null, + shortId : null, + display : { + error : null, + status: null, + } +} */ + /* Reducers describe how the application's state changes in response to actions */ @@ -125,6 +146,23 @@ export default function (state = initialState, action) { status: ERROR, }), }); + // new actions + case actions.ASSET_REQUEST_ADD: + return Object.assign({}, state, { + assetRequests: Object.assign({}, state.assets, { + [action.data.id]: { + error : action.data.error, + claimId: action.data.claimId, + }, + }), + }); + + // case actions.ASSET_ADD: + // return Object.assign({}, state, { + // assets: Object.assign({}, state.assets, { + // [`${action.data.name}#${action.data.claimId}`]: action.data, + // }), + // }); default: return state; } diff --git a/react/sagas/index.js b/react/sagas/index.js index fa8e17ff..bc902a20 100644 --- a/react/sagas/index.js +++ b/react/sagas/index.js @@ -1,8 +1,9 @@ import { all } from 'redux-saga/effects'; -import { watchFileIsRequested } from './show'; +import { watchNewAssetRequest, watchFileIsRequested } from './show'; export default function* rootSaga () { yield all([ + watchNewAssetRequest(), watchFileIsRequested(), ]); } diff --git a/react/sagas/show.js b/react/sagas/show.js index d5798ff6..3e46bbba 100644 --- a/react/sagas/show.js +++ b/react/sagas/show.js @@ -1,8 +1,63 @@ import { call, put, takeLatest } from 'redux-saga/effects'; import * as actions from 'constants/show_action_types'; -import { updateFileAvailability, updateDisplayAssetError } from 'actions/show'; +import { addAssetRequest, updateFileAvailability, updateDisplayAssetError } from 'actions/show'; import { UNAVAILABLE, AVAILABLE } from 'constants/asset_display_states'; import { checkFileAvailability, triggerClaimGet } from 'api/fileApi'; +import { getLongClaimId } from 'api/AssetApi'; +import request from '../utils/request'; + +function* newAssetRequest (action) { + const { id, name, modifier } = action.data; + // get the long claim id + let success, message, longId; + try { + ({success, message, data: longId} = yield call(getLongClaimId, name, modifier)); + } catch (error) { + console.log('error making getLongClaimId call', error); + yield put(addAssetRequest(id, error.message, null)); + } + // put a new action to update the store with result + if (success) { + return yield put(addAssetRequest(id, null, longId)); + } + yield put(addAssetRequest(id, message, null)); +}; + +function* getShortId (action) { + const { longId, name } = action.data; + const url = `/api/claim/short-id/${longId}/${name}`; + return new Promise((resolve, reject) => { + request(url) + .then(({ success, message, data }) => { + console.log('get short claim id response:', data); + if (!success) { + reject(message); + } + resolve(data); + }) + .catch((error) => { + reject(error.message); + }); + }); +} + +function* getClaimData (action) { + const { claimName, claimId } = action.data; + return new Promise((resolve, reject) => { + const url = `/api/claim/data/${claimName}/${claimId}`; + return request(url) + .then(({ success, message }) => { + console.log('get claim data response:', message); + if (!success) { + reject(message); + } + resolve(message); + }) + .catch((error) => { + reject(error.message); + }); + }); +} function* retriveFile (action) { const name = action.data.name; @@ -34,8 +89,12 @@ function* retriveFile (action) { } else { yield put(updateDisplayAssetError(message)); } -} +}; + +export function* watchNewAssetRequest () { + yield takeLatest(actions.NEW_ASSET_REQUEST, newAssetRequest); +}; export function* watchFileIsRequested () { yield takeLatest(actions.FILE_REQUESTED, retriveFile); -} +};