ydb-embedded-ui 1.2.6 → 1.3.0

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [1.3.0](https://www.github.com/ydb-platform/ydb-embedded-ui/compare/v1.2.6...v1.3.0) (2022-05-12)
+
+
+### Features
+
+* **Storage:** red progress bars for unavailable disks ([17cf94d](https://www.github.com/ydb-platform/ydb-embedded-ui/commit/17cf94defb23681bc62c768d3282eed00c7e974d))
+
 ### [1.2.6](https://www.github.com/ydb-platform/ydb-embedded-ui/compare/v1.2.5...v1.2.6) (2022-05-05)
 
 

package/dist/containers/Storage/Pdisk/Pdisk.tsx

@@ -13,6 +13,8 @@ import DiskStateProgressBar, {
 } from '../DiskStateProgressBar/DiskStateProgressBar';
 import {STRUCTURE} from '../../Node/NodePages';
 
+import {colorSeverity, NOT_AVAILABLE_SEVERITY} from '../utils';
+
 import './Pdisk.scss';
 
 const b = cn('pdisk-storage');
@@ -34,14 +36,6 @@ const stateSeverity = {
     DeviceIoError: 5,
 };
 
-const colorSeverity = {
-    Grey: 0,
-    Green: 1,
-    Blue: 2,
-    Yellow: 3,
-    Orange: 4,
-    Red: 5,
-};
 type PDiskState = keyof typeof stateSeverity;
 
 interface PDiskProps {
@@ -57,7 +51,7 @@ interface PDiskProps {
 }
 
 const getStateSeverity = (pDiskState?: PDiskState) => {
-    return pDiskState ? stateSeverity[pDiskState] : colorSeverity.Grey;
+    return pDiskState ? stateSeverity[pDiskState] : NOT_AVAILABLE_SEVERITY;
 };
 
 function Pdisk(props: PDiskProps) {

package/dist/containers/Storage/Vdisk/Vdisk.js

@@ -12,6 +12,8 @@ import DiskStateProgressBar, {
 } from '../DiskStateProgressBar/DiskStateProgressBar';
 import {STRUCTURE} from '../../Node/NodePages';
 
+import {colorSeverity, NOT_AVAILABLE_SEVERITY} from '../utils';
+
 import './Vdisk.scss';
 
 const b = cn('vdisk-storage');
@@ -34,17 +36,8 @@ const stateSeverity = {
     OK: 1,
 };
 
-const colorSeverity = {
-    Grey: 0,
-    Green: 1,
-    Blue: 2,
-    Yellow: 3,
-    Orange: 4,
-    Red: 5,
-};
-
 const getStateSeverity = (vDiskState) => {
-    return stateSeverity[vDiskState] ?? colorSeverity.Grey;
+    return stateSeverity[vDiskState] ?? NOT_AVAILABLE_SEVERITY;
 };
 
 const getColorSeverity = (color) => {
@@ -57,15 +50,25 @@ function Vdisk(props) {
 
     const anchor = useRef();
 
+    // determine disk status severity
     useEffect(() => {
         const {DiskSpace, VDiskState, FrontQueues, Replicated} = props;
+
+        // if the disk is not available, this determines its status severity regardless of other features
+        if (!VDiskState) {
+            setSeverity(NOT_AVAILABLE_SEVERITY);
+            return;
+        }
+
         const DiskSpaceSeverity = getColorSeverity(DiskSpace);
         const VDiskSpaceSeverity = getStateSeverity(VDiskState);
         const FrontQueuesSeverity = Math.min(colorSeverity.Orange, getColorSeverity(FrontQueues));
+
         let newSeverity = Math.max(DiskSpaceSeverity, VDiskSpaceSeverity, FrontQueuesSeverity);
         if (!Replicated && newSeverity === colorSeverity.Green) {
             newSeverity = colorSeverity.Blue;
         }
+
         setSeverity(newSeverity);
     }, [props.VDiskState, props.DiskSpace, props.FrontQueues, props.Replicated]);
 

package/dist/containers/Storage/utils/constants.ts

@@ -0,0 +1,10 @@
+export const colorSeverity = {
+    Grey: 0,
+    Green: 1,
+    Blue: 2,
+    Yellow: 3,
+    Orange: 4,
+    Red: 5,
+};
+
+export const NOT_AVAILABLE_SEVERITY = colorSeverity.Red;

package/dist/containers/Storage/utils/index.ts

@@ -0,0 +1 @@
+export * from './constants';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "1.2.6",
+  "version": "1.3.0",
   "files": [
     "dist"
   ],