#RI-6264 - fix highlighting and suggestion when query command starts with number

Author: rsergeenko

redisinsight/ui/src/pages/workbench/utils/searchSuggestions.ts

@@ -62,7 +62,7 @@ export const findSuggestionsByArg = (
 
   if (foundArg?.stopArg?.token && !foundArg?.isBlocked) {
     return handleCommonSuggestions(
-      command.fullQuery,
+      command.commandQuery,
       foundArg,
       allArgs,
       additionData.fields || [],
@@ -80,7 +80,7 @@ export const findSuggestionsByArg = (
       return handleQuerySuggestions(foundArg)
     }
     default: {
-      return handleCommonSuggestions(command.fullQuery, foundArg, allArgs, fields, cursorContext, isEscaped)
+      return handleCommonSuggestions(command.commandQuery, foundArg, allArgs, fields, cursorContext, isEscaped)
     }
   }
 }

redisinsight/ui/src/utils/monaco/monacoInterfaces.ts

@@ -10,6 +10,7 @@ export interface IMonacoCommand {
 export interface IMonacoQuery {
   name: string
   fullQuery: string
+  commandQuery: string
   args: [string[], string[]],
   cursor: {
     isCursorInQuotes: boolean,

redisinsight/ui/src/utils/monaco/monacoRedisMonarchTokensProvider.ts

@@ -8,8 +8,8 @@ const STRING_DOUBLE = 'string.double'
 export const getRedisMonarchTokensProvider = (commands: IRedisCommand[]): monacoEditor.languages.IMonarchLanguage => {
   const commandRedisCommands = [...commands]
   const searchCommands = remove(commandRedisCommands, ({ token }) => token?.startsWith(ModuleCommandPrefix.RediSearch))
-  const COMMON_COMMANDS_REGEX = `^\\s*(${commandRedisCommands.map(({ token }) => token).join('|')})\\b`
-  const SEARCH_COMMANDS_REGEX = `^\\s*(${searchCommands.map(({ token }) => token).join('|')})\\b`
+  const COMMON_COMMANDS_REGEX = `^\\s*(\\d+\\s+)?(${commandRedisCommands.map(({ token }) => token).join('|')})\\b`
+  const SEARCH_COMMANDS_REGEX = `^\\s*(\\d+\\s+)?(${searchCommands.map(({ token }) => token).join('|')})\\b`
 
   return {
     defaultToken: '',
@@ -20,13 +20,12 @@ export const getRedisMonarchTokensProvider = (commands: IRedisCommand[]): monaco
       { open: '[', close: ']', token: 'delimiter.square' },
       { open: '(', close: ')', token: 'delimiter.parenthesis' },
     ],
-    keywords: commands.map(({ token }) => token),
+    keywords: [],
     operators: [],
     tokenizer: {
       root: [
         { include: '@startOfLine' },
         { include: '@whitespace' },
-        { include: '@numbers' },
         { include: '@strings' },
         { include: '@keyword' },
         [/[;,.]/, 'delimiter'],
@@ -42,6 +41,7 @@ export const getRedisMonarchTokensProvider = (commands: IRedisCommand[]): monaco
           },
         ],
         [/[<>=!%&+\-*/|~^]/, 'operator'],
+        { include: '@numbers' },
       ],
       keyword: [
         [COMMON_COMMANDS_REGEX, { token: 'keyword' }],

redisinsight/ui/src/utils/monaco/monacoUtils.ts

@@ -1,5 +1,5 @@
 import { monaco as monacoEditor } from 'react-monaco-editor'
-import { first, isEmpty, isUndefined, reject, without } from 'lodash'
+import { first, isEmpty, isNaN, isUndefined, reject, toNumber, without } from 'lodash'
 import { decode } from 'html-entities'
 import { ICommand, ICommands } from 'uiSrc/constants'
 import {
@@ -266,13 +266,15 @@ export const findCompleteQuery = (
     compositeArgs,
   )
 
-  const [[commandNameFromQuery]] = args
+  const [beforeCursorArgs] = args
+  const commandNameFromQuery = isNaN(toNumber(beforeCursorArgs[0])) ? beforeCursorArgs[0] : beforeCursorArgs[1]
   const matchedCommand = commandsArray
     .find((command) => commandNameFromQuery?.toUpperCase() === command.toUpperCase())
 
   const cursorContext = {
     position,
     fullQuery,
+    commandQuery: fullQuery.replace(/^\d+\s+/, ''),
     args,
     allArgs: args.flat(),
     cursor,

redisinsight/ui/src/utils/monaco/monarchTokens/redisearchTokensSubRedis.ts

@@ -77,9 +77,9 @@ export const getRediSearchSubRedisMonarchTokensProvider = (
           [/[\w@#$.]+/, 'identifier']
         ],
         keywords: [
-          [`^\\s*(${generateKeywords(withNextQueryIndexSuggestions).join('|')})\\b`, { token: 'keyword', next: '@index.query' }],
-          [`^\\s*(${generateKeywords(withNextIndexSuggestions).join('|')})\\b`, { token: 'keyword', next: '@index' }],
-          [`^\\s*(${generateKeywords(withoutIndexSuggestions).join('|')})\\b`, { token: 'keyword', next: '@root' }],
+          [`^\\s*(\\d\\s)?(${generateKeywords(withNextQueryIndexSuggestions).join('|')})\\b`, { token: 'keyword', next: '@index.query' }],
+          [`^\\s*(\\d\\s)?(${generateKeywords(withNextIndexSuggestions).join('|')})\\b`, { token: 'keyword', next: '@index' }],
+          [`^\\s*(\\d\\s)?(${generateKeywords(withoutIndexSuggestions).join('|')})\\b`, { token: 'keyword', next: '@root' }],
         ],
         ...tokens,
         ...generateQuery(),