fix(Storage): completely remove usage filter (#1375)

Author: artemmufazalov

src/containers/Storage/PaginatedStorage.tsx

@@ -113,7 +113,6 @@ export const PaginatedStorage = ({
                 handleVisibleEntitiesChange={handleGroupVisibilityChange}
                 nodesUptimeFilter={nodesUptimeFilter}
                 handleNodesUptimeFilterChange={handleUptimeFilterChange}
-                withGroupsUsageFilter={false}
                 entitiesCountCurrent={foundEntities}
                 entitiesCountTotal={totalEntities}
                 entitiesLoading={!inited}

src/containers/Storage/Storage.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import {ArrayParam, StringParam, useQueryParams, withDefault} from 'use-query-params';
+import {StringParam, useQueryParams} from 'use-query-params';
 
 import {AccessDenied} from '../../components/Errors/403';
 import {isAccessError} from '../../components/Errors/PageError/PageError';
@@ -13,11 +13,7 @@ import {
 import {useClusterBaseInfo} from '../../store/reducers/cluster/cluster';
 import type {NodesSortParams} from '../../store/reducers/nodes/types';
 import {VISIBLE_ENTITIES} from '../../store/reducers/storage/constants';
-import {
-    filterGroups,
-    filterNodes,
-    getUsageFilterOptions,
-} from '../../store/reducers/storage/selectors';
+import {filterGroups, filterNodes} from '../../store/reducers/storage/selectors';
 import {storageApi} from '../../store/reducers/storage/storage';
 import {storageTypeSchema, visibleEntitiesSchema} from '../../store/reducers/storage/types';
 import type {
@@ -40,23 +36,6 @@ import {defaultSortNode, getDefaultSortGroup} from './utils';
 
 import './Storage.scss';
 
-const UsageFilterParam = withDefault(
-    {
-        encode: ArrayParam.encode,
-        decode: (input) => {
-            if (input === null || input === undefined) {
-                return input;
-            }
-
-            if (!Array.isArray(input)) {
-                return input ? [input] : [];
-            }
-            return input.filter(Boolean) as string[];
-        },
-    },
-    [],
-);
-
 interface StorageProps {
     database?: string;
     nodeId?: string | number;
@@ -77,7 +56,6 @@ export const Storage = ({database, nodeId, groupId, pDiskId}: StorageProps) => {
         visible: StringParam,
         search: StringParam,
         uptimeFilter: StringParam,
-        usageFilter: UsageFilterParam,
     });
     const storageType = storageTypeSchema.parse(queryParams.type);
     const isGroups = storageType === 'groups';
@@ -86,7 +64,6 @@ export const Storage = ({database, nodeId, groupId, pDiskId}: StorageProps) => {
     const visibleEntities = visibleEntitiesSchema.parse(queryParams.visible);
     const filter = queryParams.search ?? '';
     const uptimeFilter = nodesUptimeFilterValuesSchema.parse(queryParams.uptimeFilter);
-    const usageFilter = queryParams.usageFilter;
 
     const [nodeSort, setNodeSort] = React.useState<NodesSortParams>({
         sortOrder: undefined,
@@ -157,12 +134,7 @@ export const Storage = ({database, nodeId, groupId, pDiskId}: StorageProps) => {
         () => filterNodes(nodes, filter, uptimeFilter),
         [filter, nodes, uptimeFilter],
     );
-    const storageGroups = React.useMemo(
-        () => filterGroups(groups, filter, usageFilter),
-        [filter, groups, usageFilter],
-    );
-
-    const usageFilterOptions = React.useMemo(() => getUsageFilterOptions(groups), [groups]);
+    const storageGroups = React.useMemo(() => filterGroups(groups, filter), [filter, groups]);
 
     const [nodesSort, handleNodesSort] = useTableSort(nodesSortParams, (params) =>
         setNodeSort(params as NodesSortParams),
@@ -171,10 +143,6 @@ export const Storage = ({database, nodeId, groupId, pDiskId}: StorageProps) => {
         setGroupSort(params as StorageSortParams),
     );
 
-    const handleUsageFilterChange = (value: string[]) => {
-        setQueryParams({usageFilter: value.length ? value : undefined}, 'replaceIn');
-    };
-
     const handleTextFilterChange = (value: string) => {
         setQueryParams({search: value || undefined}, 'replaceIn');
     };
@@ -248,9 +216,6 @@ export const Storage = ({database, nodeId, groupId, pDiskId}: StorageProps) => {
                 handleVisibleEntitiesChange={handleGroupVisibilityChange}
                 nodesUptimeFilter={uptimeFilter}
                 handleNodesUptimeFilterChange={handleUptimeFilterChange}
-                groupsUsageFilter={usageFilter}
-                groupsUsageFilterOptions={usageFilterOptions}
-                handleGroupsUsageFilterChange={handleUsageFilterChange}
                 entitiesCountCurrent={entitiesCountCurrent}
                 entitiesCountTotal={entitiesCount.total}
                 entitiesLoading={isLoading}

src/containers/Storage/StorageControls/StorageControls.tsx

@@ -11,8 +11,6 @@ import type {StorageType, VisibleEntities} from '../../../store/reducers/storage
 import type {NodesUptimeFilterValues} from '../../../utils/nodes';
 import {StorageTypeFilter} from '../StorageTypeFilter/StorageTypeFilter';
 import {StorageVisibleEntitiesFilter} from '../StorageVisibleEntitiesFilter/StorageVisibleEntitiesFilter';
-import {UsageFilter} from '../UsageFilter/UsageFilter';
-import type {UsageFilterItem} from '../UsageFilter/UsageFilter';
 import i18n from '../i18n';
 import {b} from '../shared';
 
@@ -30,11 +28,6 @@ interface StorageControlsProps {
     nodesUptimeFilter: NodesUptimeFilterValues;
     handleNodesUptimeFilterChange: (value: NodesUptimeFilterValues) => void;
 
-    withGroupsUsageFilter?: boolean;
-    groupsUsageFilter?: string[];
-    groupsUsageFilterOptions?: UsageFilterItem[];
-    handleGroupsUsageFilterChange?: (value: string[]) => void;
-
     entitiesCountCurrent: number;
     entitiesCountTotal?: number;
     entitiesLoading: boolean;
@@ -57,11 +50,6 @@ export const StorageControls = ({
     nodesUptimeFilter,
     handleNodesUptimeFilterChange,
 
-    withGroupsUsageFilter,
-    groupsUsageFilter,
-    groupsUsageFilterOptions,
-    handleGroupsUsageFilterChange,
-
     entitiesCountCurrent,
     entitiesCountTotal,
     entitiesLoading,
@@ -70,7 +58,6 @@ export const StorageControls = ({
     handleSelectedColumnsUpdate,
 }: StorageControlsProps) => {
     const isNodes = storageType === STORAGE_TYPES.nodes;
-    const isGroups = storageType === STORAGE_TYPES.groups;
     const entityName = isNodes ? i18n('nodes') : i18n('groups');
 
     return (
@@ -96,14 +83,6 @@ export const StorageControls = ({
             {isNodes && (
                 <UptimeFilter value={nodesUptimeFilter} onChange={handleNodesUptimeFilterChange} />
             )}
-            {isGroups && withGroupsUsageFilter && (
-                <UsageFilter
-                    value={groupsUsageFilter}
-                    onChange={handleGroupsUsageFilterChange}
-                    groups={groupsUsageFilterOptions}
-                />
-            )}
-
             <EntitiesCount
                 label={entityName}
                 loading={entitiesLoading}

src/containers/Storage/UsageFilter/UsageFilter.scss

@@ -7,7 +7,6 @@ import type {
     StorageSortParams,
     VisibleEntities,
 } from '../../../store/reducers/storage/types';
-import {EFlag} from '../../../types/api/enums';
 import {generateEvaluator} from '../../../utils/generateEvaluator';
 import {NODES_COLUMNS_IDS} from '../../Nodes/columns/constants';
 import {STORAGE_GROUPS_COLUMNS_IDS} from '../StorageGroups/columns/constants';
@@ -35,11 +34,6 @@ export const getUsageSeverityForStorageGroup = generateEvaluator(80, 85, [
     'warning',
     'danger',
 ]);
-export const getUsageSeverityForEntityStatus = generateEvaluator(80, 85, [
-    EFlag.Green,
-    EFlag.Yellow,
-    EFlag.Red,
-]);
 
 export const defaultSortNode: NodesSortParams = {
     sortValue: NODES_COLUMNS_IDS.NodeId,