Skip to content

Commit 73a104e

Browse files
artemmufazalovartemmufazalov
authored
fix: problem filter to query (#3047)
1 parent 351dbfb commit 73a104e

File tree

28 files changed

+227
-270
lines changed

28 files changed

+227
-270
lines changed

‎src/components/ProblemFilter/ProblemFilter.tsx‎

Lines changed: 23 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,35 @@
1+
import React from 'react';
2+
13
import {SegmentedRadioGroup} from '@gravity-ui/uikit';
24

3-
import {ProblemFilterValues} from '../../store/reducers/settings/settings';
4-
import type {ProblemFilterValue} from '../../store/reducers/settings/types';
5+
import i18n from './i18n';
56

67
interface ProblemFilterProps {
7-
value: ProblemFilterValue;
8-
onChange: (value: ProblemFilterValue) => void;
8+
value: boolean;
9+
onChange: (value: boolean) => void;
910
className?: string;
1011
}
1112

12-
export const ProblemFilter = ({value, onChange, className}: ProblemFilterProps) => {
13+
export function ProblemFilter({value, onChange, className}: ProblemFilterProps) {
14+
const handleValueChange = React.useCallback(
15+
(value: string) => {
16+
onChange(value === 'true');
17+
},
18+
[onChange],
19+
);
20+
1321
return (
14-
<SegmentedRadioGroup value={value} onUpdate={onChange} className={className}>
15-
<SegmentedRadioGroup.Option value={ProblemFilterValues.ALL}>
16-
{ProblemFilterValues.ALL}
22+
<SegmentedRadioGroup
23+
value={value.toString()}
24+
onUpdate={handleValueChange}
25+
className={className}
26+
>
27+
<SegmentedRadioGroup.Option value={'false'}>
28+
{i18n('value_all')}
1729
</SegmentedRadioGroup.Option>
18-
<SegmentedRadioGroup.Option value={ProblemFilterValues.PROBLEMS}>
19-
{ProblemFilterValues.PROBLEMS}
30+
<SegmentedRadioGroup.Option value={'true'}>
31+
{i18n('value_with-problems')}
2032
</SegmentedRadioGroup.Option>
2133
</SegmentedRadioGroup>
2234
);
23-
};
35+
}

‎src/components/ProblemFilter/i18n/en.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"value_all": "All",
3+
"value_with-problems": "With problems"
4+
}

‎src/components/ProblemFilter/i18n/index.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import {registerKeysets} from '../../../utils/i18n';
2+
3+
import en from './en.json';
4+
5+
const COMPONENT = 'ydb-problem-filter';
6+
7+
export default registerKeysets(COMPONENT, {en});

‎src/components/ProblemFilter/index.ts‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎src/containers/Nodes/NodesControls/NodesControls.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,13 @@ import React from 'react';
33
import {Select, Text} from '@gravity-ui/uikit';
44

