Skip to content

Commit af666fe

Browse files
committed
RI-6067 move reset/start/stop state into 1
1 parent f09fa16 commit af666fe

File tree

16 files changed

+123
-413
lines changed

16 files changed

+123
-413
lines changed

redisinsight/ui/src/pages/rdi/instance/InstancePage.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -107,8 +107,9 @@ const RdiInstancePage = ({ routes = [] }: Props) => {
107107
const updatePipelineStatus = () => {
108108
if (resetChecked) {
109109
dispatch(resetPipelineChecked(false))
110-
dispatch(resetPipelineAction(rdiInstanceId, (result: IActionPipelineResultProps) =>
111-
actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_RESET, result)))
110+
dispatch(resetPipelineAction(rdiInstanceId,
111+
(result: IActionPipelineResultProps) => actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_RESET, result),
112+
(result: IActionPipelineResultProps) => actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_RESET, result)))
112113
} else {
113114
dispatch(getPipelineStatusAction(rdiInstanceId))
114115
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import Download from './Download'
2+
3+
export default Download

redisinsight/ui/src/pages/rdi/instance/components/header/components/buttons/reset-pipeline-button/ResetPipelineButton.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@ import React from 'react'
22
import { EuiButton, EuiSpacer, EuiToolTip } from '@elastic/eui'
33
import cx from 'classnames'
44
import ResetIcon from 'uiSrc/assets/img/rdi/reset.svg?react'
5-
import styles from './styles.module.scss'
5+
import styles from '../styles.module.scss'
66

77
export interface PipelineButtonProps {
8-
onClick: () => void;
9-
disabled: boolean;
10-
loading: boolean;
8+
onClick: () => void
9+
disabled: boolean
10+
loading: boolean
1111
}
1212

1313
const ResetPipelineButton = ({ onClick, disabled, loading }: PipelineButtonProps) => (

redisinsight/ui/src/pages/rdi/instance/components/header/components/buttons/reset-pipeline-button/styles.module.scss

Lines changed: 0 additions & 30 deletions
This file was deleted.

redisinsight/ui/src/pages/rdi/instance/components/header/components/buttons/start-pipeline-button/StartPipelineButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import cx from 'classnames'
55
import StartIcon from 'uiSrc/assets/img/rdi/playFilled.svg?react'
66

77
import { PipelineButtonProps } from '../reset-pipeline-button/ResetPipelineButton'
8-
import styles from './styles.module.scss'
8+
import styles from '../styles.module.scss'
99

1010
const StartPipelineButton = ({ onClick, disabled, loading }: PipelineButtonProps) => (
1111
<EuiToolTip

redisinsight/ui/src/pages/rdi/instance/components/header/components/buttons/start-pipeline-button/styles.module.scss

Lines changed: 0 additions & 30 deletions
This file was deleted.

redisinsight/ui/src/pages/rdi/instance/components/header/components/buttons/stop-pipeline-button/StopPipelineButton.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import cx from 'classnames'
55
import StopIcon from 'uiSrc/assets/img/rdi/stopFilled.svg?react'
66

77
import { PipelineButtonProps } from '../reset-pipeline-button/ResetPipelineButton'
8-
import styles from './styles.module.scss'
8+
import styles from '../styles.module.scss'
99

1010
const StopPipelineButton = ({ onClick, disabled, loading }: PipelineButtonProps) => (
1111
<EuiToolTip
@@ -18,7 +18,7 @@ const StopPipelineButton = ({ onClick, disabled, loading }: PipelineButtonProps)
1818
size="s"
1919
isLoading={loading}
2020
isDisabled={disabled}
21-
className={cx(styles.stopPipelineBtn, { [styles.btnDisabled]: disabled })}
21+
className={cx(styles.pipelineBtn, { [styles.btnDisabled]: disabled })}
2222
iconType={StopIcon}
2323
data-testid="stop-pipeline-btn"
2424
onClick={onClick}
Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,6 @@
1-
.stopPipelineBtn {
1+
.pipelineBtn {
22
border: 1px solid var(--euiColorSecondary) !important;
33

4-
// :global(.euiButton__text) {
5-
// font-weight: 400 !important;
6-
// font-size: 14px !important;
7-
// line-height: 16.8px !important;
8-
// }
9-
104
svg {
115
color: var(--buttonSecondaryTextColor) !important;
126
}

redisinsight/ui/src/pages/rdi/instance/components/header/components/pipeline-actions/PipelineActions.spec.tsx

Lines changed: 0 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,6 @@ jest.mock('uiSrc/slices/rdi/pipeline', () => ({
2727

2828
jest.mock('formik')
2929

30-
// const mockHandleSubmit = jest.fn()
31-
3230
let store: typeof mockedStore
3331
beforeEach(() => {
3432
cleanup()
@@ -107,57 +105,4 @@ describe('PipelineActions', () => {
107105
})
108106
})
109107
})
110-
111-
// it('should call proper telemetry on Deploy', () => {
112-
// fireEvent.click(screen.getByTestId('deploy-rdi-pipeline'))
113-
// fireEvent.click(screen.getByTestId('deploy-confirm-btn'))
114-
// expect(sendEventTelemetry).toBeCalledWith({
115-
// event: TelemetryEvent.RDI_DEPLOY_CLICKED,
116-
// eventData:
117-
// {
118-
// id: 'rdiInstanceId',
119-
// reset: false,
120-
// jobsNumber: 2,
121-
// }
122-
// })
123-
// })
124-
125-
// it('should reset true if reset checkbox is in the checked state telemetry on Deploy', () => {
126-
// fireEvent.click(screen.getByTestId('deploy-rdi-pipeline'))
127-
128-
// const el = screen.getByTestId('reset-pipeline-checkbox') as HTMLInputElement
129-
// expect(el.checked).toBe(false)
130-
// fireEvent.click(el)
131-
// expect(el.checked).toBe(true)
132-
// fireEvent.click(screen.getByTestId('deploy-confirm-btn'))
133-
// expect(sendEventTelemetry).toBeCalledWith({
134-
// event: TelemetryEvent.RDI_DEPLOY_CLICKED,
135-
// eventData:
136-
// {
137-
// id: 'rdiInstanceId',
138-
// reset: false,
139-
// jobsNumber: 2,
140-
// }
141-
// })
142-
// })
143-
// })
144-
145-
// it('should open confirmation popover', () => {
146-
// render(<PipelineActions {...mockedProps} />)
147-
148-
// expect(screen.queryByTestId('deploy-confirm-btn')).not.toBeInTheDocument()
149-
150-
// fireEvent.click(screen.getByTestId('deploy-rdi-pipeline'))
151-
152-
// expect(screen.queryByTestId('deploy-confirm-btn')).toBeInTheDocument()
153-
// })
154-
155-
// it('should call onSubmit and close popover', () => {
156-
// render(<PipelineActions {...mockedProps} />)
157-
158-
// fireEvent.click(screen.getByTestId('deploy-rdi-pipeline'))
159-
// fireEvent.click(screen.getByTestId('deploy-confirm-btn'))
160-
161-
// expect(mockHandleSubmit).toBeCalled()
162-
// })
163108
})

redisinsight/ui/src/pages/rdi/instance/components/header/components/pipeline-actions/PipelineActions.tsx

Lines changed: 21 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,17 @@ import {
66
import { useDispatch, useSelector } from 'react-redux'
77
import { useParams } from 'react-router-dom'
88

9-
import { getPipelineStatusAction, rdiPipelineResetSelector, rdiPipelineSelector, rdiPipelineStartSelector, rdiPipelineStopSelector, resetPipelineAction, startPipelineAction, stopPipelineAction } from 'uiSrc/slices/rdi/pipeline'
9+
import {
10+
getPipelineStatusAction,
11+
rdiPipelineActionSelector,
12+
rdiPipelineSelector,
13+
resetPipelineAction,
14+
startPipelineAction,
15+
stopPipelineAction
16+
} from 'uiSrc/slices/rdi/pipeline'
1017
import { sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
1118

12-
import { CollectorStatus, IActionPipelineResultProps, PipelineStatus } from 'uiSrc/slices/interfaces'
19+
import { CollectorStatus, IActionPipelineResultProps, PipelineAction, PipelineStatus } from 'uiSrc/slices/interfaces'
1320
import DeployPipelineButton from '../buttons/deploy-pipeline-button'
1421
import ResetPipelineButton from '../buttons/reset-pipeline-button'
1522
import RdiConfigFileActionMenu from '../rdi-config-file-action-menu'
@@ -23,9 +30,7 @@ export interface Props {
2330

2431
const PipelineActions = ({ collectorStatus, pipelineStatus }: Props) => {
2532
const { loading: deployLoading } = useSelector(rdiPipelineSelector)
26-
const { loading: resetLoading } = useSelector(rdiPipelineResetSelector)
27-
const { loading: stopLoading } = useSelector(rdiPipelineStopSelector)
28-
const { loading: startLoading } = useSelector(rdiPipelineStartSelector)
33+
const { loading: actionLoading, action } = useSelector(rdiPipelineActionSelector)
2934

3035
const { rdiInstanceId } = useParams<{ rdiInstanceId: string }>()
3136

@@ -52,6 +57,8 @@ const PipelineActions = ({ collectorStatus, pipelineStatus }: Props) => {
5257
})
5358
dispatch(resetPipelineAction(
5459
rdiInstanceId,
60+
(result: IActionPipelineResultProps) =>
61+
actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_RESET, result),
5562
(result: IActionPipelineResultProps) =>
5663
actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_RESET, result)
5764
))
@@ -67,7 +74,9 @@ const PipelineActions = ({ collectorStatus, pipelineStatus }: Props) => {
6774
dispatch(startPipelineAction(
6875
rdiInstanceId,
6976
(result: IActionPipelineResultProps) =>
70-
actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_STARTED, result)
77+
actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_STARTED, result),
78+
(result: IActionPipelineResultProps) =>
79+
actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_STARTED, result),
7180
))
7281
}
7382

@@ -80,33 +89,35 @@ const PipelineActions = ({ collectorStatus, pipelineStatus }: Props) => {
8089
})
8190
dispatch(stopPipelineAction(
8291
rdiInstanceId,
92+
(result) => actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_STOPPED, result),
8393
(result) => actionPipelineCallback(TelemetryEvent.RDI_PIPELINE_STOPPED, result)
8494
))
8595
}
8696

