fix: review

src/components/MetricChart/MetricChart.tsx

@@ -133,7 +133,10 @@ export const MetricChart = ({
     onChartDataStatusChange,
     isChartVisible,
 }: DiagnosticsChartProps) => {
-    const {currentData, error, isFetching, status} = chartApi.useGetChertDataQuery(
+    const {currentData, error, isFetching, status} = chartApi.useGetChartDataQuery(
+        // maxDataPoints param is calculated based on width
+        // should be width > maxDataPoints to prevent points that cannot be selected
+        // more px per dataPoint - easier to select, less - chart is smoother
         {
             database,
             metrics,

src/components/MetricChart/reducer.ts

@@ -7,7 +7,7 @@ import i18n from './i18n';
 
 export const chartApi = api.injectEndpoints({
     endpoints: (builder) => ({
-        getChertData: builder.query({
+        getChartData: builder.query({
             queryFn: async (params: GetChartDataParams, {signal}) => {
                 try {
                     const response = await getChartData(params, {signal});

src/containers/Tenant/Diagnostics/Partitions/Partitions.tsx

@@ -5,7 +5,7 @@ import {skipToken} from '@reduxjs/toolkit/query';
 
 import {ResponseError} from '../../../../components/Errors/ResponseError';
 import {TableSkeleton} from '../../../../components/TableSkeleton/TableSkeleton';
-import {nodesListApi} from '../../../../store/reducers/nodesList';
+import {nodesListApi, selectNodesMap} from '../../../../store/reducers/nodesList';
 import {partitionsApi, setSelectedConsumer} from '../../../../store/reducers/partitions/partitions';
 import {selectConsumersNames, topicApi} from '../../../../store/reducers/topic';
 import {cn} from '../../../../utils/cn';
@@ -47,11 +47,12 @@ export const Partitions = ({path}: PartitionsProps) => {
     } = topicApi.useGetTopicQuery({path});
     const topicLoading = topicIsFetching && topicData === undefined;
     const {
-        currentData: nodesMap,
+        currentData: nodesData,
         isFetching: nodesIsFetching,
         error: nodesError,
     } = nodesListApi.useGetNodesListQuery(undefined);
-    const nodesLoading = nodesIsFetching && nodesMap === undefined;
+    const nodesLoading = nodesIsFetching && nodesData === undefined;
+    const nodesMap = useTypedSelector(selectNodesMap);
 
     const [hiddenColumns, setHiddenColumns] = useSetting<string[]>(PARTITIONS_HIDDEN_COLUMNS_KEY);
 

src/containers/Tenant/Diagnostics/TopShards/TopShards.tsx

@@ -130,12 +130,6 @@ export const TopShards = ({tenantPath, type}: TopShardsProps) => {
     const loading = isFetching && result === undefined;
     const {result: data} = result ?? {};
 
-    // don't show loader for requests triggered by table sort, only for path change
-    // React.useEffect(() => {
-    //     dispatch(shardApi.util.resetApiState());
-    //     dispatch(shardApi.util.invalidateTags(['All']));
-    // }, [dispatch, currentSchemaPath, tenantPath, filters]);
-
     const onSort = (newSortOrder?: SortOrder | SortOrder[]) => {
         // omit information about sort order to disable ASC order, only DESC makes sense for top shards
         // use a string (and not the DataTable default format) to prevent reference change,

src/store/configureStore.ts

@@ -27,10 +27,12 @@ function _configureStore<
         preloadedState,
         middleware: (getDefaultMiddleware) =>
             getDefaultMiddleware({
-                immutableCheck: {ignoredPaths: ['tooltip.currentHoveredRef']},
+                immutableCheck: {
+                    ignoredPaths: ['tooltip.currentHoveredRef'],
+                },
                 serializableCheck: {
                     ignoredPaths: ['tooltip.currentHoveredRef', 'api'],
-                    ignoredActions: [UPDATE_REF],
+                    ignoredActions: [UPDATE_REF, 'api/executeQuery/rejected'],
                 },
             }).concat(locationMiddleware, ...middleware),
     });

src/store/reducers/api.ts

@@ -9,6 +9,7 @@ export const api = createApi({
      */
     endpoints: () => ({}),
     refetchOnMountOrArgChange: true,
+    invalidationBehavior: 'immediately',
     tagTypes: ['All'],
 });
 

src/store/reducers/heatmap.ts

@@ -1,12 +1,15 @@
 import {createSlice} from '@reduxjs/toolkit';
 import type {PayloadAction} from '@reduxjs/toolkit';
 
+import type {TEvDescribeSchemeResult} from '../../types/api/schema';
+import type {TEvTabletStateResponse} from '../../types/api/tablet';
 import type {
     IHeatmapApiRequestParams,
     IHeatmapMetricValue,
     IHeatmapState,
     IHeatmapTabletData,
 } from '../../types/store/heatmap';
+import type {Nullable} from '../../utils/typecheckers';
 import type {RootState} from '../defaultStore';
 
 import {api} from './api';
@@ -71,8 +74,8 @@ export const heatmapApi = api.injectEndpoints({
 });
 
 function transformResponse([tabletsData, describe]: [
-    Awaited<ReturnType<typeof window.api.getTabletsInfo>>,
-    Awaited<ReturnType<typeof window.api.getHeatmapData>>,
+    TEvTabletStateResponse,
+    Nullable<TEvDescribeSchemeResult>,
 ]) {
     const {TabletStateInfo: tablets = []} = tabletsData;
     const TabletsMap: Map<string, IHeatmapTabletData> = new Map();

src/store/reducers/nodesList.ts

@@ -11,7 +11,7 @@ export const nodesListApi = api.injectEndpoints({
             queryFn: async (_, {signal}) => {
                 try {
                     const data = await window.api.getNodesList({signal});
-                    return {data: prepareNodesMap(data)};
+                    return {data};
                 } catch (error) {
                     return {error};
                 }
@@ -25,6 +25,6 @@ export const nodesListApi = api.injectEndpoints({
 const selectNodesList = nodesListApi.endpoints.getNodesList.select(undefined);
 
 export const selectNodesMap = createSelector(
-    (state: RootState) => selectNodesList(state),
-    (nodes) => nodes.data,
+    (state: RootState) => selectNodesList(state).data,
+    (data) => prepareNodesMap(data),
 );

src/store/reducers/schema/schema.ts

@@ -1,8 +1,10 @@
-import type {Reducer, Selector} from '@reduxjs/toolkit';
+import type {Dispatch, Reducer, Selector} from '@reduxjs/toolkit';
 import {createSelector} from '@reduxjs/toolkit';
 
 import {isEntityWithMergedImplementation} from '../../../containers/Tenant/utils/schema';
+import {settingsManager} from '../../../services/settings';
 import type {EPathType} from '../../../types/api/schema';
+import {AUTO_REFRESH_INTERVAL} from '../../../utils/constants';
 import {createApiRequest, createRequestActionTypes} from '../../utils';
 
 import type {
@@ -17,15 +19,17 @@ export const FETCH_SCHEMA = createRequestActionTypes('schema', 'FETCH_SCHEMA');
 const PRELOAD_SCHEMAS = 'schema/PRELOAD_SCHEMAS';
 const SET_SCHEMA = 'schema/SET_SCHEMA';
 const SET_SHOW_PREVIEW = 'schema/SET_SHOW_PREVIEW';
-const SET_AUTOREFRESH_INTERVAL = 'schema/SET_AUTOREFRESH_INTERVAL';
+export const SET_AUTOREFRESH_INTERVAL = 'schema/SET_AUTOREFRESH_INTERVAL';
 const RESET_LOADING_STATE = 'schema/RESET_LOADING_STATE';
 
+const autoRefreshLS = Number(settingsManager.readUserSettingsValue(AUTO_REFRESH_INTERVAL, 0));
+
 export const initialState = {
     loading: true,
     wasLoaded: false,
     data: {},
     currentSchemaPath: undefined,
-    autorefresh: 0,
+    autorefresh: isNaN(autoRefreshLS) ? 0 : autoRefreshLS,
     showPreview: false,
 };
 
@@ -136,10 +140,13 @@ export function setCurrentSchemaPath(currentSchemaPath: string) {
     } as const;
 }
 export function setAutorefreshInterval(interval: number) {
-    return {
-        type: SET_AUTOREFRESH_INTERVAL,
-        data: interval,
-    } as const;
+    return (dispatch: Dispatch) => {
+        settingsManager.setUserSettingsValue(AUTO_REFRESH_INTERVAL, interval);
+        dispatch({
+            type: SET_AUTOREFRESH_INTERVAL,
+            data: interval,
+        } as const);
+    };
 }
 export function setShowPreview(value: boolean) {
     return {

src/store/reducers/schema/types.ts

@@ -4,9 +4,9 @@ import type {ApiRequestAction} from '../../utils';
 
 import type {
     FETCH_SCHEMA,
+    SET_AUTOREFRESH_INTERVAL,
     preloadSchemas,
     resetLoadingState,
-    setAutorefreshInterval,
     setCurrentSchemaPath,
     setShowPreview,
 } from './schema';
@@ -40,7 +40,7 @@ export type SchemaAction =
     | SchemaApiRequestAction
     | (
           | ReturnType<typeof setCurrentSchemaPath>
-          | ReturnType<typeof setAutorefreshInterval>
+          | {type: typeof SET_AUTOREFRESH_INTERVAL; data: number}
           | ReturnType<typeof setShowPreview>
           | ReturnType<typeof preloadSchemas>
           | ReturnType<typeof resetLoadingState>

src/utils/constants.ts

@@ -89,6 +89,7 @@ export const ASIDE_HEADER_COMPACT_KEY = 'asideHeaderCompact';
 export const QUERIES_HISTORY_KEY = 'queries_history';
 export const DATA_QA_TUNE_COLUMNS_POPUP = 'tune-columns-popup';
 export const BINARY_DATA_IN_PLAIN_TEXT_DISPLAY = 'binaryDataInPlainTextDisplay';
+export const AUTO_REFRESH_INTERVAL = 'auto-refresh-interval';
 
 export const DEFAULT_SIZE_RESULT_PANE_KEY = 'default-size-result-pane';
 export const DEFAULT_SIZE_TENANT_SUMMARY_KEY = 'default-size-tenant-summary-pane';