#RI-1697 - When user switches between table and text view, request /send-command is sent

Author: egor-zalenski

redisinsight/api/src/modules/cli/dto/cli.dto.ts

@@ -51,7 +51,7 @@ export class SendCommandDto {
 
   @ApiPropertyOptional({
     description: 'Define output format',
-    default: CliOutputFormatterTypes.Text,
+    default: CliOutputFormatterTypes.Raw,
     enum: CliOutputFormatterTypes,
   })
   @IsOptional()

redisinsight/api/src/modules/cli/services/cli-business/cli-business.service.spec.ts

@@ -55,7 +55,7 @@ const mockENotFoundMessage = 'ENOTFOUND some message';
 const mockMemoryUsageCommand = 'memory usage key';
 const mockGetEscapedKeyCommand = 'get "\\\\key';
 const mockServerInfoCommand = 'info server';
-const mockIntegerResponse = '(integer) 5';
+const mockIntegerResponse = 5;
 
 describe('CliBusinessService', () => {
   let service: CliBusinessService;
@@ -199,7 +199,7 @@ describe('CliBusinessService', () => {
   describe('sendCommand', () => {
     it('should successfully execute command and return text response', async () => {
       const dto: SendCommandDto = { command: mockMemoryUsageCommand };
-      const formatSpy = jest.spyOn(textFormatter, 'format');
+      const formatSpy = jest.spyOn(rawFormatter, 'format');
       const mockResult: SendCommandResponse = {
         response: mockIntegerResponse,
         status: CommandExecutionStatus.Success,
@@ -551,7 +551,38 @@ describe('CliBusinessService', () => {
       );
     });
 
-    it('should successfully execute command for single node with redirection', async () => {
+    it('should successfully execute command for single node with redirection (RAW format)', async () => {
+      const command = 'set foo bar';
+      const mockResult: SendClusterCommandResponse = {
+        response: 'OK',
+        node: { ...mockNode, port: 7002 },
+        status: CommandExecutionStatus.Success,
+      };
+      cliTool.execCommandForNode
+        .mockResolvedValueOnce({
+          response: mockRedisMovedError.message,
+          error: mockRedisMovedError,
+          status: CommandExecutionStatus.Fail,
+        })
+        .mockResolvedValueOnce({
+          response: 'OK',
+          host: '127.0.0.1',
+          port: 7002,
+          status: CommandExecutionStatus.Success,
+        });
+
+      const result = await service.sendCommandForSingleNode(
+        mockClientOptions,
+        command,
+        ClusterNodeRole.All,
+        nodeOptions,
+        CliOutputFormatterTypes.Raw,
+      );
+
+      expect(cliTool.execCommandForNode).toHaveBeenCalledTimes(2);
+      expect(result).toEqual(mockResult);
+    });
+    it('should successfully execute command for single node with redirection (Text format)', async () => {
       const command = 'set foo bar';
       const mockResult: SendClusterCommandResponse = {
         response: '-> Redirected to slot [7008] located at 127.0.0.1:7002\nOK',
@@ -576,6 +607,7 @@ describe('CliBusinessService', () => {
         command,
         ClusterNodeRole.All,
         nodeOptions,
+        CliOutputFormatterTypes.Text,
       );
 
       expect(cliTool.execCommandForNode).toHaveBeenCalledTimes(2);

redisinsight/api/src/modules/cli/services/cli-business/cli-business.service.ts

@@ -142,7 +142,7 @@ export class CliBusinessService {
     this.logger.log('Executing redis CLI command.');
     const { command: commandLine } = dto;
     let namespace = AppTool.CLI.toString();
-    const outputFormat = dto.outputFormat || CliOutputFormatterTypes.Text;
+    const outputFormat = dto.outputFormat || CliOutputFormatterTypes.Raw;
     try {
       const formatter = this.outputFormatterManager.getStrategy(outputFormat);
       const [command, ...args] = splitCliCommandLine(commandLine);
@@ -216,7 +216,7 @@ export class CliBusinessService {
     clientOptions: IFindRedisClientInstanceByOptions,
     commandLine: string,
     role: ClusterNodeRole,
-    outputFormat: CliOutputFormatterTypes = CliOutputFormatterTypes.Text,
+    outputFormat: CliOutputFormatterTypes = CliOutputFormatterTypes.Raw,
   ): Promise<SendClusterCommandResponse[]> {
     let namespace = AppTool.CLI.toString();
     this.logger.log(`Executing redis.cluster CLI command for [${role}] nodes.`);
@@ -278,7 +278,7 @@ export class CliBusinessService {
     commandLine: string,
     role: ClusterNodeRole,
     nodeOptions: ClusterSingleNodeOptions,
-    outputFormat: CliOutputFormatterTypes = CliOutputFormatterTypes.Text,
+    outputFormat: CliOutputFormatterTypes = CliOutputFormatterTypes.Raw,
   ): Promise<SendClusterCommandResponse> {
     this.logger.log(`Executing redis.cluster CLI command for single node ${JSON.stringify(nodeOptions)}`);
     try {

redisinsight/api/src/modules/cli/services/cli-business/output-formatter/output-formatter-manager.spec.ts

@@ -11,7 +11,7 @@ class TestFormatterStrategy implements IOutputFormatterStrategy {
     return '';
   }
 }
-const strategyName = CliOutputFormatterTypes.Text;
+const strategyName = CliOutputFormatterTypes.Raw;
 const testStrategy = new TestFormatterStrategy();
 
 describe('OutputFormatterManager', () => {

redisinsight/splash.html

@@ -90,7 +90,7 @@
         </svg>
       </div>
       <span id="text" class="text"></span>
-      <span class="copyright">RedisInsight 2.0.2-preview © 2021 Redis Ltd.</span>
+      <span class="copyright">RedisInsight 2.0.3-preview © 2021 Redis Ltd.</span>
     </div>
   </div>
 

redisinsight/ui/src/components/cli/components/cli-body/CliBody/CliBody.spec.tsx

@@ -3,7 +3,7 @@ import React from 'react'
 import { keys } from '@elastic/eui'
 import { instance, mock } from 'ts-mockito'
 import { cleanup, fireEvent, mockedStore, render, screen } from 'uiSrc/utils/test-utils'
-import { clearOutput, updateCliHistoryStorage } from 'uiSrc/utils/cli'
+import { clearOutput, updateCliHistoryStorage } from 'uiSrc/utils/cliHelper'
 import CLI from 'uiSrc/components/cli/Cli'
 import { MOCK_COMMANDS_ARRAY } from 'uiSrc/constants'
 import CliBody, { Props } from './CliBody'
@@ -48,8 +48,8 @@ jest.mock(redisCommandsPath, () => {
   }
 })
 
-jest.mock('uiSrc/utils/cli', () => ({
-  ...jest.requireActual('uiSrc/utils/cli'),
+jest.mock('uiSrc/utils/cliHelper', () => ({
+  ...jest.requireActual('uiSrc/utils/cliHelper'),
   updateCliHistoryStorage: jest.fn(),
   clearOutput: jest.fn(),
 }))

redisinsight/ui/src/components/cli/components/cli-body/CliBody/CliBody.tsx

@@ -8,7 +8,7 @@ import { ClearCommand } from 'uiSrc/constants/cliOutput'
 import { outputSelector } from 'uiSrc/slices/cli/cli-output'
 import { cliSettingsSelector } from 'uiSrc/slices/cli/cli-settings'
 import CliInputWrapper from 'uiSrc/components/cli/components/cli-input'
-import { clearOutput, updateCliHistoryStorage } from 'uiSrc/utils/cli'
+import { clearOutput, updateCliHistoryStorage } from 'uiSrc/utils/cliHelper'
 import { appRedisCommandsSelector } from 'uiSrc/slices/app/redis-commands'
 
 import styles from './styles.module.scss'

redisinsight/ui/src/components/cli/components/cli-body/CliBodyWrapper.spec.tsx

@@ -1,6 +1,5 @@
 import React from 'react'
 import { cloneDeep, first } from 'lodash'
-import { instance, mock } from 'ts-mockito'
 import {
   cleanup,
   fireEvent,
@@ -21,9 +20,7 @@ import { processCliClient } from 'uiSrc/slices/cli/cli-settings'
 import { connectedInstanceSelector } from 'uiSrc/slices/instances'
 import { sessionStorageService } from 'uiSrc/services'
 
-import CliBodyWrapper, { Props } from './CliBodyWrapper'
-
-const mockedProps = mock<Props>()
+import CliBodyWrapper from './CliBodyWrapper'
 
 let store: typeof mockedStore
 beforeEach(() => {
@@ -55,8 +52,8 @@ jest.mock('uiSrc/slices/cli/cli-output', () => ({
   updateCliCommandHistory: jest.fn,
 }))
 
-jest.mock('uiSrc/utils/cli', () => ({
-  ...jest.requireActual('uiSrc/utils/cli'),
+jest.mock('uiSrc/utils/cliHelper', () => ({
+  ...jest.requireActual('uiSrc/utils/cliHelper'),
   updateCliHistoryStorage: jest.fn(),
   clearOutput: jest.fn(),
   cliParseTextResponse: jest.fn(),
@@ -78,20 +75,20 @@ jest.mock('uiSrc/slices/cli/cli-settings', () => ({
 
 describe('CliBodyWrapper', () => {
   it('should render', () => {
-    expect(render(<CliBodyWrapper {...instance(mockedProps)} />)).toBeTruthy()
+    expect(render(<CliBodyWrapper />)).toBeTruthy()
   })
 
   it('should SessionStorage be called', () => {
     const mockUuid = 'test-uuid'
     sessionStorageService.get = jest.fn().mockReturnValue(mockUuid)
 
-    render(<CliBodyWrapper {...instance(mockedProps)} />)
+    render(<CliBodyWrapper />)
 
     expect(sessionStorageService.get).toBeCalledWith(BrowserStorageItem.cliClientUuid)
   })
 
   it('should render with SessionStorage', () => {
-    render(<CliBodyWrapper {...instance(mockedProps)} />)
+    render(<CliBodyWrapper />)
 
     const expectedActions = [concatToOutput(InitOutputText('', 0)), processCliClient()]
     expect(clearStoreActions(store.getActions().slice(0, expectedActions.length))).toEqual(
@@ -100,7 +97,7 @@ describe('CliBodyWrapper', () => {
   })
 
   it('"onSubmit" should be called after keyDown Enter', () => {
-    render(<CliBodyWrapper {...instance(mockedProps)} />)
+    render(<CliBodyWrapper />)
 
     fireEvent.keyDown(screen.getByTestId(cliCommandTestId), {
       key: 'Enter',
@@ -114,7 +111,7 @@ describe('CliBodyWrapper', () => {
   })
 
   it('CliHelper should be opened by default', () => {
-    render(<CliBodyWrapper {...instance(mockedProps)} />)
+    render(<CliBodyWrapper />)
 
     expect(screen.getByTestId('cli-helper')).toBeInTheDocument()
   })
@@ -127,7 +124,7 @@ describe('CliBodyWrapper', () => {
 
     processUnsupportedCommand.mockImplementation(() => processUnsupportedCommandMock)
 
-    render(<CliBodyWrapper {...instance(mockedProps)} />)
+    render(<CliBodyWrapper />)
 
     // Act
     fireEvent.change(screen.getByTestId(cliCommandTestId), {
@@ -152,7 +149,7 @@ describe('CliBodyWrapper', () => {
 
     sendCliClusterCommandAction.mockImplementation(() => sendCliClusterActionMock)
 
-    render(<CliBodyWrapper {...instance(mockedProps)} />)
+    render(<CliBodyWrapper />)
 
     // Act
     fireEvent.keyDown(screen.getByTestId(cliCommandTestId), {

redisinsight/ui/src/components/cli/components/cli-body/CliBodyWrapper.tsx

@@ -26,7 +26,7 @@ import { ConnectionType } from 'uiSrc/slices/interfaces'
 import { sessionStorageService } from 'uiSrc/services'
 import { ClusterNodeRole } from 'uiSrc/slices/interfaces/cli'
 import { connectedInstanceSelector } from 'uiSrc/slices/instances'
-import { checkUnsupportedCommand, clearOutput } from 'uiSrc/utils/cli'
+import { checkUnsupportedCommand, clearOutput } from 'uiSrc/utils/cliHelper'
 import { InitOutputText, ConnectionSuccessOutputText } from 'uiSrc/constants/cliOutput'
 import { SendClusterCommandDto } from 'apiSrc/modules/cli/dto/cli.dto'
 

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

@@ -10,7 +10,6 @@ import { appPluginsSelector } from 'uiSrc/slices/app/plugins'
 import { IPluginVisualization } from 'uiSrc/slices/interfaces'
 import { CommandExecutionStatus } from 'uiSrc/slices/interfaces/cli'
 import { sendEventTelemetry, TelemetryEvent } from 'uiSrc/telemetry'
-import { appRedisCommandsSelector } from 'uiSrc/slices/app/redis-commands'
 
 import QueryCardHeader from './QueryCardHeader'
 import QueryCardCliResult from './QueryCardCliResult'
@@ -25,7 +24,6 @@ export interface Props {
   data: any;
   status: Maybe<CommandExecutionStatus>;
   fromStore: boolean;
-  matched?: number;
   time?: number;
   loading?: boolean;
   onQueryRun: (queryType: WBQueryType) => void;
@@ -51,7 +49,6 @@ const QueryCard = (props: Props) => {
   } = props
 
   const { visualizations = [] } = useSelector(appPluginsSelector)
-  const { commandsArray: REDIS_COMMANDS_ARRAY } = useSelector(appRedisCommandsSelector)
 
   const { instanceId = '' } = useParams<{ instanceId: string }>()
   const [isOpen, setIsOpen] = useState(!fromStore)
@@ -110,25 +107,9 @@ const QueryCard = (props: Props) => {
     }
   }, [data, time])
 
-  const sendEventToggleOpenTelemetry = () => {
-    const matchedCommand = REDIS_COMMANDS_ARRAY.find((commandName) =>
-      query.toUpperCase().startsWith(commandName))
-
-    sendEventTelemetry({
-      event: isOpen
-        ? TelemetryEvent.WORKBENCH_RESULTS_COLLAPSED
-        : TelemetryEvent.WORKBENCH_RESULTS_EXPANDED,
-      eventData: {
-        databaseId: instanceId,
-        command: matchedCommand ?? query.split(' ')?.[0]
-      }
-    })
-  }
-
   const toggleOpen = () => {
     if (isFullScreen) return
 
-    sendEventToggleOpenTelemetry()
     setIsOpen(!isOpen)
 
     if (!isOpen && !data) {
@@ -137,8 +118,6 @@ const QueryCard = (props: Props) => {
   }
 
   const changeViewTypeSelected = (type: WBQueryType, value: string) => {
-    onQueryRun(type)
-    setResult(undefined)
     setViewTypeSelected(type)
     setSelectedViewValue(value)
   }
@@ -191,7 +170,7 @@ const QueryCard = (props: Props) => {
                     </>
                   )}
                   {viewTypeSelected === WBQueryType.Text && (
-                    <QueryCardCliResult status={status} result={result} />
+                    <QueryCardCliResult query={query} status={status} result={result} />
                   )}
                 </>
               )}