moved newAssetRequest into store
This commit is contained in:
parent
22103081cc
commit
6c10eeef71
8 changed files with 192 additions and 86 deletions
|
@ -104,3 +104,26 @@ export function updateDisplayAssetError (error) {
|
||||||
data: 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 },
|
||||||
|
// };
|
||||||
|
// };
|
||||||
|
|
26
react/api/AssetApi.js
Normal file
26
react/api/AssetApi.js
Normal file
|
@ -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);
|
||||||
|
}
|
|
@ -12,3 +12,8 @@ export const ASSET_CLAIM_DATA_UPDATE = 'ASSET_CLAIM_DATA_UPDATE';
|
||||||
export const FILE_REQUESTED = 'FILE_REQUESTED';
|
export const FILE_REQUESTED = 'FILE_REQUESTED';
|
||||||
export const FILE_AVAILABILITY_UPDATE = 'FILE_AVAILABILITY_UPDATE';
|
export const FILE_AVAILABILITY_UPDATE = 'FILE_AVAILABILITY_UPDATE';
|
||||||
export const DISPLAY_ASSET_ERROR = 'DISPLAY_ASSET_ERROR';
|
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';
|
||||||
|
|
|
@ -1,12 +1,14 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import View from './view';
|
import View from './view';
|
||||||
import { updateAssetClaimData, updateShowAssetError } from 'actions/show';
|
import { newAssetRequest, updateAssetClaimData, updateShowAssetError } from 'actions/show';
|
||||||
|
|
||||||
const mapStateToProps = ({ show }) => {
|
const mapStateToProps = ({ show }) => {
|
||||||
return {
|
return {
|
||||||
modifier : show.assetRequest.modifier,
|
// new
|
||||||
name : show.assetRequest.name,
|
request : show.assetRequest,
|
||||||
extension: show.assetRequest.extension,
|
assetRequests: show.assetRequests,
|
||||||
|
extension : show.assetRequest.extension,
|
||||||
|
// old
|
||||||
error : show.showAsset.error,
|
error : show.showAsset.error,
|
||||||
claimData: show.showAsset.claimData,
|
claimData: show.showAsset.claimData,
|
||||||
};
|
};
|
||||||
|
@ -14,6 +16,11 @@ const mapStateToProps = ({ show }) => {
|
||||||
|
|
||||||
const mapDispatchToProps = dispatch => {
|
const mapDispatchToProps = dispatch => {
|
||||||
return {
|
return {
|
||||||
|
// new
|
||||||
|
onNewAssetRequest (name, modifier) {
|
||||||
|
dispatch(newAssetRequest(name, modifier));
|
||||||
|
},
|
||||||
|
// old
|
||||||
onShowAssetError: (error) => {
|
onShowAssetError: (error) => {
|
||||||
dispatch(updateShowAssetError(error));
|
dispatch(updateShowAssetError(error));
|
||||||
},
|
},
|
||||||
|
|
|
@ -4,6 +4,16 @@ import ShowAssetLite from 'components/ShowAssetLite';
|
||||||
import ShowAssetDetails from 'components/ShowAssetDetails';
|
import ShowAssetDetails from 'components/ShowAssetDetails';
|
||||||
import request from 'utils/request';
|
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 {
|
class ShowAsset extends React.Component {
|
||||||
constructor (props) {
|
constructor (props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
@ -11,84 +21,21 @@ class ShowAsset extends React.Component {
|
||||||
this.getClaimData = this.getClaimData.bind(this);
|
this.getClaimData = this.getClaimData.bind(this);
|
||||||
}
|
}
|
||||||
componentDidMount () {
|
componentDidMount () {
|
||||||
const { name, modifier } = this.props;
|
const { request: { name, modifier }, assetRequests } = this.props;
|
||||||
// create request params
|
const id = buildIdFromModifierObject(modifier);
|
||||||
let body = {};
|
// check to see if we have this asset
|
||||||
if (modifier) {
|
if (assetRequests[id]) {
|
||||||
if (modifier.id) {
|
// case: the assetRequest exists
|
||||||
body['claimId'] = modifier.id;
|
this.props.onNewAssetRequest(id, name, modifier); // request the long id and update the store with a new asset request record.
|
||||||
} else {
|
} else {
|
||||||
body['channelName'] = modifier.channel.name;
|
// case: the asset request does not exist
|
||||||
body['channelClaimId'] = modifier.channel.id;
|
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) {
|
onRepeatAssetRequest (id, modifier, assetRequests) {
|
||||||
const url = `/api/claim/long-id`;
|
// get the results of the existing asset request
|
||||||
return new Promise((resolve, reject) => {
|
const {error, claimId} = assetRequests[id];
|
||||||
request(url, params)
|
console.log(`results form past request ${id}:`, error, claimId);
|
||||||
.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);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
componentWillUnmount () {
|
componentWillUnmount () {
|
||||||
this.props.onAssetClaimDataClear();
|
this.props.onAssetClaimDataClear();
|
||||||
|
|
|
@ -45,10 +45,31 @@ const initialState = {
|
||||||
error : null,
|
error : null,
|
||||||
status: LOCAL_CHECK,
|
status: LOCAL_CHECK,
|
||||||
},
|
},
|
||||||
viewedChannels: [],
|
channelRequests: {},
|
||||||
viewedClaims : [],
|
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
|
Reducers describe how the application's state changes in response to actions
|
||||||
*/
|
*/
|
||||||
|
@ -125,6 +146,23 @@ export default function (state = initialState, action) {
|
||||||
status: ERROR,
|
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:
|
default:
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,8 +1,9 @@
|
||||||
import { all } from 'redux-saga/effects';
|
import { all } from 'redux-saga/effects';
|
||||||
import { watchFileIsRequested } from './show';
|
import { watchNewAssetRequest, watchFileIsRequested } from './show';
|
||||||
|
|
||||||
export default function* rootSaga () {
|
export default function* rootSaga () {
|
||||||
yield all([
|
yield all([
|
||||||
|
watchNewAssetRequest(),
|
||||||
watchFileIsRequested(),
|
watchFileIsRequested(),
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,8 +1,63 @@
|
||||||
import { call, put, takeLatest } from 'redux-saga/effects';
|
import { call, put, takeLatest } from 'redux-saga/effects';
|
||||||
import * as actions from 'constants/show_action_types';
|
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 { UNAVAILABLE, AVAILABLE } from 'constants/asset_display_states';
|
||||||
import { checkFileAvailability, triggerClaimGet } from 'api/fileApi';
|
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) {
|
function* retriveFile (action) {
|
||||||
const name = action.data.name;
|
const name = action.data.name;
|
||||||
|
@ -34,8 +89,12 @@ function* retriveFile (action) {
|
||||||
} else {
|
} else {
|
||||||
yield put(updateDisplayAssetError(message));
|
yield put(updateDisplayAssetError(message));
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
|
export function* watchNewAssetRequest () {
|
||||||
|
yield takeLatest(actions.NEW_ASSET_REQUEST, newAssetRequest);
|
||||||
|
};
|
||||||
|
|
||||||
export function* watchFileIsRequested () {
|
export function* watchFileIsRequested () {
|
||||||
yield takeLatest(actions.FILE_REQUESTED, retriveFile);
|
yield takeLatest(actions.FILE_REQUESTED, retriveFile);
|
||||||
}
|
};
|
||||||
|
|
Loading…
Reference in a new issue