[CLD-435] developer uninstall client installed apps (#184)

* [CLD-435] developer uninstall client installed apps

* [CLD-435] fix review and test

* [CLD-435] add type component compose redux and withFormik

* [CLD-435] fix test failed

src/actions/__tests__/app-installations.ts

@@ -0,0 +1,39 @@
+import {
+  appInstallationsReceiveData,
+  appInstallationsRequestData,
+  appInstallationsRequestDataFailure,
+  appInstallationsRequestInstall,
+  appInstallationsRequestUninstall,
+  appInstallationsSetFormState
+} from '../app-installations'
+import ActionTypes from '@/constants/action-types'
+import { installationsStub } from '@/sagas/__stubs__/installations'
+
+describe('app install actions', () => {
+  it('should create a appInstallationsReceiveData action', () => {
+    expect(appInstallationsReceiveData.type).toEqual(ActionTypes.APP_INSTALLATIONS_RECEIVE_DATA)
+    expect(appInstallationsReceiveData(installationsStub).data).toEqual(installationsStub)
+  })
+  it('should create a appInstallationsRequestData action', () => {
+    expect(appInstallationsRequestData.type).toEqual(ActionTypes.APP_INSTALLATIONS_REQUEST_DATA)
+    expect(appInstallationsRequestData({ appId: ['1'] }).data).toEqual({ appId: ['1'] })
+  })
+  it('should create a appInstallationsRequestDataFailure action', () => {
+    expect(appInstallationsRequestDataFailure.type).toEqual(ActionTypes.APP_INSTALLATIONS_REQUEST_DATA_FAILURE)
+  })
+  it('should create a appInstallationsRequestInstall action', () => {
+    expect(appInstallationsRequestInstall.type).toEqual(ActionTypes.APP_INSTALLATIONS_REQUEST_INSTALL)
+    expect(appInstallationsRequestInstall({ appId: '1' }).data).toEqual({ appId: '1' })
+  })
+  it('should create a appInstallationsRequestUninstall action', () => {
+    expect(appInstallationsRequestUninstall.type).toEqual(ActionTypes.APP_INSTALLATIONS_REQUEST_UNINSTALL)
+    expect(appInstallationsRequestUninstall({ appId: '1', installationId: '1' }).data).toEqual({
+      appId: '1',
+      installationId: '1'
+    })
+  })
+  it('should create a appInstallationsSetFormState action', () => {
+    expect(appInstallationsSetFormState.type).toEqual(ActionTypes.APP_INSTALLATIONS_SET_FORM_STATE)
+    expect(appInstallationsSetFormState('PENDING').data).toEqual('PENDING')
+  })
+})

src/actions/app-installations.ts

@@ -0,0 +1,39 @@
+import { actionCreator } from '../utils/actions'
+import ActionTypes from '../constants/action-types'
+import { FormState } from '../types/core'
+import {
+  PagedResultInstallationModel_,
+  TerminateInstallationModel,
+  CreateInstallationModel
+} from '@/types/marketplace-api-schema'
+
+export interface InstallationParams {
+  appId?: string[]
+  developerId?: string[]
+  clientId?: string[]
+  externalAppId?: string[]
+  showTerminated?: boolean
+  pageSize?: number
+  pageNumber?: number
+}
+
+export type InstallParams = CreateInstallationModel
+
+export type UninstallParams = {
+  installationId: string
+} & TerminateInstallationModel
+
+export const appInstallationsRequestData = actionCreator<InstallationParams>(ActionTypes.APP_INSTALLATIONS_REQUEST_DATA)
+export const appInstallationsReceiveData = actionCreator<PagedResultInstallationModel_>(
+  ActionTypes.APP_INSTALLATIONS_RECEIVE_DATA
+)
+export const appInstallationsRequestDataFailure = actionCreator<void>(
+  ActionTypes.APP_INSTALLATIONS_REQUEST_DATA_FAILURE
+)
+export const appInstallationsRequestInstall = actionCreator<InstallParams>(
+  ActionTypes.APP_INSTALLATIONS_REQUEST_INSTALL
+)
+export const appInstallationsRequestUninstall = actionCreator<UninstallParams>(
+  ActionTypes.APP_INSTALLATIONS_REQUEST_UNINSTALL
+)
+export const appInstallationsSetFormState = actionCreator<FormState>(ActionTypes.APP_INSTALLATIONS_SET_FORM_STATE)

src/components/pages/__tests__/__snapshots__/client.tsx.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Client should match a snapshot 1`] = `
+exports[`Client should match a snapshot when LOADING false 1`] = `
 <Connect(ErrorBoundary)>
   <div>
     <withRouter(Connect(Component)) />
@@ -80,7 +80,7 @@ exports[`Client should match a snapshot 1`] = `
 </Connect(ErrorBoundary)>
 `;
 
-exports[`Client should match a snapshot 2`] = `
+exports[`Client should match a snapshot when LOADING true 1`] = `
 <Connect(ErrorBoundary)>
   <div>
     <withRouter(Connect(Component)) />

src/components/pages/__tests__/client.tsx

@@ -3,7 +3,6 @@ import { shallow } from 'enzyme'
 import toJson from 'enzyme-to-json'
 import { appsDataStub, featuredAppsDataStub } from '@/sagas/__stubs__/apps'
 import { ReduxState } from '@/types/core'
-import routes from '@/constants/routes'
 import { ClientItem } from '@/reducers/client'
 import {
   Client,
@@ -18,53 +17,46 @@ import {
 import { addQuery } from '@/utils/client-url-params'
 import { AppSummaryModel } from '@/types/marketplace-api-schema'
 import { RouteComponentProps, StaticContext } from 'react-router'
-import { AppDetailState } from '@/reducers/app-detail'
+import { appDetailDataStub } from '@/sagas/__stubs__/app-detail'
 
-describe('Client', () => {
-  it('should match a snapshot', () => {
-    const props: ClientProps = {
-      clientState: {
-        loading: false,
-        clientData: {
-          featuredApps: featuredAppsDataStub.data,
-          apps: appsDataStub
-        } as ClientItem
-      },
-      // @ts-ignore: just pick the needed props for the test
-      match: {
-        params: {
-          page: '2'
-        }
-      },
-      // @ts-ignore: just pick the needed props for the test
-      location: {
-        search: 'page=1'
-      }
+const routerProps = {
+  match: {
+    params: {
+      page: '2'
     }
-    expect(toJson(shallow(<Client {...props} />))).toMatchSnapshot()
+  },
+  location: {
+    search: 'page=1'
+  }
+} as RouteComponentProps<any, StaticContext, any>
+
+const props = (loading: boolean): ClientProps => ({
+  clientState: {
+    loading: loading,
+    clientData: {
+      featuredApps: featuredAppsDataStub.data,
+      apps: appsDataStub
+    } as ClientItem
+  },
+  appDetail: {
+    appDetailData: appDetailDataStub,
+    loading: false,
+    error: false
+  },
+  clientId: '1',
+  installationsFormState: 'PENDING',
+  installationsSetFormState: jest.fn(),
+  fetchAppDetail: jest.fn(),
+  ...routerProps
+})
+
+describe('Client', () => {
+  it('should match a snapshot when LOADING false', () => {
+    expect(toJson(shallow(<Client {...props(false)} />))).toMatchSnapshot()
   })
 
-  it('should match a snapshot', () => {
-    const props: ClientProps = {
-      clientState: {
-        loading: true,
-        clientData: {
-          featuredApps: featuredAppsDataStub.data,
-          apps: appsDataStub
-        } as ClientItem
-      },
-      // @ts-ignore: just pick the needed props for the test
-      match: {
-        params: {
-          page: '2'
-        }
-      },
-      // @ts-ignore: just pick the needed props for the test
-      location: {
-        search: 'page=1'
-      }
-    }
-    expect(toJson(shallow(<Client {...props} />))).toMatchSnapshot()
+  it('should match a snapshot when LOADING true', () => {
+    expect(toJson(shallow(<Client {...props(true)} />))).toMatchSnapshot()
   })
 
   it('should match a snapshot when featured apps is empty []', () => {
@@ -87,26 +79,22 @@ describe('Client', () => {
           apps: appsDataStub
         } as ClientItem
       },
+      appDetail: {
+        appDetailData: appDetailDataStub,
+        loading: false,
+        error: false
+      },
+      clientId: '1',
+      installationsFormState: 'PENDING',
+      installationsSetFormState: jest.fn(),
       fetchAppDetail: jest.fn(),
-      appDetail: {} as AppDetailState,
-      clientId: 'ABC',
       ...routerProps
     }
+
     expect(toJson(shallow(<Client {...props} />))).toMatchSnapshot()
   })
 
   it('should match a snapshot when featured apps is undefined', () => {
-    const routerProps = {
-      match: {
-        params: {
-          page: '2'
-        }
-      },
-      location: {
-        search: 'page=1'
-      }
-    } as RouteComponentProps<any, StaticContext, any>
-
     const props: ClientProps = {
       clientState: {
         loading: false,
@@ -115,44 +103,70 @@ describe('Client', () => {
           apps: appsDataStub
         } as ClientItem
       },
+      appDetail: {
+        appDetailData: appDetailDataStub,
+        loading: false,
+        error: false
+      },
+      clientId: '1',
+      installationsFormState: 'PENDING',
+      installationsSetFormState: jest.fn(),
       fetchAppDetail: jest.fn(),
-      appDetail: {} as AppDetailState,
-      clientId: 'ABC',
       ...routerProps
     }
+
     expect(toJson(shallow(<Client {...props} />))).toMatchSnapshot()
   })
 
   describe('mapStateToProps', () => {
     it('should return correctly', () => {
       const mockState = {
-        client: {},
-        appDetail: {},
+        client: {
+          clientData: {
+            featuredApps: featuredAppsDataStub.data,
+            apps: appsDataStub
+          }
+        },
+        appDetail: {
+          appDetailData: appDetailDataStub,
+          error: false,
+          loading: false
+        },
         auth: {
           loginSession: {
             loginIdentity: {
               clientId: 'ABC'
             }
           }
+        },
+        installations: {
+          formState: 'PENDING'
         }
       } as ReduxState
       const output = {
         clientState: mockState.client,
         appDetail: mockState.appDetail,
-        clientId: 'ABC'
+        clientId: 'ABC',
+        installationsFormState: 'PENDING'
       }
       const result = mapStateToProps(mockState)
       expect(result).toEqual(output)
     })
   })
 
   describe('mapDispatchToProps', () => {
-    it('should call dispatch correctly', () => {
+    it('should call fetchAppDetail correctly', () => {
       const mockDispatch = jest.fn()
       const { fetchAppDetail } = mapDispatchToProps(mockDispatch)
       fetchAppDetail('123', 'ABC')
       expect(mockDispatch).toBeCalled()
     })
+    it('should call installationsSetFormState correctly', () => {
+      const mockDispatch = jest.fn()
+      const { installationsSetFormState } = mapDispatchToProps(mockDispatch)
+      installationsSetFormState('SUCCESS')
+      expect(mockDispatch).toBeCalled()
+    })
   })
 
   describe('handleOnChange', () => {