ydb-embedded-ui 4.31.0 → 4.31.1

package/README.md

@@ -15,6 +15,8 @@ docker pull cr.yandex/yc/yandex-docker-local-ydb
 docker run -dp 8765:8765 cr.yandex/yc/yandex-docker-local-ydb
 ```
 
+Open http://localhost:8765 to view it in the browser.
+
 ## Development
 
 1. Run on a machine with Docker installed:

package/dist/components/MetricChart/convertReponse.ts

@@ -8,12 +8,13 @@ export const convertResponse = (
     const preparedMetrics = data
         .map(({datapoints, target}) => {
             const metricDescription = metrics.find((metric) => metric.target === target);
-            const chartData = datapoints.map((datapoint) => datapoint[0] || 0);
 
             if (!metricDescription) {
                 return undefined;
             }
 
+            const chartData = datapoints.map((datapoint) => datapoint[0]);
+
             return {
                 ...metricDescription,
                 data: chartData,

package/dist/components/MetricChart/getDefaultDataFormatter.ts

@@ -1,4 +1,5 @@
 import {formatBytes} from '../../utils/bytesParsers';
+import {EMPTY_DATA_PLACEHOLDER} from '../../utils/constants';
 import {roundToPrecision} from '../../utils/dataFormatters/dataFormatters';
 import {formatToMs} from '../../utils/timeParsers';
 import {isNumeric} from '../../utils/utils';
@@ -18,11 +19,19 @@ export const getDefaultDataFormatter = (dataType?: ChartDataType) => {
     }
 };
 
+// Values in y axis won't be null and will always be present and properly formatted
+// EMPTY_DATA_PLACEHOLDER is actually empty data format for values in a tooltip
 function formatChartValueToMs(value: ChartValue) {
+    if (value === null) {
+        return EMPTY_DATA_PLACEHOLDER;
+    }
     return formatToMs(roundToPrecision(convertToNumber(value), 2));
 }
 
 function formatChartValueToSize(value: ChartValue) {
+    if (value === null) {
+        return EMPTY_DATA_PLACEHOLDER;
+    }
     return formatBytes({value: convertToNumber(value), precision: 3});
 }
 

package/dist/components/MetricChart/types.ts

@@ -15,7 +15,7 @@ export interface MetricDescription {
 }
 
 export interface PreparedMetric extends MetricDescription {
-    data: number[];
+    data: (number | null)[];
 }
 
 export interface PreparedMetricsData {

package/dist/utils/constants.ts

@@ -71,6 +71,8 @@ export const COLORS_PRIORITY = {
 
 export const TENANT_OVERVIEW_TABLES_LIMIT = 5;
 
+export const EMPTY_DATA_PLACEHOLDER = '—';
+
 // ==== Titles ====
 export const DEVELOPER_UI_TITLE = 'Developer UI';
 export const CLUSTER_DEFAULT_TITLE = 'Cluster';

package/package.json

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