55
import {EntitiesCount} from '../../../components/EntitiesCount';
6-
import {ProblemFilter} from '../../../components/ProblemFilter';
6+
import {ProblemFilter} from '../../../components/ProblemFilter/ProblemFilter';
77
import {Search} from '../../../components/Search';
88
import {UptimeFilter} from '../../../components/UptimeFIlter';
99
import {
1010
useViewerNodesHandlerHasGroupingBySystemState,
1111
useViewerNodesHandlerHasNetworkStats,
1212
} from '../../../store/reducers/capabilities/hooks';
13-
import {useProblemFilter} from '../../../store/reducers/settings/hooks';
1413
import type {NodesGroupByField} from '../../../types/api/nodes';
1514
import {useIsViewerUser} from '../../../utils/hooks/useIsUserAllowedToMakeChanges';
1615
import {PeerRoleFilter} from '../PeerRoleFilter/PeerRoleFilter';
@@ -45,13 +44,14 @@ export function NodesControls({
4544
uptimeFilter,
4645
peerRoleFilter,
4746
groupByParam,
47+
withProblems,
4848

4949
handleSearchQueryChange,
5050
handleUptimeFilterChange,
5151
handlePeerRoleFilterChange,
5252
handleGroupByParamChange,
53+
handleWithProblemsChange,
5354
} = useNodesPageQueryParams(groupByParams, withPeerRoleFilter);
54-
const {problemFilter, handleProblemFilterChange} = useProblemFilter();
5555
const isViewerUser = useIsViewerUser();
5656

5757
const systemStateGroupingAvailable = useViewerNodesHandlerHasGroupingBySystemState();
@@ -73,7 +73,7 @@ export function NodesControls({
7373
value={searchValue}
7474
/>
7575
{systemStateGroupingAvailable && withGroupBySelect ? null : (
76-
<ProblemFilter value={problemFilter} onChange={handleProblemFilterChange} />
76+
<ProblemFilter value={withProblems} onChange={handleWithProblemsChange} />
7777
)}
7878
{withGroupBySelect ? null : (
7979
<UptimeFilter value={uptimeFilter} onChange={handleUptimeFilterChange} />

‎src/containers/Nodes/NodesTable.tsx‎

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import {ResizeablePaginatedTable} from '../../components/PaginatedTable';
66
import {NODES_COLUMNS_WIDTH_LS_KEY} from '../../components/nodesColumns/constants';
77
import type {NodesColumn} from '../../components/nodesColumns/types';
88
import type {NodesFilters} from '../../store/reducers/nodes/types';
9-
import type {ProblemFilterValue} from '../../store/reducers/settings/types';
109
import type {PreparedStorageNode} from '../../store/reducers/storage/types';
1110
import type {NodesGroupByField, NodesPeerRole} from '../../types/api/nodes';
1211
import {NodesUptimeFilterValues} from '../../utils/nodes';
@@ -22,7 +21,7 @@ interface NodesTableProps {
2221
databaseFullPath?: string;
2322

2423
searchValue: string;
25-
problemFilter: ProblemFilterValue;
24+
withProblems: boolean;
2625
uptimeFilter: NodesUptimeFilterValues;
2726
peerRoleFilter?: NodesPeerRole;
2827

@@ -42,7 +41,7 @@ export function NodesTable({
4241
database,
4342
databaseFullPath,
4443
searchValue,
45-
problemFilter,
44+
withProblems,
4645
uptimeFilter,
4746
peerRoleFilter,
4847
filterGroup,
@@ -58,7 +57,7 @@ export function NodesTable({
5857
databaseFullPath,
5958
database,
6059
searchValue,
61-
problemFilter,
60+
withProblems,
6261
uptimeFilter,
6362
peerRoleFilter,
6463
filterGroup,
@@ -69,15 +68,15 @@ export function NodesTable({
6968
databaseFullPath,
7069
database,
7170
searchValue,
72-
problemFilter,
71+
withProblems,
7372
uptimeFilter,
7473
peerRoleFilter,
7574
filterGroup,
7675
filterGroupBy,
7776
]);
7877

7978
const renderEmptyDataMessage = () => {
80-
if (problemFilter !== 'All' || uptimeFilter !== NodesUptimeFilterValues.All) {
79+
if (withProblems || uptimeFilter !== NodesUptimeFilterValues.All) {
8180
return <Illustration name="thumbsUp" width={200} />;
8281
}
8382

‎src/containers/Nodes/PaginatedNodes/GroupedNodesComponent.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ const NodeGroup = React.memo(function NodeGroup({
7171
databaseFullPath={databaseFullPath}
7272
database={database}
7373
searchValue={searchValue}
74-
problemFilter={'All'}
74+
withProblems={false}
7575
uptimeFilter={NodesUptimeFilterValues.All}
7676
peerRoleFilter={peerRoleFilter}
7777
filterGroup={name}

‎src/containers/Nodes/PaginatedNodes/NodesComponent.tsx‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import {NODES_COLUMNS_TITLES} from '../../../components/nodesColumns/constants';
77
import type {NodesColumnId} from '../../../components/nodesColumns/constants';
88
import type {NodesColumn} from '../../../components/nodesColumns/types';
99
import {useViewerNodesHandlerHasGrouping} from '../../../store/reducers/capabilities/hooks';
10-
import {useProblemFilter} from '../../../store/reducers/settings/hooks';
1110
import type {PreparedStorageNode} from '../../../store/reducers/storage/types';
1211
import type {NodesGroupByField} from '../../../types/api/nodes';
1312
import {useSelectedColumns} from '../../../utils/hooks/useSelectedColumns';
@@ -43,11 +42,10 @@ export function NodesComponent({
4342
groupByParams,
4443
onDataFetched,
4544
}: NodesComponentProps) {
46-
const {searchValue, uptimeFilter, peerRoleFilter} = useNodesPageQueryParams(
45+
const {searchValue, uptimeFilter, peerRoleFilter, withProblems} = useNodesPageQueryParams(
4746
groupByParams,
4847
withPeerRoleFilter,
4948
);
50-
const {problemFilter} = useProblemFilter();
5149
const viewerNodesHandlerHasGrouping = useViewerNodesHandlerHasGrouping();
5250

5351
const {columnsToShow, columnsToSelect, setColumns} = useSelectedColumns(
@@ -81,7 +79,7 @@ export function NodesComponent({
8179
database={database}
8280
databaseFullPath={databaseFullPath}
8381
searchValue={searchValue}
84-
problemFilter={problemFilter}
82+
withProblems={withProblems}
8583
uptimeFilter={uptimeFilter}
8684
peerRoleFilter={peerRoleFilter}
8785
columns={columnsToShow}
@@ -91,7 +89,7 @@ export function NodesComponent({
9189
}
9290
tableWrapperProps={{
9391
scrollContainerRef,
94-
scrollDependencies: [searchValue, problemFilter, uptimeFilter, peerRoleFilter],
92+
scrollDependencies: [searchValue, withProblems, uptimeFilter, peerRoleFilter],
9593
}}
9694
/>
9795
);

‎src/containers/Nodes/PaginatedNodes/PaginatedNodes.tsx‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import {
88
useCapabilitiesLoaded,
99
useViewerNodesHandlerHasGrouping,
1010
} from '../../../store/reducers/capabilities/hooks';
11-
import {useProblemFilter} from '../../../store/reducers/settings/hooks';
1211
import type {PreparedStorageNode} from '../../../store/reducers/storage/types';
1312
import type {NodesGroupByField} from '../../../types/api/nodes';
1413
import {NodesUptimeFilterValues} from '../../../utils/nodes';
@@ -34,12 +33,13 @@ export interface PaginatedNodesProps {
3433
}
3534

3635
export function PaginatedNodes(props: PaginatedNodesProps) {
37-
const {uptimeFilter, groupByParam, handleUptimeFilterChange} = useNodesPageQueryParams(
38-
props.groupByParams,
39-
props.withPeerRoleFilter,
40-
);
41-
42-
const {problemFilter, handleProblemFilterChange} = useProblemFilter();
36+
const {
37+
uptimeFilter,
38+
groupByParam,
39+
withProblems,
40+
handleUptimeFilterChange,
41+
handleWithProblemsChange,
42+
} = useNodesPageQueryParams(props.groupByParams, props.withPeerRoleFilter);
4343

4444
const capabilitiesLoaded = useCapabilitiesLoaded();
4545
const viewerNodesHandlerHasGrouping = useViewerNodesHandlerHasGrouping();
@@ -49,15 +49,15 @@ export function PaginatedNodes(props: PaginatedNodesProps) {
4949
React.useEffect(() => {
5050
if (
5151
viewerNodesHandlerHasGrouping &&
52-
(problemFilter !== 'All' || uptimeFilter !== NodesUptimeFilterValues.All)
52+
(withProblems || uptimeFilter !== NodesUptimeFilterValues.All)
5353
) {
54-
handleProblemFilterChange('All');
54+
handleWithProblemsChange(false);
5555
handleUptimeFilterChange(NodesUptimeFilterValues.All);
5656
}
5757
}, [
58-
handleProblemFilterChange,
58+
handleWithProblemsChange,
5959
handleUptimeFilterChange,
60-
problemFilter,
60+
withProblems,
6161
uptimeFilter,
6262
viewerNodesHandlerHasGrouping,
6363
]);

‎src/containers/Nodes/getNodes.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import type {PreparedStorageNode} from '../../store/reducers/storage/types';
1010
import {prepareStorageNodesResponse} from '../../store/reducers/storage/utils';
1111
import type {NodesRequestParams} from '../../types/api/nodes';
1212
import {prepareSortValue} from '../../utils/filters';
13-
import {getProblemParamValue, getUptimeParamValue} from '../../utils/nodes';
13+
import {getUptimeParamValue} from '../../utils/nodes';
1414
import {getRequiredDataFields} from '../../utils/tableUtils/getRequiredDataFields';
1515

1616
export const getNodes: FetchData<
@@ -26,7 +26,7 @@ export const getNodes: FetchData<
2626
databaseFullPath,
2727
database,
2828
searchValue,
29-
problemFilter,
29+
withProblems,
3030
uptimeFilter,
3131
peerRoleFilter,
3232
filterGroup,
@@ -50,7 +50,7 @@ export const getNodes: FetchData<
5050
path: schemePathParam,
5151
database,
5252
filter: searchValue,
53-
problems_only: getProblemParamValue(problemFilter),
53+
problems_only: withProblems,
5454
uptime: getUptimeParamValue(uptimeFilter),
5555
filter_peer_role: peerRoleFilter,
5656
filter_group: filterGroup,

0 commit comments

Comments
 (0)