From 48ac638964d94b52eb9ceebb5026bff12cae10c2 Mon Sep 17 00:00:00 2001 From: Elena Makarova Date: Wed, 3 Dec 2025 09:33:35 +0300 Subject: [PATCH 1/3] feat: save storage type in user settings --- src/containers/Storage/PaginatedStorage.tsx | 3 +- .../Storage/useStorageQueryParams.ts | 38 ++++++++++++++++--- src/store/reducers/settings/constants.ts | 3 ++ 3 files changed, 38 insertions(+), 6 deletions(-) diff --git a/src/containers/Storage/PaginatedStorage.tsx b/src/containers/Storage/PaginatedStorage.tsx index 346ba24236..7ec52b32bf 100644 --- a/src/containers/Storage/PaginatedStorage.tsx +++ b/src/containers/Storage/PaginatedStorage.tsx @@ -3,7 +3,7 @@ import {useIsUserAllowedToMakeChanges} from '../../utils/hooks/useIsUserAllowedT import {PaginatedStorageGroups} from './PaginatedStorageGroups'; import {PaginatedStorageNodes} from './PaginatedStorageNodes'; import type {StorageViewContext} from './types'; -import {useStorageQueryParams} from './useStorageQueryParams'; +import {useSaveStorageType, useStorageQueryParams} from './useStorageQueryParams'; import {getStorageGroupsInitialEntitiesCount, getStorageNodesInitialEntitiesCount} from './utils'; export interface PaginatedStorageProps { @@ -21,6 +21,7 @@ export interface PaginatedStorageProps { export const PaginatedStorage = (props: PaginatedStorageProps) => { const {storageType} = useStorageQueryParams(); + useSaveStorageType(); const isUserAllowedToMakeChanges = useIsUserAllowedToMakeChanges(); const isNodes = storageType === 'nodes'; diff --git a/src/containers/Storage/useStorageQueryParams.ts b/src/containers/Storage/useStorageQueryParams.ts index 169e60a392..c5d66d747f 100644 --- a/src/containers/Storage/useStorageQueryParams.ts +++ b/src/containers/Storage/useStorageQueryParams.ts @@ -1,9 +1,12 @@ import React from 'react'; -import {StringParam, useQueryParams} from 'use-query-params'; +import {StringParam, useQueryParam, useQueryParams} from 'use-query-params'; +import {SETTING_KEYS} from '../../store/reducers/settings/constants'; +import {STORAGE_TYPES} from '../../store/reducers/storage/constants'; import type {StorageType, VisibleEntities} from '../../store/reducers/storage/types'; import {storageTypeSchema, visibleEntitiesSchema} from '../../store/reducers/storage/types'; +import {useSetting} from '../../utils/hooks'; import {NodesUptimeFilterValues, nodesUptimeFilterValuesSchema} from '../../utils/nodes'; import {storageGroupsGroupByParamSchema} from './PaginatedStorageGroupsTable/columns/constants'; @@ -22,6 +25,11 @@ export function useStorageQueryParams() { storageGroupsGroupBy: StringParam, }); + const [_savedStorageType, setSavedStorageType] = useSetting( + SETTING_KEYS.STORAGE_TYPE, + STORAGE_TYPES.groups, + ); + const storageType = storageTypeSchema.parse(queryParams.type); const visibleEntities = visibleEntitiesSchema.parse(queryParams.visible); @@ -42,7 +50,7 @@ export function useStorageQueryParams() { patch[STORAGE_SEARCH_PARAM_BY_TYPE[storageType]] = queryParams.search; setQueryParams(patch, 'replaceIn'); } - }, [queryParams.search, storageType]); + }, [queryParams.search, storageType, setQueryParams]); const handleTextFilterGroupsChange = (value: string) => { setQueryParams({groupsSearch: value || undefined}, 'replaceIn'); @@ -56,9 +64,13 @@ export function useStorageQueryParams() { setQueryParams({visible: value}, 'replaceIn'); }; - const handleStorageTypeChange = (value: StorageType) => { - setQueryParams({type: value}, 'replaceIn'); - }; + const handleStorageTypeChange = React.useCallback( + (value: StorageType) => { + setQueryParams({type: value}, 'replaceIn'); + setSavedStorageType(value); + }, + [setQueryParams, setSavedStorageType], + ); const handleUptimeFilterChange = (value: NodesUptimeFilterValues) => { setQueryParams({uptimeFilter: value}, 'replaceIn'); @@ -103,3 +115,19 @@ export function useStorageQueryParams() { handleShowAllNodes, }; } + +export function useSaveStorageType() { + const [queryStorageType, setQueryStorageType] = useQueryParam('type', StringParam); + const [savedStorageType] = useSetting( + SETTING_KEYS.STORAGE_TYPE, + STORAGE_TYPES.groups, + ); + + const normalizedstorageType = queryStorageType ?? savedStorageType; + + React.useEffect(() => { + if (normalizedstorageType !== queryStorageType) { + setQueryStorageType(normalizedstorageType); + } + }, [normalizedstorageType, queryStorageType, setQueryStorageType]); +} diff --git a/src/store/reducers/settings/constants.ts b/src/store/reducers/settings/constants.ts index cbc1c8bed4..eff66c6f89 100644 --- a/src/store/reducers/settings/constants.ts +++ b/src/store/reducers/settings/constants.ts @@ -2,6 +2,7 @@ import type {ValueOf} from '../../../types/common'; import {AclSyntax} from '../../../utils/constants'; import {Lang} from '../../../utils/i18n'; import {DEFAULT_QUERY_SETTINGS, QUERY_ACTIONS} from '../../../utils/query'; +import {STORAGE_TYPES} from '../storage/constants'; import {TENANT_PAGES_IDS} from '../tenant/constants'; import type {SettingOptions} from './types'; @@ -36,6 +37,7 @@ export const SETTING_KEYS = { QUERY_SETTINGS_BANNER_LAST_CLOSED: 'querySettingsBannerLastClosed', QUERY_EXECUTION_SETTINGS: 'queryExecutionSettings', ACL_SYNTAX: 'aclSyntax', + STORAGE_TYPE: 'storageType', } as const; export type SettingKey = ValueOf; @@ -71,6 +73,7 @@ export const DEFAULT_USER_SETTINGS = { [SETTING_KEYS.QUERY_SETTINGS_BANNER_LAST_CLOSED]: undefined, [SETTING_KEYS.QUERY_EXECUTION_SETTINGS]: DEFAULT_QUERY_SETTINGS, [SETTING_KEYS.ACL_SYNTAX]: AclSyntax.YdbShort, + [SETTING_KEYS.STORAGE_TYPE]: STORAGE_TYPES.groups, } as const satisfies Record; export const SETTINGS_OPTIONS: Record = { From 301a2a58a68347f8d6aaab8ca6b459265ff86072 Mon Sep 17 00:00:00 2001 From: Elena Makarova Date: Wed, 3 Dec 2025 09:37:49 +0300 Subject: [PATCH 2/3] fix: ai review --- src/containers/Storage/useStorageQueryParams.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/containers/Storage/useStorageQueryParams.ts b/src/containers/Storage/useStorageQueryParams.ts index c5d66d747f..e0a01903b8 100644 --- a/src/containers/Storage/useStorageQueryParams.ts +++ b/src/containers/Storage/useStorageQueryParams.ts @@ -123,11 +123,11 @@ export function useSaveStorageType() { STORAGE_TYPES.groups, ); - const normalizedstorageType = queryStorageType ?? savedStorageType; + const normalizedStorageType = queryStorageType ?? savedStorageType; React.useEffect(() => { - if (normalizedstorageType !== queryStorageType) { - setQueryStorageType(normalizedstorageType); + if (normalizedStorageType !== queryStorageType) { + setQueryStorageType(normalizedStorageType); } - }, [normalizedstorageType, queryStorageType, setQueryStorageType]); + }, [normalizedStorageType, queryStorageType, setQueryStorageType]); } From 95d276bc238cd2e17814ee19e3126960006a45a7 Mon Sep 17 00:00:00 2001 From: Elena Makarova Date: Wed, 3 Dec 2025 09:39:42 +0300 Subject: [PATCH 3/3] fix: ai review --- src/containers/Storage/useStorageQueryParams.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/containers/Storage/useStorageQueryParams.ts b/src/containers/Storage/useStorageQueryParams.ts index e0a01903b8..dcf2ef0165 100644 --- a/src/containers/Storage/useStorageQueryParams.ts +++ b/src/containers/Storage/useStorageQueryParams.ts @@ -123,7 +123,10 @@ export function useSaveStorageType() { STORAGE_TYPES.groups, ); - const normalizedStorageType = queryStorageType ?? savedStorageType; + const normalizedStorageType = React.useMemo( + () => storageTypeSchema.parse(queryStorageType ?? savedStorageType), + [queryStorageType, savedStorageType], + ); React.useEffect(() => { if (normalizedStorageType !== queryStorageType) {