Merge pull request #394 from RedisInsight/bugfix/RI-2492

#RI-2492 - fix clearing editor on reRun command

Author: rsergeenko

redisinsight/ui/src/components/query-card/QueryCardHeader/QueryCardHeader.tsx

@@ -32,19 +32,19 @@ import QueryCardTooltip from '../QueryCardTooltip'
 import styles from './styles.module.scss'
 
 export interface Props {
-  query: string;
-  isOpen: boolean;
-  isFullScreen: boolean;
-  createdAt?: Date;
-  summaryText?: string;
-  queryType: WBQueryType;
-  selectedValue: string;
-  loading?: boolean;
-  toggleOpen: () => void;
-  toggleFullScreen: () => void;
-  setSelectedValue: (type: WBQueryType, value: string) => void;
-  onQueryDelete: () => void;
-  onQueryReRun: () => void;
+  query: string
+  isOpen: boolean
+  isFullScreen: boolean
+  createdAt?: Date
+  summaryText?: string
+  queryType: WBQueryType
+  selectedValue: string
+  loading?: boolean
+  toggleOpen: () => void
+  toggleFullScreen: () => void
+  setSelectedValue: (type: WBQueryType, value: string) => void
+  onQueryDelete: () => void
+  onQueryReRun: () => void
 }
 
 const QueryCardHeader = (props: Props) => {

redisinsight/ui/src/pages/workbench/components/wb-results/WBResults/WBResults.tsx

@@ -3,18 +3,18 @@ import cx from 'classnames'
 import { EuiIcon, EuiText } from '@elastic/eui'
 
 import { Theme } from 'uiSrc/constants'
+import { Nullable } from 'uiSrc/utils'
 import QueryCard from 'uiSrc/components/query-card'
-import { WBQueryType } from 'uiSrc/pages/workbench/constants'
 import { CommandExecutionUI } from 'uiSrc/slices/interfaces'
 import { ThemeContext } from 'uiSrc/contexts/themeContext'
 import MultiPlayIconDark from 'uiSrc/assets/img/multi_play_icon_dark.svg'
 import MultiPlayIconLight from 'uiSrc/assets/img/multi_play_icon_light.svg'
 import styles from './styles.module.scss'
 
 export interface Props {
-  items: CommandExecutionUI[];
-  scrollDivRef: React.Ref<HTMLDivElement>;
-  onQueryReRun: (query: string, commandId?: string, type?: WBQueryType) => void;
+  items: CommandExecutionUI[]
+  scrollDivRef: React.Ref<HTMLDivElement>
+  onQueryReRun: (query: string, commandId?: Nullable<string>, clearEditor?: boolean) => void
   onQueryDelete: (commandId: string) => void
   onQueryOpen: (commandId: string) => void
 }
@@ -48,7 +48,7 @@ const WBResults = ({ items = [], onQueryReRun, onQueryDelete, onQueryOpen, scrol
           command={command}
           createdAt={createdAt}
           onQueryOpen={() => onQueryOpen(id)}
-          onQueryReRun={() => onQueryReRun(command)}
+          onQueryReRun={() => onQueryReRun(command, null, false)}
           onQueryDelete={() => onQueryDelete(id)}
         />
       ))}

redisinsight/ui/src/pages/workbench/components/wb-results/WBResultsWrapper.tsx

@@ -1,12 +1,12 @@
 import React from 'react'
+import { Nullable } from 'uiSrc/utils'
 import { CommandExecutionUI } from 'uiSrc/slices/interfaces'
 import WBResults from './WBResults'
-import { WBQueryType } from '../../constants'
 
 export interface Props {
-  items: CommandExecutionUI[];
-  scrollDivRef: React.Ref<HTMLDivElement>;
-  onQueryReRun: (query: string, commandId?: string, type?: WBQueryType) => void;
+  items: CommandExecutionUI[]
+  scrollDivRef: React.Ref<HTMLDivElement>
+  onQueryReRun: (query: string, commandId?: Nullable<string>, clearEditor?: boolean) => void
   onQueryOpen: (commandId: string) => void
   onQueryDelete: (commandId: string) => void
 }

redisinsight/ui/src/pages/workbench/components/wb-view/WBView/WBView.tsx

@@ -9,7 +9,6 @@ import { BrowserStorageItem } from 'uiSrc/constants'
 import { localStorageService } from 'uiSrc/services'
 import InstanceHeader from 'uiSrc/components/instance-header'
 import QueryWrapper from 'uiSrc/components/query'
-import { WBQueryType } from 'uiSrc/pages/workbench/constants'
 import {
   setWorkbenchVerticalPanelSizes,
   appContextWorkbench
@@ -27,15 +26,15 @@ const verticalPanelIds = {
 }
 
 export interface Props {
-  script: string;
-  loading: boolean;
-  items: CommandExecutionUI[];
-  setScript: (script: string) => void;
-  setScriptEl: Function;
-  scriptEl: Nullable<monacoEditor.editor.IStandaloneCodeEditor>;
-  scrollDivRef: Ref<HTMLDivElement>;
-  onSubmit: (query?: string, commandId?: string, type?: WBQueryType) => void;
-  onQueryOpen: (commandId?: string) => void;
+  script: string
+  loading: boolean
+  items: CommandExecutionUI[]
+  setScript: (script: string) => void
+  setScriptEl: Function
+  scriptEl: Nullable<monacoEditor.editor.IStandaloneCodeEditor>
+  scrollDivRef: Ref<HTMLDivElement>
+  onSubmit: (query?: string, commandId?: Nullable<string>, clearEditor?: boolean) => void
+  onQueryOpen: (commandId?: string) => void
   onQueryDelete: (commandId: string) => void
 }
 

redisinsight/ui/src/pages/workbench/components/wb-view/WBViewWrapper.tsx

@@ -101,7 +101,8 @@ const WBViewWrapper = () => {
 
   const handleSubmit = (
     commandInit: string = script,
-    commandId?: string,
+    commandId?: Nullable<string>,
+    clearEditor: boolean = true,
   ) => {
     const { loading } = state
     const isNewCommand = () => !commandId
@@ -121,19 +122,20 @@ const WBViewWrapper = () => {
 
     isNewCommand() && scrollResults('start')
 
-    sendCommand(commandLine, multiCommands)
+    sendCommand(commandLine, multiCommands, clearEditor)
   }
 
   const sendCommand = (
     command: string,
-    multiCommands = ''
+    multiCommands = '',
+    clearEditor = true
   ) => {
     const { connectionType, host, port } = state.instance
     if (connectionType !== ConnectionType.Cluster) {
       dispatch(sendWBCommandAction({
         command,
         multiCommands,
-        onSuccessAction: onSuccess,
+        onSuccessAction: (multiCommands) => onSuccess(multiCommands, clearEditor),
       }))
       return
     }
@@ -152,13 +154,13 @@ const WBViewWrapper = () => {
         command,
         options,
         multiCommands,
-        onSuccessAction: onSuccess,
+        onSuccessAction: (multiCommands) => onSuccess(multiCommands, clearEditor),
       })
     )
   }
 
-  const onSuccess = (multiCommands = '') => {
-    resetCommand()
+  const onSuccess = (multiCommands = '', clearEditor = true) => {
+    clearEditor && resetCommand()
     setMultiCommands(multiCommands)
   }