fix: rename flag for display metrics cards for database diagnostics (#536)

Author: krosy1337

src/containers/Tenant/Diagnostics/DetailedOverview/DetailedOverview.tsx

@@ -8,7 +8,7 @@ import type {EPathType} from '../../../../types/api/schema';
 import type {AdditionalTenantsProps} from '../../../../types/additionalProps';
 import {Icon} from '../../../../components/Icon';
 import {useSetting} from '../../../../utils/hooks';
-import {ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN} from '../../../../utils/constants';
+import {DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS} from '../../../../utils/constants';
 import Overview from '../Overview/Overview';
 import {Healthcheck} from '../OldHealthcheck';
 import {TenantOverview} from '../TenantOverview/TenantOverview';
@@ -32,7 +32,7 @@ function DetailedOverview(props: DetailedOverviewProps) {
 
     const {currentSchemaPath} = useSelector((state: any) => state.schema);
 
-    const [newTenantDiagnostics] = useSetting(ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN);
+    const [displayMetricsCards] = useSetting(DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS);
 
     const openModalHandler = () => {
         setIsModalVisible(true);
@@ -59,7 +59,7 @@ function DetailedOverview(props: DetailedOverviewProps) {
     };
 
     const renderTenantOverview = () => {
-        if (newTenantDiagnostics) {
+        if (displayMetricsCards) {
             return (
                 <div className={b('section')}>
                     <TenantOverview

src/containers/UserSettings/i18n/en.json

@@ -25,6 +25,6 @@
   "settings.enableAdditionalQueryModes.title": "Enable additional query modes",
   "settings.enableAdditionalQueryModes.popover": "Adds 'Data', 'YQL - QueryService' and 'PostgreSQL' modes. May not work on some versions",
 
-  "settings.tenantDiagnostics.title": "Enable new database diagnostics design",
+  "settings.tenantDiagnostics.title": "Display metrics cards for database diagnostics",
   "settings.tenantDiagnostics.popover": "Adds indicators of database resources usage. Incomplete data may be displayed for some databases"
 }

src/containers/UserSettings/i18n/ru.json

@@ -25,6 +25,6 @@
   "settings.enableAdditionalQueryModes.title": "Включить дополнительные режимы выполнения запросов",
   "settings.enableAdditionalQueryModes.popover": "Добавляет режимы 'Data', 'YQL - QueryService' и 'PostgreSQL'. Может работать некорректно на некоторых версиях",
 
-  "settings.tenantDiagnostics.title": "Включить новый дизайн для диагностики баз данных",
+  "settings.tenantDiagnostics.title": "Показывать карточки с метриками в диагностике базы данных",
   "settings.tenantDiagnostics.popover": "Добавляет индикаторы использования ресурсов базы данных. Для некоторых баз могут отображаться неполные данные"
 }

src/containers/UserSettings/settings.ts

@@ -5,7 +5,7 @@ import flaskIcon from '../../assets/icons/flask.svg';
 
 import {
     ENABLE_ADDITIONAL_QUERY_MODES,
-    ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN,
+    DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS,
     INVERTED_DISKS_KEY,
     LANGUAGE_KEY,
     THEME_KEY,
@@ -96,7 +96,7 @@ export const enableQueryModesForExplainSetting: SettingProps = {
     helpPopoverContent: i18n('settings.enableAdditionalQueryModes.popover'),
 };
 export const enableNewTenantDiagnosticsDesign: SettingProps = {
-    settingKey: ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN,
+    settingKey: DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS,
     title: i18n('settings.tenantDiagnostics.title'),
     helpPopoverContent: i18n('settings.tenantDiagnostics.popover'),
 };

src/store/reducers/settings/settings.ts

@@ -15,7 +15,7 @@ import {
     LAST_USED_QUERY_ACTION_KEY,
     USE_BACKEND_PARAMS_FOR_TABLES_KEY,
     LANGUAGE_KEY,
-    ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN,
+    DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS,
 } from '../../../utils/constants';
 import '../../../services/api';
 import {parseJson} from '../../../utils/utils';
@@ -56,8 +56,8 @@ export const initialState = {
             ENABLE_ADDITIONAL_QUERY_MODES,
             'false',
         ),
-        [ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN]: readSavedSettingsValue(
-            ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN,
+        [DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS]: readSavedSettingsValue(
+            DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS,
             'false',
         ),
         [SAVED_QUERIES_KEY]: readSavedSettingsValue(SAVED_QUERIES_KEY, '[]'),

src/utils/constants.ts

@@ -88,7 +88,8 @@ export const LANGUAGE_KEY = 'language';
 export const INVERTED_DISKS_KEY = 'invertedDisks';
 export const USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY = 'useNodesEndpointInDiagnostics';
 export const ENABLE_ADDITIONAL_QUERY_MODES = 'enableAdditionalQueryModes';
-export const ENABLE_NEW_TENANT_DIAGNOSTICS_DESIGN = 'enableNewTenantDiagnosticsDesign';
+// Remain key name "enableNewTenantDiagnosticsDesign" for backward compatibility
+export const DISPLAY_METRICS_CARDS_FOR_TENANT_DIAGNOSTICS = 'enableNewTenantDiagnosticsDesign';
 export const SAVED_QUERIES_KEY = 'saved_queries';
 export const ASIDE_HEADER_COMPACT_KEY = 'asideHeaderCompact';
 export const QUERIES_HISTORY_KEY = 'queries_history';