Skip to content

Commit dbb0f51

Browse files
rsergeenkorsergeenko
authored
Merge pull request #4028 from RedisInsight/fe/bugfix/release/2.60.0
fix fe bugs
2 parents 106e328 + 5458815 commit dbb0f51

File tree

9 files changed

+61
-62
lines changed

9 files changed

+61
-62
lines changed

‎redisinsight/ui/src/constants/monaco/monaco.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,10 @@ export const defaultMonacoOptions: monacoEditor.editor.IStandaloneEditorConstruc
4949
automaticLayout: true,
5050
formatOnPaste: false,
5151
glyphMargin: true,
52+
bracketPairColorization: {
53+
enabled: true,
54+
independentColorPoolPerBracketType: true
55+
},
5256
stickyScroll: {
5357
enabled: true,
5458
defaultModel: 'indentationModel'

‎redisinsight/ui/src/constants/monaco/theme.ts‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,16 +37,14 @@ export const redisearchLightThemeRules = [
3737
export const darkThemeRules = [
3838
{ token: 'function', foreground: 'BFBC4E' },
3939
...redisearchDarKThemeRules.map((rule) => ({
40-
...rule,
41-
token: `${rule.token}`
40+
...rule
4241
}))
4342
]
4443

4544
export const lightThemeRules = [
4645
{ token: 'function', foreground: '795E26' },
4746
...redisearchLightThemeRules.map((rule) => ({
48-
...rule,
49-
token: `${rule.token}.redisearch`
47+
...rule
5048
}))
5149
]
5250

‎redisinsight/ui/src/pages/home/components/database-list-component/DatabasesListWrapper.tsx‎

Lines changed: 23 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ import RediStackLightMin from 'uiSrc/assets/img/modules/redistack/RediStackLight
2222
import RediStackDarkLogo from 'uiSrc/assets/img/modules/redistack/RedisStackLogoDark.svg'
2323
import RediStackLightLogo from 'uiSrc/assets/img/modules/redistack/RedisStackLogoLight.svg'
2424
import CloudLinkIcon from 'uiSrc/assets/img/oauth/cloud_link.svg?react'
25-
import { ShowChildByCondition } from 'uiSrc/components'
2625
import DatabaseListModules from 'uiSrc/components/database-list-modules/DatabaseListModules'
2726
import ItemList from 'uiSrc/components/item-list'
2827
import { BrowserStorageItem, Pages, Theme } from 'uiSrc/constants'
@@ -68,7 +67,6 @@ const DatabasesListWrapper = ({ width, onEditInstance, editedInstance, onDeleteI
6867
const [, forceRerender] = useState({})
6968

7069
const deletingIdRef = useRef('')
71-
const isLoadingRef = useRef(false)
7270

7371
const closePopover = () => {
7472
if (deletingIdRef.current) {
@@ -84,19 +82,14 @@ const DatabasesListWrapper = ({ width, onEditInstance, editedInstance, onDeleteI
8482

8583
useEffect(() => {
8684
const editInstanceId = new URLSearchParams(search).get('editInstance')
87-
if (editInstanceId && !instances.loading) {
85+
if (editInstanceId && instances?.data?.length) {
8886
const instance = instances.data.find((item: Instance) => item.id === editInstanceId)
8987
if (instance) {
9088
handleClickEditInstance(instance)
91-
}
92-
setTimeout(() => {
9389
history.replace(Pages.home)
94-
}, 1000)
90+
}
9591
}
96-
97-
isLoadingRef.current = instances.loading
98-
forceRerender({})
99-
}, [instances.loading, search])
92+
}, [instances, search])
10093

10194
useEffect(() => {
10295
closePopover()
@@ -235,32 +228,28 @@ const DatabasesListWrapper = ({ width, onEditInstance, editedInstance, onDeleteI
235228
return (
236229
<div role="presentation">
237230
{newStatus && (
238-
<ShowChildByCondition isShow={!isLoadingRef.current} innerClassName={styles.newStatusAnchor}>
239-
<EuiToolTip content="New" position="top" anchorClassName={styles.newStatusAnchor}>
240-
<div className={styles.newStatus} data-testid={`database-status-new-${id}`} />
241-
</EuiToolTip>
242-
</ShowChildByCondition>
231+
<EuiToolTip content="New" position="top" anchorClassName={styles.newStatusAnchor}>
232+
<div className={styles.newStatus} data-testid={`database-status-new-${id}`} />
233+
</EuiToolTip>
243234
)}
244-
<ShowChildByCondition isShow={!isLoadingRef.current}>
245-
<EuiToolTip
246-
position="bottom"
247-
title="Database Alias"
248-
className={styles.tooltipColumnName}
249-
content={`${formatLongName(name)} ${getDbIndex(db)}`}
235+
<EuiToolTip
236+
position="bottom"
237+
title="Database Alias"
238+
className={styles.tooltipColumnName}
239+
content={`${formatLongName(name)} ${getDbIndex(db)}`}
240+
>
241+
<EuiText
242+
className={styles.tooltipAnchorColumnName}
243+
data-testid={`instance-name-${id}`}
244+
onClick={(e: React.MouseEvent) => handleCheckConnectToInstance(e, instance)}
245+
onKeyDown={(e: React.KeyboardEvent) => handleCheckConnectToInstance(e, instance)}
250246
>
251-
<EuiText
252-
className={styles.tooltipAnchorColumnName}
253-
data-testid={`instance-name-${id}`}
254-
onClick={(e: React.MouseEvent) => handleCheckConnectToInstance(e, instance)}
255-
onKeyDown={(e: React.KeyboardEvent) => handleCheckConnectToInstance(e, instance)}
256-
>
257-
<EuiTextColor className={cx(styles.tooltipColumnNameText, { [styles.withDb]: db })}>
258-
{cellContent}
259-
</EuiTextColor>
260-
<EuiTextColor>{` ${getDbIndex(db)}`}</EuiTextColor>
261-
</EuiText>
262-
</EuiToolTip>
263-
</ShowChildByCondition>
247+
<EuiTextColor className={cx(styles.tooltipColumnNameText, { [styles.withDb]: db })}>
248+
{cellContent}
249+
</EuiTextColor>
250+
<EuiTextColor>{` ${getDbIndex(db)}`}</EuiTextColor>
251+
</EuiText>
252+
</EuiToolTip>
264253
</div>
265254
)
266255
},

‎redisinsight/ui/src/pages/workbench/components/query/Query/Query.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React, { useContext, useEffect, useMemo, useRef, useState } from 'react'
22
import { useDispatch, useSelector } from 'react-redux'
3-
import { compact, first } from 'lodash'
3+
import { compact, first, isFinite } from 'lodash'
44
import cx from 'classnames'
55
import MonacoEditor, { monaco as monacoEditor } from 'react-monaco-editor'
66
import { useParams } from 'react-router-dom'
@@ -423,7 +423,7 @@ const Query = (props: Props) => {
423423
command: Nullable<IMonacoQuery>
424424
) => {
425425
const { editor } = monacoObjects?.current || {}
426-
if (!command || !editor) {
426+
if (!command?.info || !editor) {
427427
isWidgetEscaped.current = false
428428
return
429429
}
@@ -471,6 +471,7 @@ const Query = (props: Props) => {
471471
}
472472

473473
const triggerSuggestions = () => {
474+
isEscapedSuggestions.current = false
474475
const { editor } = monacoObjects.current || {}
475476
setTimeout(() => editor?.trigger('', 'editor.action.triggerSuggest', { auto: false }))
476477
}
@@ -555,12 +556,12 @@ const Query = (props: Props) => {
555556

556557
if (position.column === 1) {
557558
helpWidgetRef.current.isOpen = false
558-
if (command) return asSuggestionsRef([])
559+
if (command?.info) return asSuggestionsRef([])
559560
return asSuggestionsRef(getCommandsSuggestions(commands, range), false, false)
560561
}
561562

562-
if (!command) {
563-
return asSuggestionsRef(getCommandsSuggestions(commands, range), false)
563+
if (!command?.info) {
564+
return asSuggestionsRef(getCommandsSuggestions(commands, range), false, false)
564565
}
565566

566567
const { allArgs, args, cursor } = command

‎redisinsight/ui/src/pages/workbench/utils/monaco.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,8 @@ export const getRediSearchSignutureProvider = (options: Maybe<{
6060
if (token && numberOfArgsInside > 1) {
6161
const parentToken = token.token || token.arguments?.[0]?.token
6262
const parentTokenPosition = parentToken ? label.indexOf(parentToken) : 0
63-
const startPosition = label.indexOf(arg, parentTokenPosition)
63+
const wordRegex = new RegExp(`\\b${arg}\\b`, 'g')
64+
const startPosition = wordRegex.exec(label.slice(parentTokenPosition))?.index || 0
6465
signaturePosition = [startPosition, startPosition + arg.length]
6566
}
6667

‎redisinsight/ui/src/pages/workbench/utils/query.ts‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -336,11 +336,12 @@ export const removeNotSuggestedArgs = (args: string[], commandArgs: IRedisComman
336336
}
337337

338338
if (arg.type === ICommandTokenType.Block) {
339-
if (arg.token) return !args.includes(arg.token) || arg.multiple
340-
return arg.arguments?.[0]?.token && (!args.includes(arg.arguments?.[0]?.token?.toUpperCase()) || arg.multiple)
339+
if (arg.token) return !args.some((queryArg) => isStringsEqual(queryArg, arg.token)) || arg.multiple
340+
return arg.arguments?.[0]?.token
341+
&& (!args.some(((queryArg) => isStringsEqual(queryArg, arg.arguments?.[0]?.token))) || arg.multiple)
341342
}
342343

343-
return arg.token && !args.includes(arg.token)
344+
return arg.token && !args.some((queryArg) => isStringsEqual(queryArg, arg.token))
344345
})
345346

346347
export const fillArgsByType = (args: IRedisCommand[], expandBlock = true): IRedisCommandTree[] => {
@@ -380,7 +381,11 @@ export const findArgByToken = (list: IRedisCommand[], arg: string): Maybe<IRedis
380381
export const generateDetail = (command: Maybe<IRedisCommand>) => {
381382
if (!command) return ''
382383
if (command.arguments) {
383-
const args = generateArgsNames(CommandProvider.Main, command.arguments).join(' ')
384+
const isTokenInArguemnts = command.token === command.arguments?.[0]?.token
385+
const args = generateArgsNames(
386+
CommandProvider.Main,
387+
command.arguments.slice(isTokenInArguemnts ? 1 : 0)
388+
).join(' ')
384389
return command.token ? `${command.token} ${args}` : args
385390
}
386391
if (command.token) {

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

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -266,22 +266,26 @@ export const findCompleteQuery = (
266266
compositeArgs,
267267
)
268268

269-
const [[firstQueryArg]] = args
269+
const [[commandNameFromQuery]] = args
270270
const matchedCommand = commandsArray
271-
.find((command) => firstQueryArg?.toUpperCase() === command.toUpperCase())
271+
.find((command) => commandNameFromQuery?.toUpperCase() === command.toUpperCase())
272+
273+
const cursorContext = {
274+
position,
275+
fullQuery,
276+
args,
277+
allArgs: args.flat(),
278+
cursor,
279+
}
272280

273281
if (isUndefined(matchedCommand)) {
274-
return null
282+
return cursorContext as IMonacoQuery
275283
}
276284

277285
return {
278-
position,
286+
...cursorContext,
279287
commandPosition,
280288
commandCursorPosition,
281-
fullQuery,
282-
args,
283-
cursor,
284-
allArgs: args.flat(),
285289
name: matchedCommand,
286290
info: commandsSpec[matchedCommand]
287291
} as IMonacoQuery

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,7 @@ export const getRediSearchSubRedisMonarchTokensProvider = (
122122
[/[^\\"]+/, STRING_DOUBLE],
123123
],
124124
startOfLine: [
125-
[/\n/, { next: '@keywords', token: '@pop' }]
125+
[/\s?\n/, { next: '@root', token: '@pop' }],
126126
]
127127
},
128128
}

‎redisinsight/ui/src/utils/monaco/monarchTokens/redisearchTokensTemplates.ts‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ export const generateQuery = (
2727
[/\\"/, { token: 'query', next: appendTokenName('@query.inside.double') }],
2828
[/==|!=|<=|>=|<|>/, { token: 'query.operator' }],
2929
[/&&|\|\|/, { token: 'query.operator' }],
30+
[/[()]/, 'delimiter.parenthesis'],
3031
getFunctionsTokens('@function.inside.double'),
3132
[/"/, { token: appendTokenName('query'), next: '@root' }],
3233
[/./, { token: appendTokenName('query'), next: appendTokenName('@query.inside.double') }],
@@ -37,6 +38,7 @@ export const generateQuery = (
3738
[/\\'/, { token: appendTokenName('query'), next: appendTokenName('query.inside.single') }],
3839
[/==|!=|<=|>=|<|>/, { token: 'query.operator' }],
3940
[/&&|\|\|/, { token: 'query.operator' }],
41+
[/[()]/, 'delimiter.parenthesis'],
4042
getFunctionsTokens('@function.inside.single'),
4143
[/'/, { token: appendTokenName('query'), next: '@root' }],
4244
[/./, { token: appendTokenName('query'), next: appendTokenName('@query.inside.single') }],
@@ -60,11 +62,6 @@ export const generateQuery = (
6062
[/\(/, { token: 'delimiter.parenthesis', next: appendTokenName('@function.args.double') }],
6163
{ include: appendTokenName('@query') }
6264
],
63-
[appendTokenName('function.inside.double')]: [
64-
[/\s+/, 'white'], // Handle whitespace
65-
[/\(/, { token: 'delimiter.parenthesis', next: appendTokenName('@function.args.double') }],
66-
{ include: appendTokenName('@query') }
67-
],
6865
[appendTokenName('function.args.double')]: [
6966
[/\)/, { token: 'delimiter.parenthesis', next: appendTokenName('@query.inside.double') }],
7067
[/,/, 'delimiter.comma'], // Match commas between arguments

0 commit comments

Comments
 (0)