Skip to content

Commit 47eb18d

Browse files
RI-7187 use existing isOpenDialog flag for source pipeline (#4766)
1 parent 78b64b8 commit 47eb18d

File tree

7 files changed

+131
-114
lines changed

7 files changed

+131
-114
lines changed

redisinsight/ui/src/pages/rdi/pipeline-management/components/source-pipeline-dialog/SourcePipelineModal.spec.tsx

Lines changed: 114 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,14 @@ import {
1212
getPipeline,
1313
rdiPipelineSelector,
1414
setChangedFile,
15-
setPipeline,
1615
} from 'uiSrc/slices/rdi/pipeline'
17-
import { setPipelineDialogState } from 'uiSrc/slices/app/context'
16+
import {
17+
appContextPipelineManagement,
18+
setPipelineDialogState,
19+
} from 'uiSrc/slices/app/context'
1820
import { sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
1921
import { FileChangeType } from 'uiSrc/slices/interfaces'
2022
import SourcePipelineDialog, {
21-
EMPTY_PIPELINE,
2223
PipelineSourceOptions,
2324
} from './SourcePipelineModal'
2425

@@ -42,117 +43,155 @@ jest.mock('uiSrc/slices/rdi/pipeline', () => ({
4243
rdiPipelineSelector: jest.fn(),
4344
}))
4445

46+
jest.mock('uiSrc/slices/app/context', () => ({
47+
...jest.requireActual('uiSrc/slices/app/context'),
48+
appContextPipelineManagement: jest.fn(),
49+
}))
50+
4551
let store: typeof mockedStore
4652
beforeEach(() => {
4753
cleanup()
4854
store = cloneDeep(mockedStore)
4955
store.clearActions()
5056
;(rdiPipelineSelector as jest.Mock).mockReturnValue({
5157
...initialStateDefault.rdi.pipeline,
52-
loading: false,
53-
config: '',
58+
})
59+
;(appContextPipelineManagement as jest.Mock).mockReturnValue({
60+
...initialStateDefault.app.context.pipelineManagement,
5461
})
5562
})
5663

5764
describe('SourcePipelineDialog', () => {
58-
it('should render', () => {
59-
expect(render(<SourcePipelineDialog />)).toBeTruthy()
60-
})
61-
62-
it('should call proper actions after select fetch from server option', () => {
63-
const sendEventTelemetryMock = jest.fn()
64-
;(sendEventTelemetry as jest.Mock).mockImplementation(
65-
() => sendEventTelemetryMock,
66-
)
67-
65+
it('should not show dialog by default and not set isOpenDialog to true', () => {
6866
render(<SourcePipelineDialog />)
6967

70-
fireEvent.click(screen.getByTestId('server-source-pipeline-dialog'))
71-
72-
const expectedActions = [getPipeline(), setPipelineDialogState(false)]
68+
expect(
69+
screen.queryByTestId('file-source-pipeline-dialog'),
70+
).not.toBeInTheDocument()
7371

74-
expect(store.getActions()).toEqual(expectedActions)
75-
expect(sendEventTelemetry).toBeCalledWith({
76-
event: TelemetryEvent.RDI_START_OPTION_SELECTED,
77-
eventData: {
78-
id: 'rdiInstanceId',
79-
option: PipelineSourceOptions.SERVER,
80-
},
81-
})
72+
expect(store.getActions()).toEqual([])
8273
})
8374

84-
it('should call proper actions after select empty pipeline option', () => {
85-
const sendEventTelemetryMock = jest.fn()
86-
;(sendEventTelemetry as jest.Mock).mockImplementation(
87-
() => sendEventTelemetryMock,
88-
)
89-
render(<SourcePipelineDialog />)
90-
91-
fireEvent.click(screen.getByTestId('empty-source-pipeline-dialog'))
92-
93-
const expectedActions = [
94-
setPipeline(EMPTY_PIPELINE),
95-
setChangedFile({ name: 'config', status: FileChangeType.Added }),
96-
setPipelineDialogState(false),
97-
]
98-
99-
expect(store.getActions()).toEqual(expectedActions)
100-
expect(sendEventTelemetry).toBeCalledWith({
101-
event: TelemetryEvent.RDI_START_OPTION_SELECTED,
102-
eventData: {
103-
id: 'rdiInstanceId',
104-
option: PipelineSourceOptions.NEW,
105-
},
75+
it('should show dialog when isOpenDialog flag is true', () => {
76+
;(appContextPipelineManagement as jest.Mock).mockReturnValue({
77+
...initialStateDefault.app.context.pipelineManagement,
78+
isOpenDialog: true,
10679
})
107-
})
10880

109-
it('should call proper telemetry event after select empty pipeline option', () => {
110-
const sendEventTelemetryMock = jest.fn()
111-
;(sendEventTelemetry as jest.Mock).mockImplementation(
112-
() => sendEventTelemetryMock,
113-
)
11481
render(<SourcePipelineDialog />)
11582

116-
fireEvent.click(screen.getByTestId('file-source-pipeline-dialog'))
117-
118-
expect(sendEventTelemetry).toBeCalledWith({
119-
event: TelemetryEvent.RDI_START_OPTION_SELECTED,
120-
eventData: {
121-
id: 'rdiInstanceId',
122-
option: PipelineSourceOptions.FILE,
123-
},
124-
})
83+
expect(
84+
screen.queryByTestId('file-source-pipeline-dialog'),
85+
).toBeInTheDocument()
12586
})
12687

12788
it('should not show dialog when there is deployed pipeline on a server', () => {
128-
const sendEventTelemetryMock = jest.fn()
129-
;(sendEventTelemetry as jest.Mock).mockImplementation(
130-
() => sendEventTelemetryMock,
131-
)
13289
;(rdiPipelineSelector as jest.Mock).mockReturnValue({
13390
...initialStateDefault.rdi.pipeline,
13491
loading: false,
135-
config: 'deployed config',
92+
data: { config: 'some config' },
13693
})
13794

13895
render(<SourcePipelineDialog />)
13996

140-
expect(screen.queryByTestId('file-source-pipeline-dialog')).not.toBeInTheDocument()
97+
expect(store.getActions()).toEqual([])
14198
})
14299

143100
it('should not show dialog when config is fetching', () => {
144-
const sendEventTelemetryMock = jest.fn()
145-
;(sendEventTelemetry as jest.Mock).mockImplementation(
146-
() => sendEventTelemetryMock,
147-
)
148101
;(rdiPipelineSelector as jest.Mock).mockReturnValue({
149102
...initialStateDefault.rdi.pipeline,
150103
loading: true,
151-
config: '',
104+
data: null,
105+
})
106+
107+
render(<SourcePipelineDialog />)
108+
109+
expect(store.getActions()).toEqual([])
110+
})
111+
112+
it('should show dialog when there is no pipeline on a server', () => {
113+
;(rdiPipelineSelector as jest.Mock).mockReturnValue({
114+
...initialStateDefault.rdi.pipeline,
115+
loading: false,
116+
data: { config: '' },
152117
})
153118

154119
render(<SourcePipelineDialog />)
155120

156-
expect(screen.queryByTestId('file-source-pipeline-dialog')).not.toBeInTheDocument()
121+
expect(store.getActions()).toEqual([setPipelineDialogState(true)])
122+
})
123+
124+
describe('Telemetry events', () => {
125+
const sendEventTelemetryMock = jest.fn()
126+
127+
beforeEach(() => {
128+
;(sendEventTelemetry as jest.Mock).mockImplementation(
129+
() => sendEventTelemetryMock,
130+
)
131+
;(appContextPipelineManagement as jest.Mock).mockReturnValue({
132+
...initialStateDefault.app.context.pipelineManagement,
133+
isOpenDialog: true,
134+
})
135+
})
136+
137+
it('should call proper actions after select fetch from server option', () => {
138+
render(<SourcePipelineDialog />)
139+
140+
fireEvent.click(screen.getByTestId('server-source-pipeline-dialog'))
141+
142+
const expectedActions = [getPipeline(), setPipelineDialogState(false)]
143+
144+
expect(store.getActions()).toEqual(expectedActions)
145+
expect(sendEventTelemetry).toBeCalledWith({
146+
event: TelemetryEvent.RDI_START_OPTION_SELECTED,
147+
eventData: {
148+
id: 'rdiInstanceId',
149+
option: PipelineSourceOptions.SERVER,
150+
},
151+
})
152+
})
153+
154+
it('should call proper actions after select empty pipeline option', () => {
155+
render(<SourcePipelineDialog />)
156+
157+
fireEvent.click(screen.getByTestId('empty-source-pipeline-dialog'))
158+
159+
const expectedActions = [
160+
setChangedFile({ name: 'config', status: FileChangeType.Added }),
161+
setPipelineDialogState(false),
162+
]
163+
164+
expect(store.getActions()).toEqual(expectedActions)
165+
expect(sendEventTelemetry).toBeCalledWith({
166+
event: TelemetryEvent.RDI_START_OPTION_SELECTED,
167+
eventData: {
168+
id: 'rdiInstanceId',
169+
option: PipelineSourceOptions.NEW,
170+
},
171+
})
172+
})
173+
174+
it('should call proper telemetry event after select empty pipeline option', () => {
175+
const sendEventTelemetryMock = jest.fn()
176+
;(sendEventTelemetry as jest.Mock).mockImplementation(
177+
() => sendEventTelemetryMock,
178+
)
179+
;(appContextPipelineManagement as jest.Mock).mockReturnValue({
180+
...initialStateDefault.app.context.pipelineManagement,
181+
isOpenDialog: true,
182+
})
183+
184+
render(<SourcePipelineDialog />)
185+
186+
fireEvent.click(screen.getByTestId('file-source-pipeline-dialog'))
187+
188+
expect(sendEventTelemetry).toBeCalledWith({
189+
event: TelemetryEvent.RDI_START_OPTION_SELECTED,
190+
eventData: {
191+
id: 'rdiInstanceId',
192+
option: PipelineSourceOptions.FILE,
193+
},
194+
})
195+
})
157196
})
158197
})

redisinsight/ui/src/pages/rdi/pipeline-management/components/source-pipeline-dialog/SourcePipelineModal.tsx

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useState } from 'react'
1+
import React, { useEffect, useState } from 'react'
22
import {
33
EuiIcon,
44
EuiModal,
@@ -15,7 +15,6 @@ import {
1515
fetchRdiPipeline,
1616
rdiPipelineSelector,
1717
setChangedFile,
18-
setPipeline,
1918
} from 'uiSrc/slices/rdi/pipeline'
2019
import {
2120
appContextPipelineManagement,
@@ -45,8 +44,15 @@ const SourcePipelineDialog = () => {
4544

4645
const { isOpenDialog } = useSelector(appContextPipelineManagement)
4746

48-
const { loading: pipelineLoading, config: pipelineConfig } =
49-
useSelector(rdiPipelineSelector)
47+
// data is original response from the server converted to config and jobs yaml strings
48+
// since by default it is null we can determine if it was fetched and it's content
49+
const { data } = useSelector(rdiPipelineSelector)
50+
51+
useEffect(() => {
52+
if (data?.config === '') {
53+
dispatch(setPipelineDialogState(true))
54+
}
55+
}, [data])
5056

5157
const dispatch = useDispatch()
5258

@@ -67,14 +73,12 @@ const SourcePipelineDialog = () => {
6773
}
6874

6975
const onStartNewPipeline = () => {
70-
dispatch(setPipeline(EMPTY_PIPELINE))
7176
onSelect(PipelineSourceOptions.NEW)
7277
dispatch(setChangedFile({ name: 'config', status: FileChangeType.Added }))
7378
dispatch(setPipelineDialogState(false))
7479
}
7580

7681
const handleCloseDialog = () => {
77-
dispatch(setPipeline(EMPTY_PIPELINE))
7882
dispatch(setChangedFile({ name: 'config', status: FileChangeType.Added }))
7983
dispatch(setPipelineDialogState(false))
8084
}
@@ -100,7 +104,7 @@ const SourcePipelineDialog = () => {
100104
)
101105
}
102106

103-
if (!isOpenDialog || pipelineConfig?.length > 0 || pipelineLoading) {
107+
if (!isOpenDialog) {
104108
return null
105109
}
106110

redisinsight/ui/src/pages/rdi/pipeline-management/pages/config/Config.spec.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import {
66
setChangedFile,
77
deleteChangedFile,
88
setPipelineConfig,
9+
getPipelineStrategies,
910
} from 'uiSrc/slices/rdi/pipeline'
1011
import { rdiTestConnectionsSelector } from 'uiSrc/slices/rdi/testConnections'
1112
import {
@@ -126,6 +127,7 @@ describe('Config', () => {
126127
fireEvent.change(fieldName, { target: { value: '123' } })
127128

128129
const expectedActions = [
130+
getPipelineStrategies(),
129131
setPipelineConfig('123'),
130132
deleteChangedFile('config'),
131133
]
@@ -149,6 +151,7 @@ describe('Config', () => {
149151
fireEvent.change(fieldName, { target: { value: '123' } })
150152

151153
const expectedActions = [
154+
getPipelineStrategies(),
152155
setPipelineConfig('123'),
153156
setChangedFile({ name: 'config', status: FileChangeType.Modified }),
154157
]

redisinsight/ui/src/slices/app/context.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -123,7 +123,7 @@ export const initialState: StateAppContext = {
123123
},
124124
pipelineManagement: {
125125
lastViewedPage: '',
126-
isOpenDialog: true,
126+
isOpenDialog: false,
127127
},
128128
}
129129

@@ -351,7 +351,7 @@ const appContextSlice = createSlice({
351351
},
352352
resetPipelineManagement: (state) => {
353353
state.pipelineManagement.lastViewedPage = ''
354-
state.pipelineManagement.isOpenDialog = true
354+
state.pipelineManagement.isOpenDialog = false
355355
},
356356
},
357357
})

redisinsight/ui/src/slices/rdi/pipeline.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -72,9 +72,6 @@ const rdiPipelineSlice = createSlice({
7272
resetPipelineChecked: (state, { payload }: PayloadAction<boolean>) => {
7373
state.resetChecked = payload
7474
},
75-
setPipeline: (state, { payload }: PayloadAction<IPipeline>) => {
76-
state.data = payload
77-
},
7875
getPipeline: (state) => {
7976
state.loading = true
8077
},
@@ -227,7 +224,6 @@ export const {
227224
getPipelineStrategies,
228225
getPipelineStrategiesSuccess,
229226
getPipelineStrategiesFailure,
230-
setPipeline,
231227
setPipelineConfig,
232228
setPipelineJobs,
233229
setPipelineInitialState,

redisinsight/ui/src/slices/tests/app/context.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -748,7 +748,7 @@ describe('slices', () => {
748748
}
749749
const state = {
750750
lastViewedPage: '',
751-
isOpenDialog: true,
751+
isOpenDialog: false,
752752
}
753753

754754
// Act

0 commit comments

Comments
 (0)