Skip to content

Commit d8c355b

Browse files
astandrikastandrik
committed
fix: review fixes
1 parent a94b77f commit d8c355b

File tree

5 files changed

+76
-63
lines changed

5 files changed

+76
-63
lines changed

‎src/containers/Tenant/Query/QuerySettingsDialog/QuerySettingsTimeout.scss‎

Lines changed: 0 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -14,30 +14,4 @@
1414

1515
color: var(--g-color-text-secondary);
1616
}
17-
18-
&__switch {
19-
align-items: center;
20-
21-
height: var(--g-text-header-2-line-height);
22-
margin-right: var(--g-spacing-1);
23-
}
24-
25-
&__label-title,
26-
&__switch-title {
27-
flex: 4;
28-
align-items: center;
29-
30-
margin-right: var(--g-spacing-3);
31-
32-
font-weight: 500;
33-
white-space: nowrap;
34-
}
35-
36-
&__label-title {
37-
line-height: var(--g-text-header-2-line-height);
38-
}
39-
40-
&__question-icon {
41-
color: var(--g-color-text-secondary);
42-
}
4317
}

‎src/containers/Tenant/Query/QuerySettingsDialog/QuerySettingsTimeout.tsx‎

Lines changed: 3 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,10 @@
11
import React from 'react';
22

3-
import {CircleQuestion} from '@gravity-ui/icons';
4-
import {Icon, Popover, Switch, TextInput} from '@gravity-ui/uikit';
3+
import {TextInput} from '@gravity-ui/uikit';
54

65
import {cn} from '../../../../utils/cn';
7-
import {ENABLE_QUERY_STREAMING} from '../../../../utils/constants';
8-
import {useSetting} from '../../../../utils/hooks';
96

10-
import {QUERY_SETTINGS_FIELD_SETTINGS} from './constants';
7+
import {TimeoutLabel} from './TimeoutLabel';
118
import i18n from './i18n';
129

1310
import './QuerySettingsTimeout.scss';
@@ -33,8 +30,6 @@ export function QuerySettingsTimeout({
3330
errorMessage,
3431
isDisabled,
3532
}: QuerySettingsTimeoutProps) {
36-
const [isQueryStreamingEnabled] = useSetting(ENABLE_QUERY_STREAMING);
37-
3833
const handleValueChange = React.useCallback(
3934
(event: React.ChangeEvent<HTMLInputElement>) => {
4035
const newValue = event.target.value ? Number(event.target.value) : undefined;
@@ -45,35 +40,9 @@ export function QuerySettingsTimeout({
4540

4641
const isChecked = value !== null;
4742

48-
const queryStreamingLabel = isQueryStreamingEnabled ? (
49-
<div className={b('switch-title')}>
50-
<Switch
51-
disabled={isDisabled}
52-
checked={isChecked}
53-
onUpdate={onToggle}
54-
className={b('switch')}
55-
content={QUERY_SETTINGS_FIELD_SETTINGS.timeout.title}
56-
/>
57-
{isDisabled ? (
58-
<Popover
59-
content={i18n('form.timeout.disabled')}
60-
placement={'bottom-start'}
61-
hasArrow={false}
62-
size="s"
63-
>
64-
<Icon className={b('question-icon')} data={CircleQuestion} />
65-
</Popover>
66-
) : null}
67-
</div>
68-
) : (
69-
<label htmlFor="timeout" className={b('label-title')}>
70-
{QUERY_SETTINGS_FIELD_SETTINGS.timeout.title}
71-
</label>
72-
);
73-
7443
return (
7544
<React.Fragment>
76-
{queryStreamingLabel}
45+
<TimeoutLabel isDisabled={isDisabled} isChecked={isChecked} onToggle={onToggle} />
7746
{isChecked && (
7847
<div className={b('control-wrapper')}>
7948
<TextInput

‎src/containers/Tenant/Query/QuerySettingsDialog/TimeoutLabel.scss‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
.ydb-timeout-label {
2+
&__switch {
3+
align-items: center;
4+
5+
height: var(--g-text-header-2-line-height);
6+
margin-right: var(--g-spacing-1);
7+
}
8+
9+
&__label-title,
10+
&__switch-title {
11+
flex: 4;
12+
align-items: center;
13+
14+
margin-right: var(--g-spacing-3);
15+
16+
font-weight: 500;
17+
white-space: nowrap;
18+
}
19+
20+
&__label-title {
21+
line-height: var(--g-text-header-2-line-height);
22+
}
23+
}

‎src/containers/Tenant/Query/QuerySettingsDialog/TimeoutLabel.tsx‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import {HelpMark, Switch} from '@gravity-ui/uikit';
2+
3+
import {cn} from '../../../../utils/cn';
4+
import {ENABLE_QUERY_STREAMING} from '../../../../utils/constants';
5+
import {useSetting} from '../../../../utils/hooks';
6+
7+
import {QUERY_SETTINGS_FIELD_SETTINGS} from './constants';
8+
import i18n from './i18n';
9+
10+
import './TimeoutLabel.scss';
11+
12+
const b = cn('ydb-timeout-label');
13+
14+
interface TimeoutLabelProps {
15+
isDisabled?: boolean;
16+
isChecked: boolean;
17+
onToggle: (enabled: boolean) => void;
18+
}
19+
20+
export function TimeoutLabel({isDisabled, isChecked, onToggle}: TimeoutLabelProps) {
21+
const [isQueryStreamingEnabled] = useSetting<boolean>(ENABLE_QUERY_STREAMING);
22+
23+
if (isQueryStreamingEnabled) {
24+
return (
25+
<div className={b('switch-title')}>
26+
<Switch
27+
disabled={isDisabled}
28+
checked={isChecked}
29+
onUpdate={onToggle}
30+
className={b('switch')}
31+
content={QUERY_SETTINGS_FIELD_SETTINGS.timeout.title}
32+
/>
33+
{isDisabled && (
34+
<HelpMark className={b('question-icon')} placement="bottom-start">
35+
{i18n('form.timeout.disabled')}
36+
</HelpMark>
37+
)}
38+
</div>
39+
);
40+
}
41+
42+
return (
43+
<label htmlFor="timeout" className={b('label-title')}>
44+
{QUERY_SETTINGS_FIELD_SETTINGS.timeout.title}
45+
</label>
46+
);
47+
}

‎tests/suites/tenant/queryEditor/models/SettingsDialog.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -38,10 +38,10 @@ export class SettingsDialog {
3838
this.limitRowsErrorPopover = this.page.locator('.g-popover__tooltip-content');
3939
this.selectPopup = page.locator('.ydb-query-settings-select__popup');
4040
this.timeoutInput = this.dialog.locator('.ydb-query-settings-timeout__input');
41-
this.timeoutSwitch = this.dialog.locator('.ydb-query-settings-timeout__switch');
42-
this.timeoutSwitchHint = this.dialog.locator('.ydb-query-settings-timeout__question-icon');
41+
this.timeoutSwitch = this.dialog.locator('.ydb-timeout-label__switch');
42+
this.timeoutSwitchHint = this.dialog.locator('.ydb-timeout-label__question-icon');
4343
this.timeoutHintPopover = this.page.locator('.g-popover__tooltip-content');
44-
this.timeoutLabel = this.dialog.locator('.ydb-query-settings-timeout__label-title');
44+
this.timeoutLabel = this.dialog.locator('.ydb-timeout-label__label-title');
4545

4646
// Define distinct locators for selects
4747
this.queryModeSelect = this.dialog.locator(

0 commit comments

Comments
 (0)