ydb-embedded-ui 3.4.0 → 3.4.2

package/dist/types/api/tablet.ts

@@ -1,8 +1,10 @@
 import {EFlag} from './enums';
 
-// endpoint: /viewer/json/tabletinfo
-// source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/protos/sys_view.proto
-
+/**
+ * endpoint: /viewer/json/tabletinfo
+ *
+ * source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/protos/sys_view.proto
+ */
 export interface TEvTabletStateResponse {
     TabletStateInfo?: TTabletStateInfo[];
 
@@ -16,6 +18,12 @@ export interface TEvTabletStateResponse {
     Packed5?: unknown;
 }
 
+/**
+ * endpoint: /viewer/json/tabletinfo with merge=false in query.
+ * Maps nodes to their tablets
+ */
+export type UnmergedTEvTabletStateResponse = Record<string, TEvTabletStateResponse>;
+
 export interface TTabletStateInfo {
     /** uint64 */
     TabletId?: string;
@@ -46,7 +54,7 @@ interface TCustomTabletAttribute {
     Value?: string;
 }
 
-interface TDomainKey {
+export interface TDomainKey {
     /** fixed64 */
     SchemeShard?: string;
     /** fixed64 */

package/dist/types/store/consumer.ts

@@ -1,7 +1,11 @@
 import type {IProcessSpeedStats} from '../../utils/bytesParsers';
 import type {ApiRequestAction} from '../../store/utils';
 
-import {FETCH_CONSUMER, setDataWasNotLoaded} from '../../store/reducers/consumer';
+import {
+    FETCH_CONSUMER,
+    setDataWasNotLoaded,
+    setSelectedConsumer,
+} from '../../store/reducers/consumer';
 
 import type {DescribeConsumerResult} from '../api/consumer';
 import type {IResponseError} from '../api/error';
@@ -38,6 +42,7 @@ export interface IPreparedPartitionData {
 export interface IConsumerState {
     loading: boolean;
     wasLoaded: boolean;
+    selectedConsumer?: string;
     data?: DescribeConsumerResult;
     error?: IResponseError;
 }
@@ -48,7 +53,10 @@ type IConsumerApiRequestAction = ApiRequestAction<
     IResponseError
 >;
 
-export type IConsumerAction = IConsumerApiRequestAction | ReturnType<typeof setDataWasNotLoaded>;
+export type IConsumerAction =
+    | IConsumerApiRequestAction
+    | ReturnType<typeof setDataWasNotLoaded>
+    | ReturnType<typeof setSelectedConsumer>;
 
 export interface IConsumerRootStateSlice {
     consumer: IConsumerState;

package/dist/types/store/host.ts

@@ -0,0 +1,23 @@
+import {FETCH_HOST} from '../../store/reducers/host';
+
+import type {ApiRequestAction} from '../../store/utils';
+import type {IResponseError} from '../api/error';
+import type {TSystemStateInfo} from '../api/nodes';
+import type {TEvSystemStateResponse} from '../api/systemState';
+
+export interface IHostState {
+    loading: boolean;
+    wasLoaded: boolean;
+    data?: TSystemStateInfo;
+    error?: IResponseError;
+}
+
+export type IHostAction = ApiRequestAction<
+    typeof FETCH_HOST,
+    TEvSystemStateResponse,
+    IResponseError
+>;
+
+export interface IHostRootStateSlice {
+    host: IHostState;
+}

package/dist/types/store/tablet.ts

@@ -0,0 +1,50 @@
+import type {IResponseError} from '../api/error';
+import type {ETabletState, TTabletStateInfo} from '../api/tablet';
+
+import {FETCH_TABLET, FETCH_TABLET_DESCRIBE} from '../../store/reducers/tablet';
+import {ApiRequestAction} from '../../store/utils';
+
+export interface ITabletPreparedHistoryItem {
+    nodeId: string;
+    generation: number | undefined;
+    changeTime: string | undefined;
+    state: ETabletState | undefined;
+    leader: boolean | undefined;
+    followerId: number | undefined;
+}
+
+export interface ITabletState {
+    loading: boolean;
+    tenantPath: string;
+    error?: IResponseError;
+    id?: string;
+    history?: ITabletPreparedHistoryItem[];
+    data?: TTabletStateInfo;
+}
+
+export interface ITabletHandledResponse {
+    tabletData: TTabletStateInfo;
+    historyData: ITabletPreparedHistoryItem[];
+}
+
+export interface ITabletDescribeHandledResponse {
+    tenantPath: string;
+}
+
+type ITabletApiRequestAction = ApiRequestAction<
+    typeof FETCH_TABLET,
+    ITabletHandledResponse,
+    IResponseError
+>;
+
+type ITabletDescribeApiRequestAction = ApiRequestAction<
+    typeof FETCH_TABLET_DESCRIBE,
+    ITabletDescribeHandledResponse,
+    IResponseError
+>;
+
+export type ITabletAction = ITabletApiRequestAction | ITabletDescribeApiRequestAction;
+
+export interface ITabletRootStateSlice {
+    tablet: ITabletState;
+}

package/dist/types/store/tooltip.ts

@@ -18,7 +18,9 @@ export interface ITooltipState {
     additionalData?: any;
 }
 
-export type ITooltipAction = ReturnType<typeof hideTooltip> | ReturnType<typeof showTooltip>;
+export type ShowTooltipFunction = typeof showTooltip;
+
+export type ITooltipAction = ReturnType<typeof hideTooltip> | ReturnType<ShowTooltipFunction>;
 
 export interface ITooltipRootStateSlice {
     tooltip: ITooltipState;

package/dist/types/store/topic.ts

@@ -1,4 +1,4 @@
-import {FETCH_TOPIC, setDataWasNotLoaded} from '../../store/reducers/topic';
+import {FETCH_TOPIC, cleanTopicData, setDataWasNotLoaded} from '../../store/reducers/topic';
 import type {ApiRequestAction} from '../../store/utils';
 import type {IProcessSpeedStats} from '../../utils/bytesParsers';
 import type {IResponseError} from '../api/error';
@@ -31,7 +31,8 @@ export interface ITopicState {
 
 export type ITopicAction =
     | ApiRequestAction<typeof FETCH_TOPIC, DescribeTopicResult, IResponseError>
-    | ReturnType<typeof setDataWasNotLoaded>;
+    | ReturnType<typeof setDataWasNotLoaded>
+    | ReturnType<typeof cleanTopicData>;
 
 export interface ITopicRootStateSlice {
     topic: ITopicState;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "3.4.0",
+  "version": "3.4.2",
   "files": [
     "dist"
   ],
@@ -30,7 +30,7 @@
     "react-redux": "7.2.6",
     "react-router": "5.2.1",
     "react-router-dom": "5.3.0",
-    "react-scripts": "4.0.3",
+    "react-scripts": "5.0.1",
     "react-split": "2.0.14",
     "react-transition-group": "4.4.2",
     "redux": "4.0.1",
@@ -44,7 +44,7 @@
   "scripts": {
     "start": "react-app-rewired start",
     "dev": "DISABLE_ESLINT_PLUGIN=true TSC_COMPILE_ON_ERROR=true REACT_APP_BACKEND=http://localhost:8765 npm start",
-    "build": "react-app-rewired build",
+    "build": "DISABLE_ESLINT_PLUGIN=true react-app-rewired build",
     "//build:embedded": "echo 'PUBLIC_URL is a setting for create-react-app. Embedded version is built and hosted as is on ydb servers, with no way of knowing the final URL pattern. PUBLIC_URL=. keeps paths to all static relative, allowing servers to handle them as needed'",
     "build:embedded": "rm -rf build && PUBLIC_URL=. REACT_APP_BACKEND=http://localhost:8765 npm run build",
     "lint:styles": "stylelint 'src/**/*.scss'",
@@ -103,7 +103,7 @@
     "@gravity-ui/prettier-config": "^1.0.1",
     "@gravity-ui/stylelint-config": "^1.0.1",
     "@gravity-ui/tsconfig": "^1.0.0",
-    "@gravity-ui/uikit": "^3.0.1",
+    "@gravity-ui/uikit": "^3.20.2",
     "@testing-library/jest-dom": "^5.15.0",
     "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^12.8.3",
@@ -123,12 +123,14 @@
     "lint-staged": "^12.3.7",
     "postcss": "^8.4.6",
     "prettier": "^2.5.1",
+    "qs": "^6.11.0",
     "react": "^17.0.2",
     "react-app-rewired": "^2.1.11",
     "react-dom": "^17.0.2",
     "stylelint": "^14.3.0",
     "ts-jest": "^28.0.7",
-    "typescript": "^4.5.5"
+    "typescript": "^4.5.5",
+    "url": "^0.11.0"
   },
   "peerDependencies": {
     "@gravity-ui/uikit": "^3.0.1"

package/dist/components/Icon/Icon.js

@@ -1,28 +0,0 @@
-import PropTypes from 'prop-types';
-import {Icon as UiKitIcon} from '@gravity-ui/uikit';
-
-export default function Icon({name, height, width, viewBox, className, onClick}) {
-    return (
-        <UiKitIcon
-            data={{id: `icon.${name}`, viewBox}}
-            height={height}
-            width={width}
-            className={className}
-            onClick={onClick}
-        />
-    );
-}
-
-Icon.propTypes = {
-    name: PropTypes.string.isRequired,
-    height: PropTypes.number,
-    width: PropTypes.number,
-    viewBox: PropTypes.string,
-    className: PropTypes.string,
-    onClick: PropTypes.func,
-};
-Icon.defaultProps = {
-    height: 16,
-    width: 16,
-    viewBox: '0 0 16 16',
-};

package/dist/components/Tablet/Tablet.js

@@ -1,61 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import cn from 'bem-cn-lite';
-
-import {InternalLink} from '../InternalLink';
-
-import {getTabletLabel} from '../../utils/constants';
-import routes, {createHref} from '../../routes';
-
-import './Tablet.scss';
-
-const b = cn('tablet');
-
-class Tablet extends React.PureComponent {
-    static propTypes = {
-        className: PropTypes.string,
-        tablet: PropTypes.object,
-        onMouseEnter: PropTypes.func,
-        onMouseLeave: PropTypes.func,
-    };
-    static defaultProps = {
-        onMouseEnter: () => {},
-        onMouseLeave: () => {},
-    };
-    ref = React.createRef();
-    _onTabletMouseEnter = () => {
-        const {tablet} = this.props;
-        this.props.onMouseEnter(this.ref.current, tablet, 'tablet');
-    };
-    _onTabletClick = () => {
-        const {tablet = {}} = this.props;
-        const {TabletId: id} = tablet;
-
-        if (id) {
-            this.props.onMouseLeave();
-        }
-    };
-    render() {
-        const {tablet = {}} = this.props;
-        const {TabletId: id} = tablet;
-        const status = tablet.Overall?.toLowerCase();
-
-        return (
-            <InternalLink
-                onClick={this._onTabletClick}
-                to={id && createHref(routes.tablet, {id})}
-                className={b('wrapper')}
-            >
-                <div
-                    ref={this.ref}
-                    className={b({status})}
-                    onMouseEnter={this._onTabletMouseEnter}
-                    onMouseLeave={this.props.onMouseLeave}
-                >
-                    <div className={b('type')}>{[getTabletLabel(tablet.Type)]}</div>
-                </div>
-            </InternalLink>
-        );
-    }
-}
-export default Tablet;

package/dist/components/Tag/Tag.js

@@ -1,14 +0,0 @@
-import PropTypes from 'prop-types';
-import cn from 'bem-cn-lite';
-import './Tag.scss';
-
-const b = cn('tag');
-
-export const Tag = ({text, type}) => {
-    return <div className={b({type})}>{text}</div>;
-};
-
-Tag.propTypes = {
-    text: PropTypes.string,
-    type: PropTypes.string,
-};

package/dist/components/Tags/Tags.js

@@ -1,36 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import cn from 'bem-cn-lite';
-
-import {Tag} from '../Tag/Tag';
-
-import './Tags.scss';
-
-const b = cn('tags');
-
-class Tags extends React.Component {
-    static propTypes = {
-        className: PropTypes.string,
-        tags: PropTypes.arrayOf(PropTypes.string).isRequired,
-        tagsType: PropTypes.string,
-    };
-
-    static defaultProps = {
-        className: '',
-    };
-
-    render() {
-        const {tags, className, tagsType} = this.props;
-
-        return (
-            <div className={`${b()} ${className}`}>
-                {tags &&
-                    tags.map((tag, tagIndex) => (
-                        <Tag text={tag} key={tagIndex} type={tagsType}></Tag>
-                    ))}
-            </div>
-        );
-    }
-}
-
-export default Tags;

package/dist/store/reducers/tablet.js

@@ -1,94 +0,0 @@
-import {createRequestActionTypes, createApiRequest} from '../utils';
-import '../../services/api';
-import _ from 'lodash';
-
-const FETCH_TABLET = createRequestActionTypes('TABLET', 'FETCH_TABLET');
-const FETCH_TABLET_DESCRIBE = createRequestActionTypes('TABLET', 'FETCH_TABLET_DESCRIBE');
-
-const tablet = (state = {loading: false, tenantPath: '-'}, action) => {
-    switch (action.type) {
-        case FETCH_TABLET.REQUEST: {
-            return {
-                ...state,
-                loading: true,
-            };
-        }
-        case FETCH_TABLET.SUCCESS: {
-            const {tablet, history} = action.data;
-            const {TabletId: id} = tablet;
-            return {
-                ...state,
-                id,
-                data: tablet,
-                history,
-                loading: false,
-                error: undefined,
-            };
-        }
-        case FETCH_TABLET.FAILURE: {
-            return {
-                ...state,
-                error: action.error,
-                loading: false,
-            };
-        }
-        case FETCH_TABLET_DESCRIBE.SUCCESS: {
-            const {tenantPath} = action.data;
-
-            return {
-                ...state,
-                tenantPath,
-                error: undefined,
-            };
-        }
-        default:
-            return state;
-    }
-};
-
-export const getTablet = (id) => {
-    return createApiRequest({
-        request: Promise.all([window.api.getTablet({id}), window.api.getTabletHistory({id})]),
-        actions: FETCH_TABLET,
-        dataHandler: ([tabletData, history]) => {
-            const historyData = Object.keys(history).reduce((list, nodeId) => {
-                const tabletInfo = history[nodeId]?.TabletStateInfo;
-                if (tabletInfo && tabletInfo.length) {
-                    const leaderTablet =
-                        _.find(tabletInfo, (t) => t.Master || t.Leader) || tabletInfo[0];
-                    const {ChangeTime, Generation, State, Master, SlaveId, Leader, FollowerId} =
-                        leaderTablet;
-                    list.push({
-                        nodeId,
-                        generation: Generation,
-                        changeTime: ChangeTime,
-                        state: State,
-                        leader: Master || Leader,
-                        followerId: SlaveId || FollowerId,
-                    });
-                }
-                return list;
-            }, []);
-
-            const {TabletStateInfo = []} = tabletData;
-            const [tablet = {}] = TabletStateInfo;
-
-            return {tablet, history: historyData};
-        },
-    });
-};
-
-export const getTabletDescribe = (TenantId) => {
-    return createApiRequest({
-        request: window.api.getTabletDescribe(TenantId),
-        actions: FETCH_TABLET_DESCRIBE,
-        dataHandler: (tabletDescribe) => {
-            const {SchemeShard, PathId} = TenantId;
-            const tenantPath = tabletDescribe.Path || `${SchemeShard}:${PathId}`;
-
-            return {tenantPath};
-        },
-    });
-};
-
-export default tablet;