diff --git a/ui/js/component/filePrice/index.js b/ui/js/component/filePrice/index.js index 726ceb3ee..65e870a58 100644 --- a/ui/js/component/filePrice/index.js +++ b/ui/js/component/filePrice/index.js @@ -7,14 +7,17 @@ import { } from 'actions/cost_info' import { makeSelectCostInfoForUri, + makeSelectFetchingCostInfoForUri, } from 'selectors/cost_info' import FilePrice from './view' const makeSelect = () => { const selectCostInfoForUri = makeSelectCostInfoForUri() + const selectFetchingCostInfoForUri = makeSelectFetchingCostInfoForUri() const select = (state, props) => ({ costInfo: selectCostInfoForUri(state, props), + fetching: selectFetchingCostInfoForUri(state, props), }) return select diff --git a/ui/js/component/filePrice/view.jsx b/ui/js/component/filePrice/view.jsx index 4edc3a3e7..2a0872492 100644 --- a/ui/js/component/filePrice/view.jsx +++ b/ui/js/component/filePrice/view.jsx @@ -16,10 +16,11 @@ class FilePrice extends React.Component{ const { costInfo, fetchCostInfo, - uri + uri, + fetching, } = props - if (costInfo === undefined) { + if (costInfo === undefined && !fetching) { fetchCostInfo(uri) } } diff --git a/ui/js/selectors/cost_info.js b/ui/js/selectors/cost_info.js index 242ec6b0d..84bbb5f02 100644 --- a/ui/js/selectors/cost_info.js +++ b/ui/js/selectors/cost_info.js @@ -17,3 +17,19 @@ export const makeSelectCostInfoForUri = () => { (costInfo) => costInfo ) } + +export const selectFetchingCostInfo = createSelector( + _selectState, + (state) => state.fetching || {} +) + +const selectFetchingCostInfoForUri = (state, props) => { + return selectFetchingCostInfo(state)[props.uri] +} + +export const makeSelectFetchingCostInfoForUri = () => { + return createSelector( + selectFetchingCostInfoForUri, + (fetching) => !!fetching + ) +}