Skip to content

Commit d9b2072

Browse files
rsergeenkorsergeenko
authored
Merge pull request #555 from RedisInsight/bugfix/RI-2735
#RI-2735 - fix deletion file after lost db connection, handle disconnect, fix paddings, add uuid for file id
2 parents e61f5e3 + 5ecd041 commit d9b2072

File tree

11 files changed

+80
-37
lines changed

11 files changed

+80
-37
lines changed

‎package.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,7 @@
154154
"@types/redux-mock-store": "^1.0.2",
155155
"@types/segment-analytics": "^0.0.34",
156156
"@types/supertest": "^2.0.8",
157+
"@types/uuid": "^8.3.4",
157158
"@types/webpack-env": "^1.15.2",
158159
"@typescript-eslint/eslint-plugin": "^4.8.1",
159160
"@typescript-eslint/parser": "^4.8.1",
@@ -265,7 +266,8 @@
265266
"socket.io-client": "^4.4.0",
266267
"unified": "^10.1.1",
267268
"unist-util-visit": "^4.1.0",
268-
"url-parse": "^1.5.10"
269+
"url-parse": "^1.5.10",
270+
"uuid": "^8.3.2"
269271
},
270272
"devEngines": {
271273
"node": ">=14.x <16",

‎redisinsight/ui/src/components/monitor-config/MonitorConfig.spec.tsx‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,14 @@ import { cloneDeep } from 'lodash'
33
import React from 'react'
44
import MockedSocket from 'socket.io-mock'
55
import socketIO from 'socket.io-client'
6-
import { monitorSelector, setMonitorLoadingPause, setSocket, stopMonitor } from 'uiSrc/slices/cli/monitor'
6+
import {
7+
monitorSelector,
8+
setMonitorLoadingPause,
9+
pauseMonitor,
10+
setSocket,
11+
stopMonitor,
12+
lockResume
13+
} from 'uiSrc/slices/cli/monitor'
714
import { cleanup, mockedStore, render } from 'uiSrc/utils/test-utils'
815
import { MonitorEvent, SocketEvent } from 'uiSrc/constants'
916
import MonitorConfig from './MonitorConfig'
@@ -100,7 +107,7 @@ describe('MonitorConfig', () => {
100107
const afterRenderActions = [
101108
setSocket(socket),
102109
setMonitorLoadingPause(true),
103-
stopMonitor()
110+
pauseMonitor()
104111
]
105112
expect(store.getActions()).toEqual([...afterRenderActions])
106113

@@ -123,8 +130,7 @@ describe('MonitorConfig', () => {
123130

124131
const afterRenderActions = [
125132
setSocket(socket),
126-
setMonitorLoadingPause(true),
127-
stopMonitor()
133+
setMonitorLoadingPause(true)
128134
]
129135
expect(store.getActions()).toEqual([...afterRenderActions])
130136

@@ -144,7 +150,9 @@ describe('MonitorConfig', () => {
144150
const afterRenderActions = [
145151
setSocket(socket),
146152
setMonitorLoadingPause(true),
147-
stopMonitor()
153+
pauseMonitor(),
154+
stopMonitor(),
155+
lockResume()
148156
]
149157
expect(store.getActions()).toEqual([...afterRenderActions])
150158

‎redisinsight/ui/src/components/monitor-config/MonitorConfig.tsx‎

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { useEffect } from 'react'
22
import { useDispatch, useSelector } from 'react-redux'
33
import { debounce } from 'lodash'
44
import { io } from 'socket.io-client'
5+
import { v4 as uuidv4 } from 'uuid'
56

67
import {
78
setSocket,
@@ -11,7 +12,9 @@ import {
1112
setError,
1213
resetMonitorItems,
1314
setStartTimestamp,
14-
setMonitorLoadingPause
15+
setMonitorLoadingPause,
16+
setLogFileId,
17+
pauseMonitor, lockResume
1518
} from 'uiSrc/slices/cli/monitor'
1619
import { getBaseApiUrl } from 'uiSrc/utils'
1720
import { MonitorErrorMessages, MonitorEvent, SocketErrors, SocketEvent } from 'uiSrc/constants'
@@ -24,7 +27,7 @@ import ApiStatusCode from '../../constants/apiStatusCode'
2427
interface IProps {
2528
retryDelay?: number;
2629
}
27-
const MonitorConfig = ({ retryDelay = 10000 } : IProps) => {
30+
const MonitorConfig = ({ retryDelay = 15000 } : IProps) => {
2831
const { id: instanceId = '' } = useSelector(connectedInstanceSelector)
2932
const { socket, isRunning, isPaused, isSaveToFile, isMinimizedMonitor, isShowMonitor } = useSelector(monitorSelector)
3033

@@ -48,6 +51,8 @@ const MonitorConfig = ({ retryDelay = 10000 } : IProps) => {
4851
if (!isRunning || !instanceId || socket?.connected) {
4952
return
5053
}
54+
const logFileId = `_redis_${uuidv4()}`
55+
const timestamp = Date.now()
5156
let retryTimer: NodeJS.Timer
5257

5358
// Create SocketIO connection to instance by instanceId
@@ -75,17 +80,20 @@ const MonitorConfig = ({ retryDelay = 10000 } : IProps) => {
7580

7681
const handleDisconnect = () => {
7782
newSocket.removeAllListeners()
83+
dispatch(pauseMonitor())
7884
dispatch(stopMonitor())
85+
dispatch(lockResume())
7986
}
8087

8188
newSocket.on(SocketEvent.Connect, () => {
8289
// Trigger Monitor event
8390
clearTimeout(retryTimer)
84-
const timestampStart = Date.now()
85-
dispatch(setStartTimestamp(timestampStart))
91+
92+
dispatch(setLogFileId(logFileId))
93+
dispatch(setStartTimestamp(timestamp))
8694
newSocket.emit(
8795
MonitorEvent.Monitor,
88-
{ logFileId: isSaveToFile ? timestampStart.toString() : null },
96+
{ logFileId: isSaveToFile ? logFileId : null },
8997
handleMonitorEvents
9098
)
9199
})
@@ -101,7 +109,7 @@ const MonitorConfig = ({ retryDelay = 10000 } : IProps) => {
101109

102110
payloads.push({ isError: true, time: `${Date.now()}`, ...payload })
103111
setNewItems(payloads, () => { payloads.length = 0 })
104-
dispatch(stopMonitor())
112+
dispatch(pauseMonitor())
105113
})
106114

107115
// Catch disconnect
@@ -117,7 +125,6 @@ const MonitorConfig = ({ retryDelay = 10000 } : IProps) => {
117125
newSocket.on(SocketEvent.ConnectionError, (error) => {
118126
payloads.push({ isError: true, time: `${Date.now()}`, message: getErrorMessage(error) })
119127
setNewItems(payloads, () => { payloads.length = 0 })
120-
dispatch(stopMonitor())
121128
})
122129
}, [instanceId, isRunning, isSaveToFile])
123130

‎redisinsight/ui/src/components/monitor/Monitor/Monitor.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -151,7 +151,7 @@ const Monitor = (props: Props) => {
151151
)}
152152
</div>
153153
)}
154-
{isStarted && isPaused && !isSaveToFile && (
154+
{isRunning && isPaused && !isSaveToFile && (
155155
<div data-testid="monitor-stopped" className={styles.monitorStoppedText}>
156156
Profiler is paused.
157157
</div>

‎redisinsight/ui/src/components/monitor/MonitorHeader/MonitorHeader.tsx‎

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,17 @@ export interface Props {
2929

3030
const MonitorHeader = ({ handleRunMonitor }: Props) => {
3131
const { instanceId = '' } = useParams<{ instanceId: string }>()
32-
const { isRunning, isPaused, isStarted, items = [], error, loadingPause } = useSelector(monitorSelector)
32+
const {
33+
isRunning,
34+
isPaused,
35+
isResumeLocked,
36+
isStarted,
37+
items = [],
38+
error,
39+
loadingPause
40+
} = useSelector(monitorSelector)
3341
const isErrorShown = !!error && !isRunning
42+
const disabledPause = isErrorShown || isResumeLocked || loadingPause
3443
const dispatch = useDispatch()
3544

3645
const handleCloseMonitor = () => {
@@ -81,19 +90,19 @@ const MonitorHeader = ({ handleRunMonitor }: Props) => {
8190
{isStarted && (
8291
<EuiFlexItem grow={false} className={styles.actions}>
8392
<EuiToolTip
84-
content={isErrorShown ? '' : (!isPaused ? 'Pause' : 'Resume')}
93+
content={(isErrorShown || isResumeLocked) ? '' : (!isPaused ? 'Pause' : 'Resume')}
8594
anchorClassName="inline-flex"
8695
>
8796
<EuiButtonIcon
88-
iconType={isErrorShown ? BanIcon : (!isPaused ? 'pause' : 'play')}
97+
iconType={(isErrorShown || isResumeLocked) ? BanIcon : (!isPaused ? 'pause' : 'play')}
8998
onClick={() => handleRunMonitor()}
9099
aria-label="start/stop monitor"
91100
data-testid="toggle-run-monitor"
92-
disabled={isErrorShown || loadingPause}
101+
disabled={disabledPause}
93102
/>
94103
</EuiToolTip>
95104
<EuiToolTip
96-
content={!isStarted || !items.length ? '' : 'Clear Profiler window'}
105+
content={!isStarted || !items.length ? '' : 'Clear Profiler Window'}
97106
anchorClassName={cx('inline-flex', { transparent: !isStarted || !items.length })}
98107
>
99108
<EuiButtonIcon

‎redisinsight/ui/src/components/monitor/MonitorLog/MonitorLog.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,12 @@ import { cutDurationText, getBaseApiUrl } from 'uiSrc/utils'
1010

1111
import styles from './styles.module.scss'
1212

13-
const MIDDLE_SCREEN_RESOLUTION = 460
14-
const SMALL_SCREEN_RESOLUTION = 360
13+
const PADDINGS_OUTSIDE = 12
14+
const MIDDLE_SCREEN_RESOLUTION = 460 - PADDINGS_OUTSIDE
15+
const SMALL_SCREEN_RESOLUTION = 360 - PADDINGS_OUTSIDE
1516

1617
const MonitorLog = () => {
17-
const { timestamp } = useSelector(monitorSelector)
18+
const { timestamp, logFileId } = useSelector(monitorSelector)
1819
const dispatch = useDispatch()
1920

2021
const duration = cutDurationText(
@@ -26,7 +27,7 @@ const MonitorLog = () => {
2627
)
2728
)
2829
const baseApiUrl = getBaseApiUrl()
29-
const linkToDownload = `${baseApiUrl}/api/${ApiEndpoints.PROFILER_LOGS}/${timestamp.start}`
30+
const linkToDownload = `${baseApiUrl}/api/${ApiEndpoints.PROFILER_LOGS}/${logFileId}`
3031
const isElectron = process.env.APP_ENV === AppEnv.ELECTRON
3132

3233
const downloadBtnProps: any = {}

‎redisinsight/ui/src/components/monitor/MonitorWrapper.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ const MonitorWrapper = () => {
2525
dispatch(togglePauseMonitor())
2626
}
2727

28-
const onRunMonitor = (isSaveToLog?: boolean) => {
28+
const onRunMonitor = (isSaveToLog: boolean = false) => {
2929
sendEventTelemetry({
3030
event: TelemetryEvent.PROFILER_STARTED,
3131
eventData: {

‎redisinsight/ui/src/slices/cli/monitor.ts‎

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,13 @@ export const initialState: StateMonitor = {
1111
isRunning: false,
1212
isStarted: false,
1313
isPaused: false,
14+
isResumeLocked: false,
1415
isSaveToFile: false,
1516
isMinimizedMonitor: false,
1617
socket: null,
1718
error: '',
1819
items: [],
19-
logFile: null,
20+
logFileId: null,
2021
timestamp: {
2122
start: 0,
2223
paused: 0,
@@ -65,6 +66,10 @@ const monitorSlice = createSlice({
6566
state.isSaveToFile = payload
6667
},
6768

69+
setLogFileId: (state, { payload }) => {
70+
state.logFileId = payload
71+
},
72+
6873
setStartTimestamp: (state, { payload }) => {
6974
state.timestamp.start = payload
7075
state.timestamp.unPaused = state.timestamp.start
@@ -81,16 +86,18 @@ const monitorSlice = createSlice({
8186
}
8287
},
8388

89+
pauseMonitor: (state) => {
90+
state.isPaused = true
91+
state.timestamp.paused = Date.now()
92+
state.timestamp.duration += state.timestamp.paused - state.timestamp.unPaused
93+
},
94+
8495
setMonitorLoadingPause: (state, { payload }) => {
8596
state.loadingPause = payload
8697
},
8798

8899
stopMonitor: (state) => {
89100
state.isRunning = false
90-
state.error = ''
91-
state.timestamp.paused = Date.now()
92-
state.timestamp.duration += state.timestamp.paused - state.timestamp.unPaused
93-
state.isPaused = false
94101
},
95102

96103
resetProfiler: (state) => {
@@ -126,6 +133,11 @@ const monitorSlice = createSlice({
126133
setError: (state, { payload }) => {
127134
state.error = payload
128135
},
136+
137+
lockResume: (state) => {
138+
state.isResumeLocked = true
139+
state.isPaused = true
140+
}
129141
},
130142
})
131143

@@ -137,8 +149,11 @@ export const {
137149
toggleHideMonitor,
138150
setSocket,
139151
togglePauseMonitor,
152+
pauseMonitor,
153+
lockResume,
140154
startMonitor,
141155
setStartTimestamp,
156+
setLogFileId,
142157
setMonitorLoadingPause,
143158
stopMonitor,
144159
resetProfiler,

‎redisinsight/ui/src/slices/interfaces/monitor.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,12 @@ export interface StateMonitor {
1515
isRunning: boolean
1616
isStarted: boolean
1717
isPaused: boolean
18+
isResumeLocked: boolean
1819
isSaveToFile: boolean
1920
socket: Nullable<Socket>
2021
items: IMonitorDataPayload[]
2122
error: string
22-
logFile: any
23+
logFileId: Nullable<string>
2324
timestamp: {
2425
start: number
2526
paused: number

‎redisinsight/ui/src/slices/tests/cli/monitor.spec.ts‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -193,12 +193,7 @@ describe('monitor slice', () => {
193193
// Arrange
194194
const state: typeof initialState = {
195195
...initialState,
196-
isRunning: false,
197-
timestamp: {
198-
...initialState.timestamp,
199-
paused: Date.now(),
200-
duration: Date.now() - initialState.timestamp.unPaused
201-
}
196+
isRunning: false
202197
}
203198

204199
// Act

0 commit comments

Comments
 (0)