fix: rename Internal Viewer to Developer UI (#423)

Author: artemmufazalov

src/containers/Cluster/ClusterInfo/ClusterInfo.tsx

@@ -18,7 +18,7 @@ import type {TClusterInfo} from '../../../types/api/cluster';
 import {backend, customBackend} from '../../../store';
 import {formatStorageValues} from '../../../utils';
 import {useSetting, useTypedSelector} from '../../../utils/hooks';
-import {CLUSTER_INFO_HIDDEN_KEY} from '../../../utils/constants';
+import {CLUSTER_INFO_HIDDEN_KEY, DEVELOPER_UI} from '../../../utils/constants';
 
 import {VersionsBar} from '../VersionsBar/VersionsBar';
 import {ClusterInfoSkeleton} from '../ClusterInfoSkeleton/ClusterInfoSkeleton';
@@ -141,7 +141,7 @@ export const ClusterInfo = ({
     const {info = [], links = []} = additionalClusterProps;
 
     const clusterInfo = getInfo(cluster, versionsValues, info, [
-        {title: 'Internal Viewer', url: internalLink},
+        {title: DEVELOPER_UI, url: internalLink},
         ...links,
     ]);
 

src/containers/Header/Header.tsx

@@ -8,6 +8,7 @@ import {ExternalLinkWithIcon} from '../../components/ExternalLinkWithIcon/Extern
 import {backend, customBackend} from '../../store';
 import {HeaderItemType} from '../../store/reducers/header';
 import {useTypedSelector} from '../../utils/hooks';
+import {DEVELOPER_UI} from '../../utils/constants';
 
 import './Header.scss';
 
@@ -49,7 +50,7 @@ function Header() {
                 </div>
 
                 <ExternalLinkWithIcon
-                    title={'Internal Viewer'}
+                    title={DEVELOPER_UI}
                     url={getInternalLink(singleClusterMode)}
                 />
             </header>

src/containers/Tablet/Tablet.tsx

@@ -10,6 +10,7 @@ import {setHeader} from '../../store/reducers/header';
 import routes, {createHref} from '../../routes';
 
 import {useAutofetcher, useTypedSelector} from '../../utils/hooks';
+import {DEVELOPER_UI} from '../../utils/constants';
 import '../../services/api';
 
 import EntityStatus from '../../components/EntityStatus/EntityStatus';
@@ -114,7 +115,7 @@ export const Tablet = () => {
 
     const externalLinks = [
         {
-            name: 'Internal viewer - tablet',
+            name: `${DEVELOPER_UI} - tablet`,
             path: `/tablets?TabletID=${TabletId}`,
         },
     ];

src/store/reducers/topic.ts

@@ -35,7 +35,7 @@ const topic: Reducer<ITopicState, ITopicAction> = (state = initialState, action)
             };
         }
         case FETCH_TOPIC.SUCCESS: {
-            // On older version it can return HTML page of Internal Viewer with an error
+            // On older version it can return HTML page of Developer UI with an error
             if (typeof action.data !== 'object') {
                 return {...state, loading: false, error: {}};
             }

src/utils/constants.ts

@@ -75,6 +75,8 @@ export const COLORS_PRIORITY = {
     grey: 1,
 };
 
+export const DEVELOPER_UI = 'Developer UI';
+
 export const THEME_KEY = 'theme';
 export const INVERTED_DISKS_KEY = 'invertedDisks';
 export const USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY = 'useNodesEndpointInDiagnostics';

tests/suites/internalViewer/internalViewer.test.ts

@@ -3,7 +3,7 @@ import {test, expect} from '@playwright/test';
 test.describe('Test InternalViewer', async () => {
     test('Test internalViewer header link', async ({page}) => {
         page.goto('');
-        const link = page.locator('header').locator('a').getByText('Internal Viewer');
+        const link = page.locator('header').locator('a').getByText('Developer UI');
         const href = await link.getAttribute('href');
 
         expect(href).not.toBeNull();