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

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)
     }
   }

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
+  )
+}