diff --git a/redisinsight/ui/src/components/monitor-config/MonitorConfig.tsx b/redisinsight/ui/src/components/monitor-config/MonitorConfig.tsx index c62a49970b..a28f6be69c 100644 --- a/redisinsight/ui/src/components/monitor-config/MonitorConfig.tsx +++ b/redisinsight/ui/src/components/monitor-config/MonitorConfig.tsx @@ -11,7 +11,7 @@ import { stopMonitor, } from 'uiSrc/slices/cli/monitor' import { getBaseApiUrl } from 'uiSrc/utils' -import { MonitorEvent, SocketEvent } from 'uiSrc/constants' +import { MonitorEvent, SocketErrors, SocketEvent } from 'uiSrc/constants' import { IMonitorDataPayload } from 'uiSrc/slices/interfaces' import { connectedInstanceSelector } from 'uiSrc/slices/instances' import { IOnDatePayload } from 'apiSrc/modules/monitor/helpers/client-monitor-observer' @@ -32,6 +32,13 @@ const MonitorConfig = ({ retryDelay = 10000 } : IProps) => { maxWait: 150, }) + const getErrorMessage = (error: { type: string; name: any; message: any }): string => { + if (error?.type === SocketErrors.TransportError) { + return 'Error: Connection was lost' + } + return error?.name || error?.message + } + useEffect(() => { if (!isRunning || !instanceId || socket?.connected) { return @@ -87,8 +94,8 @@ const MonitorConfig = ({ retryDelay = 10000 } : IProps) => { }) // Catch connect error - newSocket.on(SocketEvent.ConnectionError, (error: Error) => { - payloads.push({ isError: true, time: `${Date.now()}`, message: `${error?.name}: ${error?.message}` }) + newSocket.on(SocketEvent.ConnectionError, (error) => { + payloads.push({ isError: true, time: `${Date.now()}`, message: getErrorMessage(error) }) setNewItems(payloads, () => { payloads.length = 0 }) dispatch(toggleRunMonitor()) }) diff --git a/redisinsight/ui/src/constants/index.ts b/redisinsight/ui/src/constants/index.ts index 7ef699492c..3cd6b3eb0b 100644 --- a/redisinsight/ui/src/constants/index.ts +++ b/redisinsight/ui/src/constants/index.ts @@ -17,4 +17,5 @@ export * from './monitorEvents' export * from './socketEvents' export * from './mocks/mock-redis-commands' export * from './mocks/mock-enablement-area' +export * from './socketErrors' export { ApiEndpoints, BrowserStorageItem, ApiStatusCode, apiErrors } diff --git a/redisinsight/ui/src/constants/socketErrors.ts b/redisinsight/ui/src/constants/socketErrors.ts new file mode 100644 index 0000000000..ab9498f607 --- /dev/null +++ b/redisinsight/ui/src/constants/socketErrors.ts @@ -0,0 +1,3 @@ +export enum SocketErrors { + TransportError = 'TransportError', +}