fix: do not display Developer UI link for viewers

Author: artemmufazalov

src/components/PDiskInfo/PDiskInfo.tsx

@@ -5,6 +5,7 @@ import {cn} from '../../utils/cn';
 import {formatStorageValuesToGb} from '../../utils/dataFormatters/dataFormatters';
 import {createPDiskDeveloperUILink} from '../../utils/developerUI/developerUI';
 import type {PreparedPDisk} from '../../utils/disks/types';
+import {useTypedSelector} from '../../utils/hooks';
 import {EntityStatus} from '../EntityStatus/EntityStatus';
 import type {InfoViewerItem} from '../InfoViewer';
 import {InfoViewer} from '../InfoViewer/InfoViewer';
@@ -21,12 +22,15 @@ interface GetPDiskInfoOptions<T extends PreparedPDisk> {
     pDisk?: T;
     nodeId?: number | string | null;
     isPDiskPage?: boolean;
+    isUserAllowedToMakeChanges?: boolean;
 }
 
+// eslint-disable-next-line complexity
 function getPDiskInfo<T extends PreparedPDisk>({
     pDisk,
     nodeId,
     isPDiskPage = false,
+    isUserAllowedToMakeChanges,
 }: GetPDiskInfoOptions<T>) {
     const {
         PDiskId,
@@ -142,7 +146,12 @@ function getPDiskInfo<T extends PreparedPDisk>({
 
     const additionalInfo: InfoViewerItem[] = [];
 
-    if (valueIsDefined(PDiskId) && valueIsDefined(nodeId)) {
+    const shouldDisplayLinks =
+        (!isPDiskPage || isUserAllowedToMakeChanges) &&
+        valueIsDefined(PDiskId) &&
+        valueIsDefined(nodeId);
+
+    if (shouldDisplayLinks) {
         const pDiskPagePath = getPDiskPagePath(PDiskId, nodeId);
         const pDiskInternalViewerPath = createPDiskDeveloperUILink({
             nodeId,
@@ -160,10 +169,12 @@ function getPDiskInfo<T extends PreparedPDisk>({
                             external={false}
                         />
                     )}
-                    <LinkWithIcon
-                        title={pDiskInfoKeyset('developer-ui')}
-                        url={pDiskInternalViewerPath}
-                    />
+                    {isUserAllowedToMakeChanges && (
+                        <LinkWithIcon
+                            title={pDiskInfoKeyset('developer-ui')}
+                            url={pDiskInternalViewerPath}
+                        />
+                    )}
                 </span>
             ),
         });
@@ -182,21 +193,24 @@ export function PDiskInfo<T extends PreparedPDisk>({
     isPDiskPage = false,
     className,
 }: PDiskInfoProps<T>) {
+    const {isUserAllowedToMakeChanges} = useTypedSelector((state) => state.authentication);
+
     const [generalInfo, statusInfo, spaceInfo, additionalInfo] = getPDiskInfo({
         pDisk,
         nodeId,
         isPDiskPage,
+        isUserAllowedToMakeChanges,
     });
 
     return (
         <div className={b('wrapper', className)}>
             <div className={b('col')}>
-                <InfoViewer info={generalInfo} />
-                <InfoViewer info={spaceInfo} />
+                <InfoViewer info={generalInfo} renderEmptyState={() => null} />
+                <InfoViewer info={spaceInfo} renderEmptyState={() => null} />
             </div>
             <div className={b('col')}>
-                <InfoViewer info={statusInfo} />
-                <InfoViewer info={additionalInfo} />
+                <InfoViewer info={statusInfo} renderEmptyState={() => null} />
+                <InfoViewer info={additionalInfo} renderEmptyState={() => null} />
             </div>
         </div>
     );

src/store/reducers/pdisk/utils.ts

@@ -1,7 +1,7 @@
 import type {TPDiskInfoResponse} from '../../../types/api/pdisk';
 import type {TStorageInfo} from '../../../types/api/storage';
 import type {TEvSystemStateResponse} from '../../../types/api/systemState';
-import {getArray} from '../../../utils';
+import {getArray, valueIsDefined} from '../../../utils';
 import {preparePDiskData, prepareVDiskData} from '../../../utils/disks/prepareDisks';
 import {prepareNodeSystemState} from '../../../utils/nodes';
 import type {PreparedStorageGroup} from '../storage/types';
@@ -29,18 +29,22 @@ export function preparePDiskDataResponse([pdiskResponse = {}, nodeResponse]: [
         EnforcedDynamicSlotSize,
     } = preparedPDisk;
 
-    const logSlot: SlotItem<'log'> = {
-        SlotType: 'log',
-        Used: Number(LogUsedSize),
-        Total: Number(LogTotalSize),
-        UsagePercent: (Number(LogUsedSize) * 100) / Number(LogTotalSize),
-        Severity: 1,
-        SlotData: {
-            LogUsedSize,
-            LogTotalSize,
-            SystemSize,
-        },
-    };
+    let logSlot: SlotItem<'log'> | undefined;
+
+    if (valueIsDefined(LogTotalSize)) {
+        logSlot = {
+            SlotType: 'log',
+            Used: Number(LogUsedSize),
+            Total: Number(LogTotalSize),
+            UsagePercent: (Number(LogUsedSize) * 100) / Number(LogTotalSize),
+            Severity: 1,
+            SlotData: {
+                LogUsedSize,
+                LogTotalSize,
+                SystemSize,
+            },
+        };
+    }
 
     const preparedVDisks = WhiteboardVDisksData.map(prepareVDiskData).sort(
         (disk1, disk2) => Number(disk2.VDiskSlotId) - Number(disk1.VDiskSlotId),
@@ -87,7 +91,11 @@ export function preparePDiskDataResponse([pdiskResponse = {}, nodeResponse]: [
         });
     }
 
-    const diskSlots = [logSlot, ...vdisksSlots, ...emptySlots];
+    const diskSlots: PDiskData['SlotItems'] = [...vdisksSlots, ...emptySlots];
+
+    if (logSlot) {
+        diskSlots.unshift(logSlot);
+    }
 
     const rawNode = nodeResponse.SystemStateInfo?.[0];
     const preparedNode = prepareNodeSystemState(rawNode);