Merge branch 'main' into feature/RI-3413-telemetry-command-module

Author: ALENA NABOKA

README.md

@@ -39,12 +39,10 @@ Check out the [release notes](https://docs.redis.com/latest/ri/release-notes/).
 
 ## Get started with RedisInsight
 
-This repository includes the code for RedisInsight 2.0, Currently available in public preview. Check out the [blogpost](https://redis.com/blog/introducing-redisinsight-2/) announcing it. 
-
-The current GA version of RedisInsight is 1.11. You can install RedisInsight 2.0 along with the GA version. 
+This repository includes the code for the GA version of RedisInsight 2.0. Check out the [blogpost](https://redis.com/blog/introducing-redisinsight-2/) announcing it. 
 
 ### Installable 
-Available to download for free from [here](https://redis.com/redis-enterprise/redis-insight/#insight-form). 
+Available to download for free from [here](https://redis.com/redis-enterprise/redis-insight/#insight-form).
 
 ### Build 
 Alternatively you can also build from source. See our wiki for instructions.

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

@@ -30,6 +30,7 @@ export interface Props {
   result: Maybe<CommandExecutionResult[]>
   activeMode: RunQueryMode
   mode: RunQueryMode
+  emptyCommand: boolean
   createdAt?: Date
   loading?: boolean
   onQueryDelete: () => void
@@ -52,7 +53,8 @@ const QueryCard = (props: Props) => {
     onQueryOpen,
     onQueryDelete,
     onQueryReRun,
-    loading
+    loading,
+    emptyCommand,
   } = props
 
   const { visualizations = [] } = useSelector(appPluginsSelector)
@@ -146,6 +148,7 @@ const QueryCard = (props: Props) => {
           selectedValue={selectedViewValue}
           activeMode={activeMode}
           mode={mode}
+          emptyCommand={emptyCommand}
           toggleOpen={toggleOpen}
           toggleFullScreen={toggleFullScreen}
           setSelectedValue={changeViewTypeSelected}

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

@@ -43,6 +43,7 @@ export interface Props {
   queryType: WBQueryType
   selectedValue: string
   loading?: boolean
+  emptyCommand: boolean
   toggleOpen: () => void
   toggleFullScreen: () => void
   setSelectedValue: (type: WBQueryType, value: string) => void
@@ -63,6 +64,7 @@ const QueryCardHeader = (props: Props) => {
     mode,
     activeMode,
     selectedValue,
+    emptyCommand,
     setSelectedValue,
     onQueryDelete,
     onQueryReRun,
@@ -302,7 +304,13 @@ const QueryCardHeader = (props: Props) => {
               content="Run again"
               position="left"
             >
-              <EuiButtonIcon iconType="play" aria-label="Re-run command" data-testid="re-run-command" onClick={handleQueryReRun} />
+              <EuiButtonIcon
+                disabled={emptyCommand}
+                iconType="play"
+                aria-label="Re-run command"
+                data-testid="re-run-command"
+                onClick={handleQueryReRun}
+              />
             </EuiToolTip>
           </EuiFlexItem>
         )}

redisinsight/ui/src/constants/workbenchResults.ts

@@ -1 +1,3 @@
 export const bulkReplyCommands = ['LOLWUT', 'INFO', 'CLIENT', 'CLUSTER', 'MEMORY', 'MONITOR', 'PSUBSCRIBE']
+
+export const EMPTY_COMMAND = 'Encrypted data'

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

@@ -48,7 +48,18 @@ const WBResults = (props: Props) => {
   return (
     <div className={cx(styles.container)}>
       <div ref={scrollDivRef} />
-      {items.map(({ command = '', isOpen = false, result = undefined, id = '', loading, createdAt, mode }) => (
+      {items.map((
+        {
+          command = '',
+          isOpen = false,
+          result = undefined,
+          id = '',
+          loading,
+          createdAt,
+          mode,
+          emptyCommand,
+        }
+      ) => (
         <QueryCard
           id={id}
           key={id}
@@ -58,6 +69,7 @@ const WBResults = (props: Props) => {
           command={command}
           createdAt={createdAt}
           activeMode={activeMode}
+          emptyCommand={emptyCommand}
           mode={mode}
           onQueryOpen={() => onQueryOpen(id)}
           onQueryReRun={() => onQueryReRun(command, null, false)}

redisinsight/ui/src/slices/interfaces/workbench.ts

@@ -39,6 +39,7 @@ export interface CommandExecutionUI extends Partial<CommandExecution> {
   loading?: boolean
   isOpen?: boolean
   error?: string
+  emptyCommand: boolean
 }
 
 export enum RunQueryMode {

redisinsight/ui/src/slices/tests/workbench/wb-results.spec.ts

@@ -11,6 +11,7 @@ import { apiService } from 'uiSrc/services'
 import { addErrorNotification } from 'uiSrc/slices/app/notifications'
 import { ClusterNodeRole, CommandExecutionStatus } from 'uiSrc/slices/interfaces/cli'
 import { SendClusterCommandDto } from 'apiSrc/modules/cli/dto/cli.dto'
+import { EMPTY_COMMAND } from 'uiSrc/constants'
 import reducer, {
   initialState,
   sendWBCommand,
@@ -205,6 +206,49 @@ describe('workbench results slice', () => {
     })
   })
 
+  describe('loadWBHistorySuccess', () => {
+    it('should properly set history items', () => {
+      // Arrange
+      const mockCommandExecution = [{ mode: null, id: 'e3553f5a-0fdf-4282-8406-8b377c2060d2', databaseId: '3f795233-e26a-463b-a116-58cf620b18f2', command: 'get test', role: null, nodeOptions: null, createdAt: '2022-06-10T15:47:13.000Z', emptyCommand: false }]
+      const state = {
+        ...initialStateWithItems,
+        items: mockCommandExecution
+      }
+
+      // Act
+      const nextState = reducer(initialStateWithItems, loadWBHistorySuccess(mockCommandExecution))
+
+      // Assert
+      const rootState = Object.assign(initialStateDefault, {
+        workbench: {
+          results: nextState,
+        },
+      })
+      expect(workbenchResultsSelector(rootState)).toEqual(state)
+    })
+
+    it(`if command=null should properly set history items with command=${EMPTY_COMMAND}`, () => {
+      // Arrange
+      const mockCommandExecution = [{ mode: null, id: 'e3553f5a-0fdf-4282-8406-8b377c2060d2', databaseId: '3f795233-e26a-463b-a116-58cf620b18f2', command: null, role: null, nodeOptions: null, createdAt: '2022-06-10T15:47:13.000Z' }]
+
+      const state = {
+        ...initialStateWithItems,
+        items: [{ mode: null, id: 'e3553f5a-0fdf-4282-8406-8b377c2060d2', databaseId: '3f795233-e26a-463b-a116-58cf620b18f2', command: EMPTY_COMMAND, role: null, nodeOptions: null, createdAt: '2022-06-10T15:47:13.000Z', emptyCommand: true }]
+      }
+
+      // Act
+      const nextState = reducer(initialStateWithItems, loadWBHistorySuccess(mockCommandExecution))
+
+      // Assert
+      const rootState = Object.assign(initialStateDefault, {
+        workbench: {
+          results: nextState,
+        },
+      })
+      expect(workbenchResultsSelector(rootState)).toEqual(state)
+    })
+  })
+
   describe('thunks', () => {
     describe('Standalone Cli command', () => {
       it('call both sendWBCommandAction and sendWBCommandSuccess when response status is successed', async () => {

redisinsight/ui/src/slices/workbench/wb-results.ts

@@ -1,7 +1,7 @@
 import { createSlice } from '@reduxjs/toolkit'
 import { AxiosError } from 'axios'
 import { apiService } from 'uiSrc/services'
-import { ApiEndpoints } from 'uiSrc/constants'
+import { ApiEndpoints, EMPTY_COMMAND } from 'uiSrc/constants'
 import { addErrorNotification } from 'uiSrc/slices/app/notifications'
 import { CliOutputFormatterType } from 'uiSrc/constants/cliOutput'
 import { RunQueryMode } from 'uiSrc/slices/interfaces/workbench'
@@ -40,7 +40,8 @@ const workbenchResultsSlice = createSlice({
     },
 
     loadWBHistorySuccess: (state, { payload }:{ payload: CommandExecution[] }) => {
-      state.items = payload
+      state.items = payload.map((item) =>
+        ({ ...item, command: item.command || EMPTY_COMMAND, emptyCommand: !item.command }))
       state.loading = false
     },
 

tests/e2e/common-actions/cli-actions.ts

@@ -0,0 +1,33 @@
+import { t } from 'testcafe';
+import { CliPage } from '../pageObjects';
+
+const cliPage = new CliPage();
+
+export class CliActions {
+    
+    /**
+     * Check list of commands searched
+     * @param searchedCommand Searched command in Command Helper
+     * @param listToCompare The list with commands to compare with opened in Command Helper
+     */
+     async checkSearchedCommandInCommandHelper(searchedCommand: string, listToCompare: string[]): Promise<void> {
+        await t.typeText(cliPage.cliHelperSearch, searchedCommand, { speed: 0.5 });
+        //Verify results in the output
+        const commandsCount = await cliPage.cliHelperOutputTitles.count;
+        for (let i = 0; i < commandsCount; i++) {
+            await t.expect(cliPage.cliHelperOutputTitles.nth(i).textContent).eql(listToCompare[i], 'Results in the output contains searched value');
+        }
+    }
+
+    /**
+    * Check commands list
+    * @param listToCompare The list with commands to compare with opened in Command Helper
+    */
+    async checkCommandsInCommandHelper(listToCompare: string[]): Promise<void> {
+        //Verify results in the output
+        const commandsCount = await cliPage.cliHelperOutputTitles.count;
+        for (let i = 0; i < commandsCount; i++) {
+            await t.expect(cliPage.cliHelperOutputTitles.nth(i).textContent).eql(listToCompare[i], 'Results in the output not contain searched value');
+        }
+    }
+}

tests/e2e/pageObjects/cli-page.ts

@@ -27,6 +27,7 @@ export class CliPage {
     commandHelperBadge = Selector('[data-testid=expand-command-helper] span');
     cliResizeButton = Selector('[data-test-subj=resize-btn-browser-cli]');
     workbenchLink = Selector('[data-test-subj=cli-workbench-page-btn]');
+    returnToList = Selector('[data-testid=cli-helper-back-to-list-btn]');
     //TEXT INPUTS (also referred to as 'Text fields')
     cliCommandInput = Selector('[data-testid=cli-command]');
     cliArea = Selector('[data-testid=cli');
@@ -58,7 +59,7 @@ export class CliPage {
   * Select filter group type
   * @param groupName The group name
   */
-    async selectFilterGroupType(groupName: string): Promise<void>{
+    async selectFilterGroupType(groupName: string): Promise<void> {
         await t.click(this.filterGroupTypeButton);
         await t.click(this.filterOptionGroupType.withExactText(groupName));
     }
@@ -69,7 +70,7 @@ export class CliPage {
    * @param amount The amount of the keys
    * @param keyName The name of the keys. The default value is keyName
    */
-    async addKeysFromCli(keyCommand: string, amount: number, keyName = 'keyName'): Promise<void>{
+    async addKeysFromCli(keyCommand: string, amount: number, keyName = 'keyName'): Promise<void> {
         //Open CLI
         await t.click(this.cliExpandButton);
         //Add keys
@@ -83,7 +84,7 @@ export class CliPage {
    * Send command in Cli
    * @param command The command to send
    */
-    async sendCommandInCli(command: string): Promise<void>{
+    async sendCommandInCli(command: string): Promise<void> {
         //Open CLI
         await t.click(this.cliExpandButton);
         await t.typeText(this.cliCommandInput, command, { paste: true });
@@ -95,7 +96,7 @@ export class CliPage {
    * Get command result execution
    * @param command The command for send in CLI
    */
-    async getSuccessCommandResultFromCli(command: string): Promise<string>{
+    async getSuccessCommandResultFromCli(command: string): Promise<string> {
         //Open CLI
         await t.click(this.cliExpandButton);
         //Add keys
@@ -127,18 +128,4 @@ export class CliPage {
         await t.click(this.readMoreButton);
         await t.expect(getPageUrl()).eql(url, 'The opened page');
     }
-
-    /**
-     * Check URL of command opened from command helper
-     * @param searchedCommand Searched command in Command Helper
-     * @param listToCompare The list with commands to compare with opened in Command Helper
-     */
-    async checkSearchedCommandInCommandHelper(searchedCommand: string, listToCompare: string[]): Promise<void> {
-        await t.typeText(this.cliHelperSearch, searchedCommand, { speed: 0.5 });
-        //Verify results in the output
-        const commandsCount = await this.cliHelperOutputTitles.count;
-        for (let i = 0; i < commandsCount; i++) {
-            await t.expect(this.cliHelperOutputTitles.nth(i).textContent).eql(listToCompare[i], 'Results in the output contains searched value');
-        }
-    }
 }