Use a FSM to determine application next state

- Separate cluster application UI state from server-side app status
- Use a state machine to determine cluster application next state
- Instead of using two variables to keep track of when an app
is installing or updating, just use the app status property and control
server-side and user events using the FSM service.

5 files changed, 200 insertions, 93 deletions

diff --git a/spec/frontend/clusters/clusters_bundle_spec.js b/spec/frontend/clusters/clusters_bundle_spec.js
index 33a35069004..5103cb4f69f 100644
--- a/spec/frontend/clusters/clusters_bundle_spec.js
+++ b/spec/frontend/clusters/clusters_bundle_spec.js
@@ -1,16 +1,13 @@
 import Clusters from '~/clusters/clusters_bundle';
-import {
-  REQUEST_SUBMITTED,
-  REQUEST_FAILURE,
-  APPLICATION_STATUS,
-  INGRESS_DOMAIN_SUFFIX,
-} from '~/clusters/constants';
+import { APPLICATION_STATUS, INGRESS_DOMAIN_SUFFIX } from '~/clusters/constants';
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
 import { loadHTMLFixture } from 'helpers/fixtures';
 import { setTestTimeout } from 'helpers/timeout';
 import $ from 'jquery';
 
+const { INSTALLING, INSTALLABLE, INSTALLED, NOT_INSTALLABLE } = APPLICATION_STATUS;
+
 describe('Clusters', () => {
   setTestTimeout(1000);
 
@@ -93,7 +90,7 @@ describe('Clusters', () => {
     it('does not show alert when things transition from initial null state to something', () => {
       cluster.checkForNewInstalls(INITIAL_APP_MAP, {
         ...INITIAL_APP_MAP,
-        helm: { status: APPLICATION_STATUS.INSTALLABLE, title: 'Helm Tiller' },
+        helm: { status: INSTALLABLE, title: 'Helm Tiller' },
       });
 
       const flashMessage = document.querySelector('.js-cluster-application-notice .flash-text');
@@ -105,11 +102,11 @@ describe('Clusters', () => {
       cluster.checkForNewInstalls(
         {
           ...INITIAL_APP_MAP,
-          helm: { status: APPLICATION_STATUS.INSTALLING, title: 'Helm Tiller' },
+          helm: { status: INSTALLING, title: 'Helm Tiller' },
         },
         {
           ...INITIAL_APP_MAP,
-          helm: { status: APPLICATION_STATUS.INSTALLED, title: 'Helm Tiller' },
+          helm: { status: INSTALLED, title: 'Helm Tiller' },
         },
       );
 
@@ -125,13 +122,13 @@ describe('Clusters', () => {
       cluster.checkForNewInstalls(
         {
           ...INITIAL_APP_MAP,
-          helm: { status: APPLICATION_STATUS.INSTALLING, title: 'Helm Tiller' },
-          ingress: { status: APPLICATION_STATUS.INSTALLABLE, title: 'Ingress' },
+          helm: { status: INSTALLING, title: 'Helm Tiller' },
+          ingress: { status: INSTALLABLE, title: 'Ingress' },
         },
         {
           ...INITIAL_APP_MAP,
-          helm: { status: APPLICATION_STATUS.INSTALLED, title: 'Helm Tiller' },
-          ingress: { status: APPLICATION_STATUS.INSTALLED, title: 'Ingress' },
+          helm: { status: INSTALLED, title: 'Helm Tiller' },
+          ingress: { status: INSTALLED, title: 'Ingress' },
         },
       );
 
@@ -218,11 +215,11 @@ describe('Clusters', () => {
     it('tries to install helm', () => {
       jest.spyOn(cluster.service, 'installApplication').mockResolvedValueOnce();
 
-      expect(cluster.store.state.applications.helm.requestStatus).toEqual(null);
+      cluster.store.state.applications.helm.status = INSTALLABLE;
 
       cluster.installApplication({ id: 'helm' });
 
-      expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_SUBMITTED);
+      expect(cluster.store.state.applications.helm.status).toEqual(INSTALLING);
       expect(cluster.store.state.applications.helm.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('helm', undefined);
     });
@@ -230,11 +227,11 @@ describe('Clusters', () => {
     it('tries to install ingress', () => {
       jest.spyOn(cluster.service, 'installApplication').mockResolvedValueOnce();
 
-      expect(cluster.store.state.applications.ingress.requestStatus).toEqual(null);
+      cluster.store.state.applications.ingress.status = INSTALLABLE;
 
       cluster.installApplication({ id: 'ingress' });
 
-      expect(cluster.store.state.applications.ingress.requestStatus).toEqual(REQUEST_SUBMITTED);
+      expect(cluster.store.state.applications.ingress.status).toEqual(INSTALLING);
       expect(cluster.store.state.applications.ingress.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('ingress', undefined);
     });
@@ -242,11 +239,11 @@ describe('Clusters', () => {
     it('tries to install runner', () => {
       jest.spyOn(cluster.service, 'installApplication').mockResolvedValueOnce();
 
-      expect(cluster.store.state.applications.runner.requestStatus).toEqual(null);
+      cluster.store.state.applications.runner.status = INSTALLABLE;
 
       cluster.installApplication({ id: 'runner' });
 
-      expect(cluster.store.state.applications.runner.requestStatus).toEqual(REQUEST_SUBMITTED);
+      expect(cluster.store.state.applications.runner.status).toEqual(INSTALLING);
       expect(cluster.store.state.applications.runner.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('runner', undefined);
     });
@@ -254,13 +251,12 @@ describe('Clusters', () => {
     it('tries to install jupyter', () => {
       jest.spyOn(cluster.service, 'installApplication').mockResolvedValueOnce();
 
-      expect(cluster.store.state.applications.jupyter.requestStatus).toEqual(null);
       cluster.installApplication({
         id: 'jupyter',
         params: { hostname: cluster.store.state.applications.jupyter.hostname },
       });
 
-      expect(cluster.store.state.applications.jupyter.requestStatus).toEqual(REQUEST_SUBMITTED);
+      cluster.store.state.applications.jupyter.status = INSTALLABLE;
       expect(cluster.store.state.applications.jupyter.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalledWith('jupyter', {
         hostname: cluster.store.state.applications.jupyter.hostname,
@@ -272,16 +268,18 @@ describe('Clusters', () => {
         .spyOn(cluster.service, 'installApplication')
         .mockRejectedValueOnce(new Error('STUBBED ERROR'));
 
-      expect(cluster.store.state.applications.helm.requestStatus).toEqual(null);
+      cluster.store.state.applications.helm.status = INSTALLABLE;
 
       const promise = cluster.installApplication({ id: 'helm' });
 
-      expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_SUBMITTED);
+      expect(cluster.store.state.applications.helm.status).toEqual(INSTALLING);
       expect(cluster.store.state.applications.helm.requestReason).toEqual(null);
       expect(cluster.service.installApplication).toHaveBeenCalled();
 
       return promise.then(() => {
-        expect(cluster.store.state.applications.helm.requestStatus).toEqual(REQUEST_FAILURE);
+        expect(cluster.store.state.applications.helm.status).toEqual(INSTALLABLE);
+        expect(cluster.store.state.applications.helm.installFailed).toBe(true);
+
         expect(cluster.store.state.applications.helm.requestReason).toBeDefined();
       });
     });
@@ -315,7 +313,6 @@ describe('Clusters', () => {
   });
 
   describe('toggleIngressDomainHelpText', () => {
-    const { INSTALLED, INSTALLABLE, NOT_INSTALLABLE } = APPLICATION_STATUS;
     let ingressPreviousState;
     let ingressNewState;
 
diff --git a/spec/frontend/clusters/components/application_row_spec.js b/spec/frontend/clusters/components/application_row_spec.js
index d26fad54ebe..17273b7d5b1 100644
--- a/spec/frontend/clusters/components/application_row_spec.js
+++ b/spec/frontend/clusters/components/application_row_spec.js
@@ -1,11 +1,6 @@
 import Vue from 'vue';
 import eventHub from '~/clusters/event_hub';
-import {
-  APPLICATION_STATUS,
-  REQUEST_SUBMITTED,
-  REQUEST_FAILURE,
-  UPGRADE_REQUESTED,
-} from '~/clusters/constants';
+import { APPLICATION_STATUS } from '~/clusters/constants';
 import applicationRow from '~/clusters/components/application_row.vue';
 import mountComponent from 'helpers/vue_mount_component_helper';
 import { DEFAULT_APPLICATION_STATE } from '../services/mock_data';
@@ -85,17 +80,6 @@ describe('Application Row', () => {
       expect(vm.installButtonDisabled).toEqual(false);
     });
 
-    it('has loading "Installing" when APPLICATION_STATUS.SCHEDULED', () => {
-      vm = mountComponent(ApplicationRow, {
-        ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.SCHEDULED,
-      });
-
-      expect(vm.installButtonLabel).toEqual('Installing');
-      expect(vm.installButtonLoading).toEqual(true);
-      expect(vm.installButtonDisabled).toEqual(true);
-    });
-
     it('has loading "Installing" when APPLICATION_STATUS.INSTALLING', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
@@ -107,18 +91,6 @@ describe('Application Row', () => {
       expect(vm.installButtonDisabled).toEqual(true);
     });
 
-    it('has loading "Installing" when REQUEST_SUBMITTED', () => {
-      vm = mountComponent(ApplicationRow, {
-        ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.INSTALLABLE,
-        requestStatus: REQUEST_SUBMITTED,
-      });
-
-      expect(vm.installButtonLabel).toEqual('Installing');
-      expect(vm.installButtonLoading).toEqual(true);
-      expect(vm.installButtonDisabled).toEqual(true);
-    });
-
     it('has disabled "Installed" when application is installed and not uninstallable', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
@@ -144,10 +116,11 @@ describe('Application Row', () => {
       expect(installBtn).toBe(null);
     });
 
-    it('has enabled "Install" when APPLICATION_STATUS.ERROR', () => {
+    it('has enabled "Install" when install fails', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.ERROR,
+        status: APPLICATION_STATUS.INSTALLABLE,
+        installFailed: true,
       });
 
       expect(vm.installButtonLabel).toEqual('Install');
@@ -159,7 +132,6 @@ describe('Application Row', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
         status: APPLICATION_STATUS.INSTALLABLE,
-        requestStatus: REQUEST_FAILURE,
       });
 
       expect(vm.installButtonLabel).toEqual('Install');
@@ -251,15 +223,15 @@ describe('Application Row', () => {
       expect(upgradeBtn.innerHTML).toContain('Upgrade');
     });
 
-    it('has enabled "Retry update" when APPLICATION_STATUS.UPDATE_ERRORED', () => {
+    it('has enabled "Retry update" when update process fails', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.UPDATE_ERRORED,
+        status: APPLICATION_STATUS.INSTALLED,
+        updateFailed: true,
       });
       const upgradeBtn = vm.$el.querySelector('.js-cluster-application-upgrade-button');
 
       expect(upgradeBtn).not.toBe(null);
-      expect(vm.upgradeFailed).toBe(true);
       expect(upgradeBtn.innerHTML).toContain('Retry update');
     });
 
@@ -279,7 +251,8 @@ describe('Application Row', () => {
       jest.spyOn(eventHub, '$emit');
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.UPDATE_ERRORED,
+        status: APPLICATION_STATUS.INSTALLED,
+        upgradeAvailable: true,
       });
       const upgradeBtn = vm.$el.querySelector('.js-cluster-application-upgrade-button');
 
@@ -308,7 +281,8 @@ describe('Application Row', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
         title: 'GitLab Runner',
-        status: APPLICATION_STATUS.UPDATE_ERRORED,
+        status: APPLICATION_STATUS.INSTALLED,
+        updateFailed: true,
       });
       const failureMessage = vm.$el.querySelector(
         '.js-cluster-application-upgrade-failure-message',
@@ -324,12 +298,11 @@ describe('Application Row', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
         title: 'GitLab Runner',
-        requestStatus: UPGRADE_REQUESTED,
-        status: APPLICATION_STATUS.UPDATE_ERRORED,
+        updateSuccessful: false,
       });
 
       vm.$toast = { show: jest.fn() };
-      vm.status = APPLICATION_STATUS.UPDATED;
+      vm.updateSuccessful = true;
 
       vm.$nextTick(() => {
         expect(vm.$toast.show).toHaveBeenCalledWith('GitLab Runner upgraded successfully.');
@@ -342,7 +315,8 @@ describe('Application Row', () => {
       const version = '0.1.45';
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.UPDATED,
+        status: APPLICATION_STATUS.INSTALLED,
+        updateSuccessful: true,
         version,
       });
       const upgradeDetails = vm.$el.querySelector('.js-cluster-application-upgrade-details');
@@ -358,7 +332,8 @@ describe('Application Row', () => {
       const chartRepo = 'https://gitlab.com/charts/gitlab-runner';
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.UPDATED,
+        status: APPLICATION_STATUS.INSTALLED,
+        updateSuccessful: true,
         chartRepo,
         version,
       });
@@ -372,7 +347,8 @@ describe('Application Row', () => {
       const version = '0.1.45';
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
-        status: APPLICATION_STATUS.UPDATE_ERRORED,
+        status: APPLICATION_STATUS.INSTALLED,
+        updateFailed: true,
         version,
       });
       const upgradeDetails = vm.$el.querySelector('.js-cluster-application-upgrade-details');
@@ -388,7 +364,6 @@ describe('Application Row', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
         status: null,
-        requestStatus: null,
       });
       const generalErrorMessage = vm.$el.querySelector(
         '.js-cluster-application-general-error-message',
@@ -397,12 +372,13 @@ describe('Application Row', () => {
       expect(generalErrorMessage).toBeNull();
     });
 
-    it('shows status reason when APPLICATION_STATUS.ERROR', () => {
+    it('shows status reason when install fails', () => {
       const statusReason = 'We broke it 0.0';
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
         status: APPLICATION_STATUS.ERROR,
         statusReason,
+        installFailed: true,
       });
       const generalErrorMessage = vm.$el.querySelector(
         '.js-cluster-application-general-error-message',
@@ -423,7 +399,7 @@ describe('Application Row', () => {
       vm = mountComponent(ApplicationRow, {
         ...DEFAULT_APPLICATION_STATE,
         status: APPLICATION_STATUS.INSTALLABLE,
-        requestStatus: REQUEST_FAILURE,
+        installFailed: true,
         requestReason,
       });
       const generalErrorMessage = vm.$el.querySelector(
diff --git a/spec/frontend/clusters/services/application_state_machine_spec.js b/spec/frontend/clusters/services/application_state_machine_spec.js
new file mode 100644
index 00000000000..e74b7910572
--- /dev/null
+++ b/spec/frontend/clusters/services/application_state_machine_spec.js
@@ -0,0 +1,134 @@
+import transitionApplicationState from '~/clusters/services/application_state_machine';
+import { APPLICATION_STATUS, UPDATE_EVENT, INSTALL_EVENT } from '~/clusters/constants';
+
+const {
+  NO_STATUS,
+  SCHEDULED,
+  NOT_INSTALLABLE,
+  INSTALLABLE,
+  INSTALLING,
+  INSTALLED,
+  ERROR,
+  UPDATING,
+  UPDATED,
+  UPDATE_ERRORED,
+} = APPLICATION_STATUS;
+
+const NO_EFFECTS = 'no effects';
+
+describe('applicationStateMachine', () => {
+  const noEffectsToEmptyObject = effects => (typeof effects === 'string' ? {} : effects);
+
+  describe(`current state is ${NO_STATUS}`, () => {
+    it.each`
+      expectedState      | event              | effects
+      ${INSTALLING}      | ${SCHEDULED}       | ${NO_EFFECTS}
+      ${NOT_INSTALLABLE} | ${NOT_INSTALLABLE} | ${NO_EFFECTS}
+      ${INSTALLABLE}     | ${INSTALLABLE}     | ${NO_EFFECTS}
+      ${INSTALLING}      | ${INSTALLING}      | ${NO_EFFECTS}
+      ${INSTALLED}       | ${INSTALLED}       | ${NO_EFFECTS}
+      ${INSTALLABLE}     | ${ERROR}           | ${{ installFailed: true }}
+      ${UPDATING}        | ${UPDATING}        | ${NO_EFFECTS}
+      ${INSTALLED}       | ${UPDATED}         | ${NO_EFFECTS}
+      ${INSTALLED}       | ${UPDATE_ERRORED}  | ${{ updateFailed: true }}
+    `(`transitions to $expectedState on $event event and applies $effects`, data => {
+      const { expectedState, event, effects } = data;
+      const currentAppState = {
+        status: NO_STATUS,
+      };
+
+      expect(transitionApplicationState(currentAppState, event)).toEqual({
+        status: expectedState,
+        ...noEffectsToEmptyObject(effects),
+      });
+    });
+  });
+
+  describe(`current state is ${NOT_INSTALLABLE}`, () => {
+    it.each`
+      expectedState  | event          | effects
+      ${INSTALLABLE} | ${INSTALLABLE} | ${NO_EFFECTS}
+    `(`transitions to $expectedState on $event event and applies $effects`, data => {
+      const { expectedState, event, effects } = data;
+      const currentAppState = {
+        status: NOT_INSTALLABLE,
+      };
+
+      expect(transitionApplicationState(currentAppState, event)).toEqual({
+        status: expectedState,
+        ...noEffectsToEmptyObject(effects),
+      });
+    });
+  });
+
+  describe(`current state is ${INSTALLABLE}`, () => {
+    it.each`
+      expectedState | event            | effects
+      ${INSTALLING} | ${INSTALL_EVENT} | ${{ installFailed: false }}
+      ${INSTALLED}  | ${INSTALLED}     | ${NO_EFFECTS}
+    `(`transitions to $expectedState on $event event and applies $effects`, data => {
+      const { expectedState, event, effects } = data;
+      const currentAppState = {
+        status: INSTALLABLE,
+      };
+
+      expect(transitionApplicationState(currentAppState, event)).toEqual({
+        status: expectedState,
+        ...noEffectsToEmptyObject(effects),
+      });
+    });
+  });
+
+  describe(`current state is ${INSTALLING}`, () => {
+    it.each`
+      expectedState  | event        | effects
+      ${INSTALLED}   | ${INSTALLED} | ${NO_EFFECTS}
+      ${INSTALLABLE} | ${ERROR}     | ${{ installFailed: true }}
+    `(`transitions to $expectedState on $event event and applies $effects`, data => {
+      const { expectedState, event, effects } = data;
+      const currentAppState = {
+        status: INSTALLING,
+      };
+
+      expect(transitionApplicationState(currentAppState, event)).toEqual({
+        status: expectedState,
+        ...noEffectsToEmptyObject(effects),
+      });
+    });
+  });
+
+  describe(`current state is ${INSTALLED}`, () => {
+    it.each`
+      expectedState | event           | effects
+      ${UPDATING}   | ${UPDATE_EVENT} | ${{ updateFailed: false, updateSuccessful: false }}
+    `(`transitions to $expectedState on $event event and applies $effects`, data => {
+      const { expectedState, event, effects } = data;
+      const currentAppState = {
+        status: INSTALLED,
+      };
+
+      expect(transitionApplicationState(currentAppState, event)).toEqual({
+        status: expectedState,
+        ...effects,
+      });
+    });
+  });
+
+  describe(`current state is ${UPDATING}`, () => {
+    it.each`
+      expectedState | event             | effects
+      ${INSTALLED}  | ${UPDATED}        | ${{ updateSuccessful: true, updateAcknowledged: false }}
+      ${INSTALLED}  | ${UPDATE_ERRORED} | ${{ updateFailed: true }}
+    `(`transitions to $expectedState on $event event and applies $effects`, data => {
+      const { expectedState, event, effects } = data;
+      const currentAppState = {
+        status: UPDATING,
+      };
+
+      expect(transitionApplicationState(currentAppState, event)).toEqual({
+        status: expectedState,
+        ...effects,
+      });
+    });
+  });
+});
diff --git a/spec/frontend/clusters/services/mock_data.js b/spec/frontend/clusters/services/mock_data.js
index b4d1bb710e0..1e896af1c7d 100644
--- a/spec/frontend/clusters/services/mock_data.js
+++ b/spec/frontend/clusters/services/mock_data.js
@@ -113,7 +113,6 @@ const DEFAULT_APPLICATION_STATE = {
   description: 'Some description about this interesting application!',
   status: null,
   statusReason: null,
-  requestStatus: null,
   requestReason: null,
 };
 
diff --git a/spec/frontend/clusters/stores/clusters_store_spec.js b/spec/frontend/clusters/stores/clusters_store_spec.js
index c0e8b737ea2..a20e0439555 100644
--- a/spec/frontend/clusters/stores/clusters_store_spec.js
+++ b/spec/frontend/clusters/stores/clusters_store_spec.js
@@ -32,15 +32,6 @@ describe('Clusters Store', () => {
   });
 
   describe('updateAppProperty', () => {
-    it('should store new request status', () => {
-      expect(store.state.applications.helm.requestStatus).toEqual(null);
-
-      const newStatus = APPLICATION_STATUS.INSTALLING;
-      store.updateAppProperty('helm', 'requestStatus', newStatus);
-
-      expect(store.state.applications.helm.requestStatus).toEqual(newStatus);
-    });
-
     it('should store new request reason', () => {
       expect(store.state.applications.helm.requestReason).toEqual(null);
 
@@ -68,80 +59,90 @@ describe('Clusters Store', () => {
             title: 'Helm Tiller',
             status: mockResponseData.applications[0].status,
             statusReason: mockResponseData.applications[0].status_reason,
-            requestStatus: null,
             requestReason: null,
             installed: false,
+            installFailed: false,
+            uninstallable: false,
           },
           ingress: {
             title: 'Ingress',
-            status: mockResponseData.applications[1].status,
+            status: APPLICATION_STATUS.INSTALLABLE,
             statusReason: mockResponseData.applications[1].status_reason,
-            requestStatus: null,
             requestReason: null,
             externalIp: null,
             externalHostname: null,
             installed: false,
+            installFailed: true,
+            uninstallable: false,
           },
           runner: {
             title: 'GitLab Runner',
             status: mockResponseData.applications[2].status,
             statusReason: mockResponseData.applications[2].status_reason,
-            requestStatus: null,
             requestReason: null,
             version: mockResponseData.applications[2].version,
             upgradeAvailable: mockResponseData.applications[2].update_available,
             chartRepo: 'https://gitlab.com/charts/gitlab-runner',
             installed: false,
+            installFailed: false,
+            updateAcknowledged: true,
+            updateFailed: false,
+            updateSuccessful: false,
+            uninstallable: false,
           },
           prometheus: {
             title: 'Prometheus',
-            status: mockResponseData.applications[3].status,
+            status: APPLICATION_STATUS.INSTALLABLE,
             statusReason: mockResponseData.applications[3].status_reason,
-            requestStatus: null,
             requestReason: null,
             installed: false,
+            installFailed: true,
+            uninstallable: false,
           },
           jupyter: {
             title: 'JupyterHub',
             status: mockResponseData.applications[4].status,
             statusReason: mockResponseData.applications[4].status_reason,
-            requestStatus: null,
             requestReason: null,
             hostname: '',
             installed: false,
+            installFailed: false,
+            uninstallable: false,
           },
           knative: {
             title: 'Knative',
             status: mockResponseData.applications[5].status,
             statusReason: mockResponseData.applications[5].status_reason,
-            requestStatus: null,
             requestReason: null,
             hostname: null,
             isEditingHostName: false,
             externalIp: null,
             externalHostname: null,
             installed: false,
+            installFailed: false,
+            uninstallable: false,
           },
           cert_manager: {
             title: 'Cert-Manager',
-            status: mockResponseData.applications[6].status,
+            status: APPLICATION_STATUS.INSTALLABLE,
+            installFailed: true,
             statusReason: mockResponseData.applications[6].status_reason,
-            requestStatus: null,
             requestReason: null,
             email: mockResponseData.applications[6].email,
             installed: false,
+            uninstallable: false,
           },
         },
       });
     });
 
-    describe.each(APPLICATION_INSTALLED_STATUSES)('given the current app status is %s', () => {
+    describe.each(APPLICATION_INSTALLED_STATUSES)('given the current app status is %s', status => {
       it('marks application as installed', () => {
         const mockResponseData =
           CLUSTERS_MOCK_DATA.GET['/gitlab-org/gitlab-shell/clusters/2/status.json'].data;
         const runnerAppIndex = 2;
 
-        mockResponseData.applications[runnerAppIndex].status = APPLICATION_STATUS.INSTALLED;
+        mockResponseData.applications[runnerAppIndex].status = status;
 
         store.updateStateFromServer(mockResponseData);