store: move status polling to redux

Updating a composes status is no longer done from the ImagesTable
component. Instead the composeGetStatus thunk is used to make the api
call and dispatch the COMPOSE_UPDATED_STATUS action. The polling still
occurs from the component.

src/Components/ImagesTable/ImagesTable.js

@@ -14,9 +14,6 @@ import { ExternalLinkAltIcon, PlusCircleIcon } from '@patternfly/react-icons';
 import ImageBuildStatus from './ImageBuildStatus';
 import Release from './Release';
 import Upload from './Upload';
-
-import api from '../../api.js';
-
 class ImagesTable extends Component {
     constructor(props) {
         super(props);
@@ -54,17 +51,14 @@ class ImagesTable extends Component {
     }
 
     pollComposeStatuses() {
-        let { composeUpdated, composes } = this.props;
+        let { composes } = this.props;
         Object.entries(composes.byId).map(([ id, compose ]) => {
             /* Skip composes that have been complete */
             if (compose.image_status.status === 'success' || compose.image_status.status === 'failure') {
                 return;
             }
 
-            api.getComposeStatus(id).then(response => {
-                const newCompose = Object.assign({}, compose, { image_status: response.image_status });
-                composeUpdated(newCompose);
-            });
+            this.props.composeGetStatus(id);
         });
     }
 
@@ -145,13 +139,13 @@ function mapStateToProps(state) {
 
 function mapDispatchToProps(dispatch) {
     return {
-        composeUpdated: (compose) => dispatch(actions.composeUpdated(compose)),
+        composeGetStatus: (id) => dispatch(actions.composeGetStatus(id)),
     };
 }
 
 ImagesTable.propTypes = {
     composes: PropTypes.object,
-    composeUpdated: PropTypes.func,
+    composeGetStatus: PropTypes.func,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(ImagesTable);

src/store/actions/actions.js

@@ -35,6 +35,17 @@ export const composeStart = (composeRequest) => async dispatch => {
     });
 };
 
+export const composeUpdatedStatus = (id, status) => ({
+    type: types.COMPOSE_UPDATED_STATUS,
+    payload: { id, status }
+});
+
+export const composeGetStatus = (id) => async dispatch => {
+    const request = await api.getComposeStatus(id);
+    dispatch(composeUpdatedStatus(id, request.image_status));
+};
+
+
 function setRelease({ arch, distro }) {
     return {
         type: types.SET_RELEASE,
@@ -114,6 +125,7 @@ function setSubscribeNow(subscribeNow) {
 export default {
     composeStart,
     composeUpdated,
+    composeGetStatus,
     setRelease,
     setUploadDestinations,
     setUploadAWS,

src/store/reducers/composes.js

@@ -63,6 +63,17 @@ export function composes(state = initialComposesState, action) {
                     [action.payload.compose.id]: action.payload.compose,
                 }
             };
+        case types.COMPOSE_UPDATED_STATUS:
+            return {
+                ...state,
+                byId: {
+                    ...state.byId,
+                    [action.payload.id]: {
+                        ...state.byId[action.payload.id],
+                        image_status: action.payload.status,
+                    }
+                }
+            };
         default:
             return state;
     }

src/store/types.js

@@ -1,6 +1,7 @@
 const COMPOSE_ADDED = 'COMPOSE_ADDED';
 const COMPOSE_FAILED = 'COMPOSE_FAILED';
 const COMPOSE_UPDATED = 'COMPOSE_UPDATED';
+const COMPOSE_UPDATED_STATUS = 'COMPOSE_UPDATED_STATUS';
 const SET_RELEASE = 'SET_RELEASE';
 const SET_UPLOAD_DESTINATIONS = 'SET_UPLOAD_DESTINATIONS';
 const SET_UPLOAD_AWS = 'SET_UPLOAD_AWS';
@@ -14,6 +15,7 @@ export default {
     COMPOSE_ADDED,
     COMPOSE_FAILED,
     COMPOSE_UPDATED,
+    COMPOSE_UPDATED_STATUS,
     SET_RELEASE,
     SET_UPLOAD_DESTINATIONS,
     SET_UPLOAD_AWS,