ydb-embedded-ui 3.4.4 → 3.5.0

package/dist/utils/query.test.ts

@@ -1,7 +1,4 @@
-import {
-    parseQueryAPIExecuteResponse,
-    parseQueryAPIExplainResponse,
-} from './query';
+import {parseQueryAPIExecuteResponse, parseQueryAPIExplainResponse} from './query';
 
 describe('API utils', () => {
     describe('json/viewer/query', () => {
@@ -45,7 +42,9 @@ describe('API utils', () => {
 
                     it('should accept key-value rows in the result field', () => {
                         const response = {result: [{foo: 'bar'}]};
-                        expect(parseQueryAPIExecuteResponse(response).result).toEqual(response.result);
+                        expect(parseQueryAPIExecuteResponse(response).result).toEqual(
+                            response.result,
+                        );
                     });
                 });
 
@@ -98,19 +97,24 @@ describe('API utils', () => {
                     it('should parse modern schema', () => {
                         const response = {
                             result: [['42', 'hello world']],
-                            columns: [{
-                                name: 'id',
-                                type: 'Uint64?'
-                            }, {
-                                name: 'value',
-                                type: 'Utf8?'
-                            }],
+                            columns: [
+                                {
+                                    name: 'id',
+                                    type: 'Uint64?',
+                                },
+                                {
+                                    name: 'value',
+                                    type: 'Utf8?',
+                                },
+                            ],
                         };
                         const actual = parseQueryAPIExecuteResponse(response);
-                        expect(actual.result).toEqual([{
-                            id: '42',
-                            value: 'hello world'
-                        }]);
+                        expect(actual.result).toEqual([
+                            {
+                                id: '42',
+                                value: 'hello world',
+                            },
+                        ]);
                         expect(actual.columns).toEqual(response.columns);
                     });
 
@@ -125,12 +129,16 @@ describe('API utils', () => {
 
                     it('should parse deep classic schema', () => {
                         const response = {result: [{foo: 'bar'}]};
-                        expect(parseQueryAPIExecuteResponse(response).result).toEqual(response.result);
+                        expect(parseQueryAPIExecuteResponse(response).result).toEqual(
+                            response.result,
+                        );
                     });
 
                     it('should parse ydb schema', () => {
                         const response = {result: [{foo: 'bar'}]};
-                        expect(parseQueryAPIExecuteResponse(response).result).toEqual(response.result);
+                        expect(parseQueryAPIExecuteResponse(response).result).toEqual(
+                            response.result,
+                        );
                     });
                 });
 
@@ -138,20 +146,25 @@ describe('API utils', () => {
                     it('should parse modern schema', () => {
                         const response = {
                             result: [['42', 'hello world']],
-                            columns: [{
-                                name: 'id',
-                                type: 'Uint64?'
-                            }, {
-                                name: 'value',
-                                type: 'Utf8?'
-                            }],
+                            columns: [
+                                {
+                                    name: 'id',
+                                    type: 'Uint64?',
+                                },
+                                {
+                                    name: 'value',
+                                    type: 'Utf8?',
+                                },
+                            ],
                             stats: {metric: 'good'},
                         };
                         const actual = parseQueryAPIExecuteResponse(response);
-                        expect(actual.result).toEqual([{
-                            id: '42',
-                            value: 'hello world'
-                        }]);
+                        expect(actual.result).toEqual([
+                            {
+                                id: '42',
+                                value: 'hello world',
+                            },
+                        ]);
                         expect(actual.columns).toEqual(response.columns);
                         expect(actual.stats).toEqual(response.stats);
                     });

package/dist/utils/query.ts

@@ -47,25 +47,30 @@ export const getColumnType = (type: string) => {
         default:
             return undefined;
     }
-}
+};
 
 const parseExecuteModernResponse = (data: ExecuteModernResponse): IQueryResult => {
     const {result, columns, ...restData} = data;
 
     return {
-        result: result && columns && result.map((row) => {
-            return row.reduce((newRow: KeyValueRow, cellData, columnIndex) => {
-                const {name} = columns[columnIndex];
-                newRow[name] = cellData;
-                return newRow;
-            }, {});
-        }),
+        result:
+            result &&
+            columns &&
+            result.map((row) => {
+                return row.reduce((newRow: KeyValueRow, cellData, columnIndex) => {
+                    const {name} = columns[columnIndex];
+                    newRow[name] = cellData;
+                    return newRow;
+                }, {});
+            }),
         columns,
         ...restData,
     };
 };
 
-const parseDeprecatedExecuteResponseValue = (data?: DeprecatedExecuteResponsePlain | ExecuteClassicResponsePlain): KeyValueRow[] | undefined => {
+const parseDeprecatedExecuteResponseValue = (
+    data?: DeprecatedExecuteResponsePlain | ExecuteClassicResponsePlain,
+): KeyValueRow[] | undefined => {
     if (!data) {
         return undefined;
     }
@@ -86,20 +91,21 @@ const parseDeprecatedExecuteResponseValue = (data?: DeprecatedExecuteResponsePla
     return undefined;
 };
 
-const hasResult = (data: AnyExecuteResponse): data is DeepExecuteResponse => Boolean(
-    data && typeof data === 'object' && 'result' in data
-);
+const hasResult = (data: AnyExecuteResponse): data is DeepExecuteResponse =>
+    Boolean(data && typeof data === 'object' && 'result' in data);
 
-const isModern = (response: AnyExecuteResponse): response is ExecuteModernResponse => Boolean(
-    response &&
-    !Array.isArray(response) &&
-    Array.isArray((response as ExecuteModernResponse).result) &&
-    Array.isArray((response as ExecuteModernResponse).columns)
-);
+const isModern = (response: AnyExecuteResponse): response is ExecuteModernResponse =>
+    Boolean(
+        response &&
+            !Array.isArray(response) &&
+            Array.isArray((response as ExecuteModernResponse).result) &&
+            Array.isArray((response as ExecuteModernResponse).columns),
+    );
 
-const hasCommonFields = (data: AnyResponse): data is CommonFields => Boolean(
-    data && typeof data === 'object' && ('ast' in data || 'plan' in data || 'stats' in data)
-);
+const hasCommonFields = (data: AnyResponse): data is CommonFields =>
+    Boolean(
+        data && typeof data === 'object' && ('ast' in data || 'plan' in data || 'stats' in data),
+    );
 
 // complex logic because of the variety of possible responses
 // after all backends are updated to the latest version, it can be simplified
@@ -186,5 +192,11 @@ export const prepareQueryResponse = (data?: KeyValueRow[]) => {
 };
 
 export function prepareQueryError(error: any) {
-    return error.data?.error?.message || error.message || error.data || error.statusText || JSON.stringify(error);
+    return (
+        error.data?.error?.message ||
+        error.message ||
+        error.data ||
+        error.statusText ||
+        JSON.stringify(error)
+    );
 }

package/dist/utils/timeParsers/formatDuration.ts

@@ -4,9 +4,10 @@ import i18n from './i18n';
 
 /**
  * Process time difference in ms and returns formated time.
- * Only two major values are returned (days & hours, hours & minutes, minutes & seconds, etc.)
+ * By default only two major values are returned (days & hours, hours & minutes, minutes & seconds, etc.).
+ * It can be altered with valuesCount arg
  */
-export const formatDurationToShortTimeFormat = (value: number) => {
+export const formatDurationToShortTimeFormat = (value: number, valuesCount: 1 | 2 = 2) => {
     const ms = value % 1000;
     let remain = Math.floor(value / 1000);
 
@@ -29,17 +30,34 @@ export const formatDurationToShortTimeFormat = (value: number) => {
         ms,
     };
 
-    if (days > 0) {
-        return i18n('daysHours', duration);
+    if (valuesCount === 2) {
+        if (days > 0) {
+            return i18n('daysHours', duration);
+        }
+        if (hours > 0) {
+            return i18n('hoursMin', duration);
+        }
+        if (minutes > 0) {
+            return i18n('minSec', duration);
+        }
+        if (seconds > 0) {
+            return i18n('secMs', duration);
+        }
     }
-    if (hours > 0) {
-        return i18n('hoursMin', duration);
-    }
-    if (minutes > 0) {
-        return i18n('minSec', duration);
-    }
-    if (seconds > 0) {
-        return i18n('secMs', duration);
+
+    if (valuesCount === 1) {
+        if (days > 0) {
+            return i18n('days', duration);
+        }
+        if (hours > 0) {
+            return i18n('hours', duration);
+        }
+        if (minutes > 0) {
+            return i18n('min', duration);
+        }
+        if (seconds > 0) {
+            return i18n('sec', duration);
+        }
     }
 
     return i18n('ms', duration);

package/dist/utils/timeParsers/i18n/en.json

@@ -3,5 +3,9 @@
   "hoursMin": "{{hours}}h {{minutes}}m",
   "minSec": "{{minutes}}m {{seconds}}s",
   "secMs": "{{seconds}}s {{ms}}ms",
+  "days": "{{days}}d",
+  "hours": "{{hours}}h",
+  "min": "{{minutes}}m",
+  "sec": "{{seconds}}s",
   "ms": "{{ms}}ms"
 }

package/dist/utils/timeParsers/i18n/ru.json

@@ -3,5 +3,9 @@
   "hoursMin": "{{hours}}ч {{minutes}}м",
   "minSec": "{{minutes}}м {{seconds}}с",
   "secMs": "{{seconds}}с {{ms}}мс",
+  "days": "{{days}}д",
+  "hours": "{{hours}}ч",
+  "min": "{{minutes}}м",
+  "sec": "{{seconds}}с",
   "ms": "{{ms}}мс"
 }

package/dist/utils/tooltip.js

@@ -2,6 +2,8 @@ import cn from 'bem-cn-lite';
 import {calcUptime} from '.';
 import JSONTree from 'react-json-inspector';
 
+import {NodeEndpointsTooltip} from '../components/Tooltips/NodeEndpointsTooltip/NodeEndpointsTooltip';
+
 const poolB = cn('pool-tooltip');
 
 const PoolTooltip = (props) => {
@@ -109,34 +111,6 @@ const NodeTooltip = (props) => {
     );
 };
 
-const NodeEndpointsTooltip = (props) => {
-    const {data} = props;
-    return (
-        data && (
-            <div className={nodeB()}>
-                <table>
-                    <tbody>
-                        {data.Rack && (
-                            <tr>
-                                <td className={nodeB('label')}>Rack</td>
-                                <td className={nodeB('value')}>{data.Rack}</td>
-                            </tr>
-                        )}
-                        {data.Endpoints &&
-                            data.Endpoints.length &&
-                            data.Endpoints.map(({Name, Address}) => (
-                                <tr key={Name}>
-                                    <td className={nodeB('label')}>{Name}</td>
-                                    <td className={nodeB('value')}>{Address}</td>
-                                </tr>
-                            ))}
-                    </tbody>
-                </table>
-            </div>
-        )
-    );
-};
-
 const tabletsOverallB = cn('tabletsOverall-tooltip');
 
 const TabletsOverallTooltip = (props) => {

package/package.json

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

package/dist/components/InfoViewer/formatters/topicStats.tsx

@@ -1,29 +0,0 @@
-import type {TopicStats} from '../../../types/api/topic';
-import {formatBytes} from '../../../utils';
-import {
-    parseLag,
-    parseTimestampToIdleTime,
-    formatDurationToShortTimeFormat,
-} from '../../../utils/timeParsers';
-import {convertBytesObjectToSpeed} from '../../../utils/bytesParsers';
-
-import {SpeedMultiMeter} from '../../SpeedMultiMeter';
-
-import {createInfoFormatter} from '../utils';
-
-export const formatTopicStats = createInfoFormatter<TopicStats>({
-    values: {
-        store_size_bytes: formatBytes,
-        min_last_write_time: (value) =>
-            formatDurationToShortTimeFormat(parseTimestampToIdleTime(value)),
-        max_write_time_lag: (value) => formatDurationToShortTimeFormat(parseLag(value)),
-        bytes_written: (value) =>
-            value && <SpeedMultiMeter data={convertBytesObjectToSpeed(value)} withValue={false} />,
-    },
-    labels: {
-        store_size_bytes: 'Store size',
-        min_last_write_time: 'Partitions max time since last write',
-        max_write_time_lag: 'Partitions max write time lag',
-        bytes_written: 'Average write speed',
-    },
-});