bug fix #RI-3744 #RI-3749 #RI-3743 #RI-3741

redisinsight/ui/src/components/query/QueryWrapper.tsx

@@ -1,3 +1,4 @@
+import { without } from 'lodash'
 import React from 'react'
 import { useSelector } from 'react-redux'
 import { EuiLoadingContent } from '@elastic/eui'
@@ -63,7 +64,11 @@ const QueryWrapper = (props: Props) => {
 
   const sendEventSubmitTelemetry = (commandInit = query) => {
     const eventData = (() => {
-      const commands = splitMonacoValuePerLines(commandInit)
+      const commands = without(
+        splitMonacoValuePerLines(commandInit)
+          .map((command) => removeMonacoComments(decode(command).trim())),
+        ''
+      )
 
       const [commandLine, ...rest] = commands.map((command = '') => {
         const matchedCommand = REDIS_COMMANDS_ARRAY.find((commandName) =>
@@ -72,8 +77,7 @@ const QueryWrapper = (props: Props) => {
       })
 
       const multiCommands = getMultiCommands(rest).replaceAll('\n', ';')
-
-      const command = removeMonacoComments(decode([commandLine, multiCommands].join(';')).trim())
+      const command = [commandLine, multiCommands].join('') ? [commandLine, multiCommands].join(';') : null
 
       return {
         command,
@@ -85,10 +89,12 @@ const QueryWrapper = (props: Props) => {
       }
     })()
 
-    sendEventTelemetry({
-      event: TelemetryEvent.WORKBENCH_COMMAND_SUBMITTED,
-      eventData
-    })
+    if (eventData.command) {
+      sendEventTelemetry({
+        event: TelemetryEvent.WORKBENCH_COMMAND_SUBMITTED,
+        eventData
+      })
+    }
   }
 
   const handleSubmit = (value?: string) => {

redisinsight/ui/src/constants/keys.ts

@@ -26,7 +26,7 @@ export const GROUP_TYPES_DISPLAY = Object.freeze({
   [KeyTypes.ReJSON]: 'JSON',
   [KeyTypes.JSON]: 'JSON',
   [KeyTypes.Stream]: 'Stream',
-  [ModulesKeyTypes.Graph]: 'GRAPH',
+  [ModulesKeyTypes.Graph]: 'Graph',
   [ModulesKeyTypes.TimeSeries]: 'TS',
   [CommandGroup.Bitmap]: 'Bitmap',
   [CommandGroup.Cluster]: 'Cluster',

redisinsight/ui/src/pages/browser/BrowserPage.tsx

@@ -325,7 +325,7 @@ const BrowserPage = () => {
                       keyProp={selectedKey}
                       onCloseKey={closePanel}
                       onEditKey={onEditKey}
-                      onDeleteKey={onSelectKey}
+                      onRemoveKey={onSelectKey}
                     />
                   )}
                   {isBulkActionsPanelOpen && !isAddKeyPanelOpen && (

redisinsight/ui/src/pages/browser/components/filter-key-type/constants.ts

@@ -36,12 +36,12 @@ export const FILTER_KEY_TYPE_OPTIONS = [
     color: GROUP_TYPES_COLORS[KeyTypes.ReJSON],
   },
   {
-    text: 'STREAM',
+    text: 'Stream',
     value: KeyTypes.Stream,
     color: GROUP_TYPES_COLORS[KeyTypes.Stream],
   },
   {
-    text: 'GRAPH',
+    text: 'Graph',
     value: ModulesKeyTypes.Graph,
     color: GROUP_TYPES_COLORS[ModulesKeyTypes.Graph],
   },

redisinsight/ui/src/pages/browser/components/hash-details/HashDetails.tsx

@@ -74,10 +74,11 @@ interface IHashField extends HashFieldDto {}
 
 export interface Props {
   isFooterOpen: boolean
+  onRemoveKey: () => void
 }
 
 const HashDetails = (props: Props) => {
-  const { isFooterOpen } = props
+  const { isFooterOpen, onRemoveKey } = props
 
   const {
     total,
@@ -135,7 +136,8 @@ const HashDetails = (props: Props) => {
     setDeleting(`${field + suffix}`)
   }, [])
 
-  const onSuccessRemoved = () => {
+  const onSuccessRemoved = (newTotalValue: number) => {
+    newTotalValue === 0 && onRemoveKey()
     sendEventTelemetry({
       event: getBasedOnViewTypeEvent(
         viewType,

redisinsight/ui/src/pages/browser/components/key-details-header/KeyDetailsHeader.tsx

@@ -36,7 +36,7 @@ import { RedisResponseBuffer } from 'uiSrc/slices/interfaces'
 import { getBasedOnViewTypeEvent, getRefreshEventData, sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
 import {
   formatBytes,
-  formatNameShort,
+  formatLongName,
   isEqualBuffers,
   isFormatEditable,
   MAX_TTL_NUMBER,
@@ -117,7 +117,7 @@ const KeyDetailsHeader = ({
 
   const keyNameRef = useRef<HTMLInputElement>(null)
 
-  const tooltipContent = formatNameShort(keyProp || '')
+  const tooltipContent = formatLongName(keyProp || '')
 
   const onMouseEnterKey = () => {
     setKeyIsHovering(true)

redisinsight/ui/src/pages/browser/components/key-details/KeyDetails/KeyDetails.tsx

@@ -5,7 +5,7 @@ import {
   EuiButtonIcon,
   EuiToolTip
 } from '@elastic/eui'
-import { isNull } from 'lodash'
+import { curryRight, isNull } from 'lodash'
 import { useDispatch, useSelector } from 'react-redux'
 import cx from 'classnames'
 import {
@@ -49,14 +49,15 @@ export interface Props {
   onToggleFullScreen: () => void
   onClose: (key: RedisResponseBuffer) => void
   onClosePanel: () => void
-  onRefresh: (key: RedisResponseBuffer, type: KeyTypes) => void
+  onRefresh: (key: RedisResponseBuffer, type: KeyTypes | ModulesKeyTypes) => void
   onDelete: (key: RedisResponseBuffer, type: string) => void
+  onRemoveKey: () => void
   onEditTTL: (key: RedisResponseBuffer, ttl: number) => void
   onEditKey: (key: RedisResponseBuffer, newKey: RedisResponseBuffer, onFailure?: () => void) => void
 }
 
 const KeyDetails = ({ ...props }: Props) => {
-  const { onClosePanel } = props
+  const { onClosePanel, onRemoveKey } = props
   const { loading, error = '', data } = useSelector(selectedKeySelector)
   const { type: selectedKeyType, name: selectedKey } = useSelector(selectedKeyDataSelector) ?? {
     type: KeyTypes.String,
@@ -130,7 +131,7 @@ const KeyDetails = ({ ...props }: Props) => {
         setIsEdit={(isEdit) => setEditItem(isEdit)}
       />
     ),
-    [KeyTypes.Hash]: <HashDetails isFooterOpen={isAddItemPanelOpen} />,
+    [KeyTypes.Hash]: <HashDetails isFooterOpen={isAddItemPanelOpen} onRemoveKey={onRemoveKey} />,
     [KeyTypes.List]: <ListDetails isFooterOpen={isAddItemPanelOpen || isRemoveItemPanelOpen} />,
     [KeyTypes.ReJSON]: <RejsonDetailsWrapper />,
     [KeyTypes.Stream]: <StreamDetailsWrapper isFooterOpen={isAddItemPanelOpen} />,

redisinsight/ui/src/pages/browser/components/key-details/KeyDetailsWrapper.tsx

@@ -31,7 +31,7 @@ export interface Props {
   onToggleFullScreen: () => void
   onCloseKey: () => void
   onEditKey: (key: RedisResponseBuffer, newKey: RedisResponseBuffer) => void
-  onDeleteKey: () => void
+  onRemoveKey: () => void
   keyProp: RedisResponseBuffer | null
 }
 
@@ -42,7 +42,7 @@ const KeyDetailsWrapper = (props: Props) => {
     onToggleFullScreen,
     onCloseKey,
     onEditKey,
-    onDeleteKey,
+    onRemoveKey,
     keyProp
   } = props
 
@@ -84,11 +84,11 @@ const KeyDetailsWrapper = (props: Props) => {
     if (type === KeyTypes.String) {
       dispatch(deleteKeyAction(key, () => {
         dispatch(resetStringValue())
-        onDeleteKey()
+        onRemoveKey()
       }))
       return
     }
-    dispatch(deleteKeyAction(key, onDeleteKey))
+    dispatch(deleteKeyAction(key, onRemoveKey))
   }
 
   const handleRefreshKey = (key: RedisResponseBuffer, type: KeyTypes | ModulesKeyTypes) => {
@@ -153,6 +153,7 @@ const KeyDetailsWrapper = (props: Props) => {
       onClosePanel={handleClosePanel}
       onRefresh={handleRefreshKey}
       onDelete={handleDeleteKey}
+      onRemoveKey={onRemoveKey}
       onEditTTL={handleEditTTL}
       onEditKey={handleEditKey}
     />

redisinsight/ui/src/pages/browser/styles.module.scss

@@ -36,7 +36,7 @@ $breakpoint-to-hide-resize-panel: 1124px;
 .resizePanelLeft {
   min-width: 550px;
   :global(.euiResizablePanel__content) {
-    @media (min-width: 1124px) {
+    @media (min-width: $breakpoint-to-hide-resize-panel) {
       padding-right: 8px;
     }
   }

redisinsight/ui/src/slices/browser/hash.ts

@@ -9,7 +9,6 @@ import successMessages from 'uiSrc/components/notifications/success-messages'
 import {
   GetHashFieldsResponse,
   AddFieldsToHashDto,
-  HashFieldDto,
 } from 'apiSrc/modules/browser/dto/hash.dto'
 import {
   deleteKeyFromList,
@@ -312,7 +311,7 @@ export function fetchMoreHashFields(
 export function deleteHashFields(
   key: RedisResponseBuffer,
   fields: RedisResponseBuffer[],
-  onSuccessAction?: () => void,
+  onSuccessAction?: (newTotal?: number) => void,
 ) {
   return async (dispatch: AppDispatch, stateInit: () => RootState) => {
     dispatch(removeHashFields())
@@ -334,7 +333,7 @@ export function deleteHashFields(
       )
       const newTotalValue = state.browser.hash.data.total - data.affected
       if (isStatusSuccessful(status)) {
-        onSuccessAction?.()
+        onSuccessAction?.(newTotalValue)
         dispatch(removeHashFieldsSuccess())
         dispatch(removeFieldsFromList(fields))
         if (newTotalValue > 0) {