87-
const disabled = deployLoading || startLoading || stopLoading || resetLoading
97+
const isLoadingBtn = (actionBtn: PipelineAction) => action === actionBtn && actionLoading
98+
const disabled = deployLoading || actionLoading
8899

89100
return (
90101
<EuiFlexGroup gutterSize="m" justifyContent="flexEnd" alignItems="center" responsive={false}>
91102
<EuiFlexItem grow={false}>
92103
<ResetPipelineButton
93104
onClick={onReset}
94105
disabled={disabled}
95-
loading={resetLoading}
106+
loading={isLoadingBtn(PipelineAction.Reset)}
96107
/>
97108
</EuiFlexItem>
98109
<EuiFlexItem grow={false}>
99110
{collectorStatus === CollectorStatus.Ready ? (
100111
<StopPipelineButton
101112
onClick={onStopPipeline}
102113
disabled={disabled}
103-
loading={stopLoading}
114+
loading={isLoadingBtn(PipelineAction.Stop)}
104115
/>
105116
) : (
106117
<StartPipelineButton
107118
onClick={onStartPipeline}
108119
disabled={disabled}
109-
loading={startLoading}
120+
loading={isLoadingBtn(PipelineAction.Start)}
110121
/>
111122
)}
112123
</EuiFlexItem>

0 commit comments

Comments
 (0)