ydb-ui-components 2.4.1 → 3.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +32 -0
- package/README.md +1 -1
- package/build/components/NavigationTree/EmptyView/EmptyView.js +6 -8
- package/build/components/NavigationTree/ErrorView/ErrorView.js +6 -8
- package/build/components/NavigationTree/LoaderView/LoaderView.js +7 -9
- package/build/components/NavigationTree/NavigationTree.js +57 -34
- package/build/components/NavigationTree/NavigationTreeNode.js +35 -37
- package/build/components/NavigationTree/i18n/index.d.ts +1 -1
- package/build/components/NavigationTree/i18n/index.js +6 -6
- package/build/components/NavigationTree/index.js +2 -2
- package/build/components/NavigationTree/state.js +53 -48
- package/build/components/NavigationTree/types.d.ts +1 -1
- package/build/components/NavigationTree/utils.js +20 -4
- package/build/components/TreeView/TreeView.d.ts +1 -1
- package/build/components/TreeView/TreeView.js +43 -38
- package/build/components/TreeView/index.js +1 -1
- package/build/components/i18n.d.ts +1 -1
- package/build/components/i18n.js +3 -3
- package/build/components/icons/ColumnTable.js +6 -38
- package/build/components/icons/Database.js +3 -3
- package/build/components/icons/Folder.js +3 -3
- package/build/components/icons/FolderOpen.js +3 -3
- package/build/components/icons/Index.js +4 -4
- package/build/components/icons/Table.js +6 -4
- package/build/components/icons/Topic.js +20 -4
- package/build/index.d.ts +0 -1
- package/build/index.js +3 -17
- package/build/utils/configure.js +13 -9
- package/build/utils/index.js +2 -2
- package/package.json +9 -15
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,37 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [3.0.1](https://github.com/ydb-platform/ydb-ui-components/compare/v3.0.0...v3.0.1) (2022-09-23)
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
### Bug Fixes
|
|
7
|
+
|
|
8
|
+
* **NavigatioinTree:** update icons ([0d0674d](https://github.com/ydb-platform/ydb-ui-components/commit/0d0674dfc1b14bf8115135ee75090a7f967da2d4))
|
|
9
|
+
|
|
10
|
+
## [3.0.0](https://github.com/ydb-platform/ydb-ui-components/compare/v2.4.1...v3.0.0) (2022-09-21)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
### ⚠ BREAKING CHANGES
|
|
14
|
+
|
|
15
|
+
* peer deps update: migrated from `@yandex-cloud/uikit` to `@gravity-ui/uikit`
|
|
16
|
+
* updated i18n, and removed it from peer deps
|
|
17
|
+
* removed deprecated i18n instance export
|
|
18
|
+
|
|
19
|
+
#### Setting language in ydb-ui-components
|
|
20
|
+
|
|
21
|
+
**v2**
|
|
22
|
+
```js
|
|
23
|
+
import {i18n} from 'ydb-ui-components';
|
|
24
|
+
|
|
25
|
+
i18n.setLang('en');
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
**v3**
|
|
29
|
+
```js
|
|
30
|
+
import {configure} from 'ydb-ui-components';
|
|
31
|
+
|
|
32
|
+
configure({lang: 'en'});
|
|
33
|
+
```
|
|
34
|
+
|
|
3
35
|
## [2.4.1](https://github.com/ydb-platform/ydb-ui-components/compare/v2.4.0...v2.4.1) (2022-08-02)
|
|
4
36
|
|
|
5
37
|
|
package/README.md
CHANGED
|
@@ -5,7 +5,7 @@ A set of React components used in YDB interfaces.
|
|
|
5
5
|
## Install
|
|
6
6
|
|
|
7
7
|
```shell
|
|
8
|
-
npm install --save-dev ydb-ui-components @
|
|
8
|
+
npm install --save-dev ydb-ui-components @gravity-ui/uikit
|
|
9
9
|
```
|
|
10
10
|
|
|
11
11
|
## I18N
|
|
@@ -15,18 +15,16 @@ var _TreeView = require("../../TreeView/TreeView");
|
|
|
15
15
|
|
|
16
16
|
require("./EmptyView.css");
|
|
17
17
|
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
19
|
|
|
20
|
-
|
|
20
|
+
var b = (0, _bemCnLite["default"])('ydb-navigation-tree-view-empty');
|
|
21
21
|
|
|
22
22
|
function EmptyView(_ref) {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
return /*#__PURE__*/_react.default.createElement(_TreeView.TreeView, {
|
|
27
|
-
name: /*#__PURE__*/_react.default.createElement("span", {
|
|
23
|
+
var level = _ref.level;
|
|
24
|
+
return /*#__PURE__*/_react["default"].createElement(_TreeView.TreeView, {
|
|
25
|
+
name: /*#__PURE__*/_react["default"].createElement("span", {
|
|
28
26
|
className: b()
|
|
29
|
-
}, (0, _i18n
|
|
27
|
+
}, (0, _i18n["default"])('label_empty')),
|
|
30
28
|
level: level
|
|
31
29
|
});
|
|
32
30
|
}
|
|
@@ -15,18 +15,16 @@ var _TreeView = require("../../TreeView/TreeView");
|
|
|
15
15
|
|
|
16
16
|
require("./ErrorView.css");
|
|
17
17
|
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
19
|
|
|
20
|
-
|
|
20
|
+
var b = (0, _bemCnLite["default"])('ydb-navigation-tree-view-error');
|
|
21
21
|
|
|
22
22
|
function ErrorView(_ref) {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
return /*#__PURE__*/_react.default.createElement(_TreeView.TreeView, {
|
|
27
|
-
name: /*#__PURE__*/_react.default.createElement("span", {
|
|
23
|
+
var level = _ref.level;
|
|
24
|
+
return /*#__PURE__*/_react["default"].createElement(_TreeView.TreeView, {
|
|
25
|
+
name: /*#__PURE__*/_react["default"].createElement("span", {
|
|
28
26
|
className: b()
|
|
29
|
-
}, (0, _i18n
|
|
27
|
+
}, (0, _i18n["default"])('label_error')),
|
|
30
28
|
level: level
|
|
31
29
|
});
|
|
32
30
|
}
|
|
@@ -9,24 +9,22 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _bemCnLite = _interopRequireDefault(require("bem-cn-lite"));
|
|
11
11
|
|
|
12
|
-
var _uikit = require("@
|
|
12
|
+
var _uikit = require("@gravity-ui/uikit");
|
|
13
13
|
|
|
14
14
|
var _TreeView = require("../../TreeView/TreeView");
|
|
15
15
|
|
|
16
16
|
require("./LoaderView.css");
|
|
17
17
|
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
19
|
|
|
20
|
-
|
|
20
|
+
var b = (0, _bemCnLite["default"])('ydb-navigation-tree-view-loader');
|
|
21
21
|
|
|
22
22
|
function LoaderView(_ref) {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
return /*#__PURE__*/_react.default.createElement(_TreeView.TreeView, {
|
|
27
|
-
name: /*#__PURE__*/_react.default.createElement("div", {
|
|
23
|
+
var level = _ref.level;
|
|
24
|
+
return /*#__PURE__*/_react["default"].createElement(_TreeView.TreeView, {
|
|
25
|
+
name: /*#__PURE__*/_react["default"].createElement("div", {
|
|
28
26
|
className: b()
|
|
29
|
-
}, /*#__PURE__*/_react
|
|
27
|
+
}, /*#__PURE__*/_react["default"].createElement(_uikit.Spin, {
|
|
30
28
|
size: "xs"
|
|
31
29
|
})),
|
|
32
30
|
level: level
|
|
@@ -21,50 +21,67 @@ var _ErrorView = require("./ErrorView/ErrorView");
|
|
|
21
21
|
|
|
22
22
|
var _EmptyView = require("./EmptyView/EmptyView");
|
|
23
23
|
|
|
24
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
24
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
25
25
|
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
27
|
+
|
|
28
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
29
|
+
|
|
30
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
31
|
+
|
|
32
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
33
|
+
|
|
34
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
35
|
+
|
|
36
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
37
|
+
|
|
38
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
39
|
+
|
|
40
|
+
var renderServiceNode = function renderServiceNode(node) {
|
|
41
|
+
var key = "".concat(node.path, "|").concat(node.status);
|
|
28
42
|
|
|
29
43
|
if (node.status === 'loading') {
|
|
30
|
-
return /*#__PURE__*/_react
|
|
44
|
+
return /*#__PURE__*/_react["default"].createElement(_LoaderView.LoaderView, {
|
|
31
45
|
key: key,
|
|
32
46
|
level: node.level
|
|
33
47
|
});
|
|
34
48
|
}
|
|
35
49
|
|
|
36
50
|
if (node.status === 'error') {
|
|
37
|
-
return /*#__PURE__*/_react
|
|
51
|
+
return /*#__PURE__*/_react["default"].createElement(_ErrorView.ErrorView, {
|
|
38
52
|
key: key,
|
|
39
53
|
level: node.level
|
|
40
54
|
});
|
|
41
55
|
}
|
|
42
56
|
|
|
43
|
-
return /*#__PURE__*/_react
|
|
57
|
+
return /*#__PURE__*/_react["default"].createElement(_EmptyView.EmptyView, {
|
|
44
58
|
key: key,
|
|
45
59
|
level: node.level
|
|
46
60
|
});
|
|
47
61
|
};
|
|
48
62
|
|
|
49
63
|
function NavigationTree(_ref) {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
64
|
+
var partialRootState = _ref.rootState,
|
|
65
|
+
fetchPath = _ref.fetchPath,
|
|
66
|
+
getActions = _ref.getActions,
|
|
67
|
+
activePath = _ref.activePath,
|
|
68
|
+
onActivePathUpdate = _ref.onActivePathUpdate,
|
|
69
|
+
_ref$cache = _ref.cache,
|
|
70
|
+
cache = _ref$cache === void 0 ? true : _ref$cache,
|
|
71
|
+
_ref$virtualize = _ref.virtualize,
|
|
72
|
+
virtualize = _ref$virtualize === void 0 ? false : _ref$virtualize;
|
|
73
|
+
|
|
74
|
+
var _React$useReducer = _react["default"].useReducer(_state.reducer, _defineProperty({}, partialRootState.path, (0, _state.getNodeState)(partialRootState))),
|
|
75
|
+
_React$useReducer2 = _slicedToArray(_React$useReducer, 2),
|
|
76
|
+
state = _React$useReducer2[0],
|
|
77
|
+
dispatch = _React$useReducer2[1];
|
|
78
|
+
|
|
79
|
+
var nodesList = _react["default"].useMemo(function () {
|
|
80
|
+
return (0, _state.selectTreeAsList)(state, partialRootState.path);
|
|
81
|
+
}, [state]);
|
|
82
|
+
|
|
83
|
+
var renderNode = function renderNode(node) {
|
|
84
|
+
return /*#__PURE__*/_react["default"].createElement(_NavigationTreeNode.NavigationTreeNode, {
|
|
68
85
|
key: node.path,
|
|
69
86
|
state: state,
|
|
70
87
|
path: node.path,
|
|
@@ -78,17 +95,23 @@ function NavigationTree(_ref) {
|
|
|
78
95
|
});
|
|
79
96
|
};
|
|
80
97
|
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
98
|
+
var renderVirtualizedTree = function renderVirtualizedTree() {
|
|
99
|
+
return /*#__PURE__*/_react["default"].createElement(_reactList["default"], {
|
|
100
|
+
type: "uniform",
|
|
101
|
+
length: nodesList.length,
|
|
102
|
+
useStaticSize: true,
|
|
103
|
+
itemRenderer: function itemRenderer(index) {
|
|
104
|
+
var node = nodesList[index];
|
|
105
|
+
return (0, _utils.isServiceNode)(node) ? renderServiceNode(node) : renderNode(node);
|
|
106
|
+
}
|
|
107
|
+
});
|
|
108
|
+
};
|
|
90
109
|
|
|
91
|
-
|
|
110
|
+
var renderSimpleTree = function renderSimpleTree() {
|
|
111
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, nodesList.map(function (node) {
|
|
112
|
+
return (0, _utils.isServiceNode)(node) ? renderServiceNode(node) : renderNode(node);
|
|
113
|
+
}));
|
|
114
|
+
};
|
|
92
115
|
|
|
93
116
|
return virtualize ? renderVirtualizedTree() : renderSimpleTree();
|
|
94
117
|
}
|
|
@@ -25,41 +25,41 @@ var _ColumnTable = require("../icons/ColumnTable");
|
|
|
25
25
|
|
|
26
26
|
var _TreeView = require("../TreeView/TreeView");
|
|
27
27
|
|
|
28
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
28
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
29
29
|
|
|
30
30
|
function renderIcon(type, collapsed) {
|
|
31
31
|
switch (type) {
|
|
32
32
|
case 'database':
|
|
33
33
|
// this icon is larger than the others, therefore 14 for a better fit
|
|
34
|
-
return /*#__PURE__*/_react
|
|
34
|
+
return /*#__PURE__*/_react["default"].createElement(_Database.DatabaseIcon, {
|
|
35
35
|
height: 14
|
|
36
36
|
});
|
|
37
37
|
|
|
38
38
|
case 'directory':
|
|
39
|
-
return collapsed ? /*#__PURE__*/_react
|
|
39
|
+
return collapsed ? /*#__PURE__*/_react["default"].createElement(_Folder.FolderIcon, {
|
|
40
40
|
height: 16
|
|
41
|
-
}) : /*#__PURE__*/_react
|
|
41
|
+
}) : /*#__PURE__*/_react["default"].createElement(_FolderOpen.FolderOpenIcon, {
|
|
42
42
|
height: 16
|
|
43
43
|
});
|
|
44
44
|
|
|
45
45
|
case 'index':
|
|
46
|
-
return /*#__PURE__*/_react
|
|
46
|
+
return /*#__PURE__*/_react["default"].createElement(_Index.IndexIcon, {
|
|
47
47
|
height: 16
|
|
48
48
|
});
|
|
49
49
|
|
|
50
50
|
case 'table':
|
|
51
51
|
case 'index_table':
|
|
52
|
-
return /*#__PURE__*/_react
|
|
52
|
+
return /*#__PURE__*/_react["default"].createElement(_Table.TableIcon, {
|
|
53
53
|
height: 16
|
|
54
54
|
});
|
|
55
55
|
|
|
56
56
|
case 'column_table':
|
|
57
|
-
return /*#__PURE__*/_react
|
|
57
|
+
return /*#__PURE__*/_react["default"].createElement(_ColumnTable.ColumnTableIcon, {
|
|
58
58
|
height: 16
|
|
59
59
|
});
|
|
60
60
|
|
|
61
61
|
case 'topic':
|
|
62
|
-
return /*#__PURE__*/_react
|
|
62
|
+
return /*#__PURE__*/_react["default"].createElement(_Topic.TopicIcon, {
|
|
63
63
|
height: 16
|
|
64
64
|
});
|
|
65
65
|
|
|
@@ -69,27 +69,25 @@ function renderIcon(type, collapsed) {
|
|
|
69
69
|
}
|
|
70
70
|
|
|
71
71
|
function NavigationTreeNode(_ref) {
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
_react.default.useEffect(() => {
|
|
72
|
+
var path = _ref.path,
|
|
73
|
+
fetchPath = _ref.fetchPath,
|
|
74
|
+
activePath = _ref.activePath,
|
|
75
|
+
state = _ref.state,
|
|
76
|
+
level = _ref.level,
|
|
77
|
+
dispatch = _ref.dispatch,
|
|
78
|
+
children = _ref.children,
|
|
79
|
+
onActivate = _ref.onActivate,
|
|
80
|
+
getActions = _ref.getActions,
|
|
81
|
+
cache = _ref.cache;
|
|
82
|
+
var nodeState = state[path];
|
|
83
|
+
|
|
84
|
+
_react["default"].useEffect(function () {
|
|
87
85
|
if (nodeState.collapsed) {
|
|
88
86
|
if (!cache) {
|
|
89
87
|
dispatch({
|
|
90
88
|
type: _state.NavigationTreeActionType.ResetNode,
|
|
91
89
|
payload: {
|
|
92
|
-
path
|
|
90
|
+
path: path
|
|
93
91
|
}
|
|
94
92
|
});
|
|
95
93
|
}
|
|
@@ -104,49 +102,49 @@ function NavigationTreeNode(_ref) {
|
|
|
104
102
|
dispatch({
|
|
105
103
|
type: _state.NavigationTreeActionType.StartLoading,
|
|
106
104
|
payload: {
|
|
107
|
-
path
|
|
105
|
+
path: path
|
|
108
106
|
}
|
|
109
107
|
});
|
|
110
|
-
fetchPath(path).then(data
|
|
108
|
+
fetchPath(path).then(function (data) {
|
|
111
109
|
dispatch({
|
|
112
110
|
type: _state.NavigationTreeActionType.FinishLoading,
|
|
113
111
|
payload: {
|
|
114
|
-
path,
|
|
115
|
-
activePath,
|
|
116
|
-
data
|
|
112
|
+
path: path,
|
|
113
|
+
activePath: activePath,
|
|
114
|
+
data: data
|
|
117
115
|
}
|
|
118
116
|
});
|
|
119
|
-
})
|
|
117
|
+
})["catch"](function (error) {
|
|
120
118
|
dispatch({
|
|
121
119
|
type: _state.NavigationTreeActionType.FinishLoading,
|
|
122
120
|
payload: {
|
|
123
|
-
path,
|
|
124
|
-
error
|
|
121
|
+
path: path,
|
|
122
|
+
error: error
|
|
125
123
|
}
|
|
126
124
|
});
|
|
127
125
|
});
|
|
128
126
|
}, [nodeState.collapsed]);
|
|
129
127
|
|
|
130
|
-
|
|
128
|
+
var handleClick = _react["default"].useCallback(function () {
|
|
131
129
|
if (onActivate) {
|
|
132
130
|
onActivate(path);
|
|
133
131
|
}
|
|
134
132
|
}, [path, onActivate]);
|
|
135
133
|
|
|
136
|
-
|
|
134
|
+
var handleArrowClick = _react["default"].useCallback(function () {
|
|
137
135
|
dispatch({
|
|
138
136
|
type: _state.NavigationTreeActionType.ToggleCollapsed,
|
|
139
137
|
payload: {
|
|
140
|
-
path
|
|
138
|
+
path: path
|
|
141
139
|
}
|
|
142
140
|
});
|
|
143
141
|
}, []);
|
|
144
142
|
|
|
145
|
-
|
|
143
|
+
var actions = _react["default"].useMemo(function () {
|
|
146
144
|
return getActions === null || getActions === void 0 ? void 0 : getActions(nodeState.path, nodeState.type);
|
|
147
145
|
}, [getActions, nodeState]);
|
|
148
146
|
|
|
149
|
-
return /*#__PURE__*/_react
|
|
147
|
+
return /*#__PURE__*/_react["default"].createElement(_TreeView.TreeView, {
|
|
150
148
|
name: nodeState.name,
|
|
151
149
|
icon: renderIcon(nodeState.type, nodeState.collapsed),
|
|
152
150
|
collapsed: nodeState.collapsed,
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: (key: string, params?: import("@
|
|
1
|
+
declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
|
|
2
2
|
export default _default;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
6
|
+
exports["default"] = void 0;
|
|
7
7
|
|
|
8
8
|
var _i18n = require("../../i18n");
|
|
9
9
|
|
|
@@ -13,14 +13,14 @@ var _en = _interopRequireDefault(require("./en.json"));
|
|
|
13
13
|
|
|
14
14
|
var _ru = _interopRequireDefault(require("./ru.json"));
|
|
15
15
|
|
|
16
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
var COMPONENT = 'ydb-navigation-tree';
|
|
19
19
|
|
|
20
|
-
_i18n.i18n.registerKeyset(_utils.Lang.En, COMPONENT, _en
|
|
20
|
+
_i18n.i18n.registerKeyset(_utils.Lang.En, COMPONENT, _en["default"]);
|
|
21
21
|
|
|
22
|
-
_i18n.i18n.registerKeyset(_utils.Lang.Ru, COMPONENT, _ru
|
|
22
|
+
_i18n.i18n.registerKeyset(_utils.Lang.Ru, COMPONENT, _ru["default"]);
|
|
23
23
|
|
|
24
24
|
var _default = _i18n.i18n.keyset(COMPONENT);
|
|
25
25
|
|
|
26
|
-
exports
|
|
26
|
+
exports["default"] = _default;
|
|
@@ -11,7 +11,7 @@ Object.keys(_NavigationTree).forEach(function (key) {
|
|
|
11
11
|
if (key in exports && exports[key] === _NavigationTree[key]) return;
|
|
12
12
|
Object.defineProperty(exports, key, {
|
|
13
13
|
enumerable: true,
|
|
14
|
-
get: function () {
|
|
14
|
+
get: function get() {
|
|
15
15
|
return _NavigationTree[key];
|
|
16
16
|
}
|
|
17
17
|
});
|
|
@@ -24,7 +24,7 @@ Object.keys(_types).forEach(function (key) {
|
|
|
24
24
|
if (key in exports && exports[key] === _types[key]) return;
|
|
25
25
|
Object.defineProperty(exports, key, {
|
|
26
26
|
enumerable: true,
|
|
27
|
-
get: function () {
|
|
27
|
+
get: function get() {
|
|
28
28
|
return _types[key];
|
|
29
29
|
}
|
|
30
30
|
});
|
|
@@ -11,13 +11,19 @@ exports.selectTreeAsList = selectTreeAsList;
|
|
|
11
11
|
|
|
12
12
|
var _utils = require("./utils");
|
|
13
13
|
|
|
14
|
+
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
|
|
15
|
+
|
|
16
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
17
|
+
|
|
18
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
19
|
+
|
|
14
20
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
21
|
|
|
16
22
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
23
|
|
|
18
24
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
19
25
|
|
|
20
|
-
|
|
26
|
+
var NavigationTreeActionType;
|
|
21
27
|
exports.NavigationTreeActionType = NavigationTreeActionType;
|
|
22
28
|
|
|
23
29
|
(function (NavigationTreeActionType) {
|
|
@@ -44,59 +50,60 @@ function getNodeState(partialState) {
|
|
|
44
50
|
}
|
|
45
51
|
|
|
46
52
|
function reducer() {
|
|
47
|
-
|
|
48
|
-
|
|
53
|
+
var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
54
|
+
var action = arguments.length > 1 ? arguments[1] : undefined;
|
|
49
55
|
|
|
50
56
|
switch (action.type) {
|
|
51
57
|
case NavigationTreeActionType.ToggleCollapsed:
|
|
52
|
-
return _objectSpread(_objectSpread({}, state), {}, {
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
})
|
|
56
|
-
});
|
|
58
|
+
return _objectSpread(_objectSpread({}, state), {}, _defineProperty({}, action.payload.path, _objectSpread(_objectSpread({}, state[action.payload.path]), {}, {
|
|
59
|
+
collapsed: !state[action.payload.path].collapsed
|
|
60
|
+
})));
|
|
57
61
|
|
|
58
62
|
case NavigationTreeActionType.StartLoading:
|
|
59
|
-
return _objectSpread(_objectSpread({}, state), {}, {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
})
|
|
66
|
-
});
|
|
63
|
+
return _objectSpread(_objectSpread({}, state), {}, _defineProperty({}, action.payload.path, _objectSpread(_objectSpread({}, state[action.payload.path]), {}, {
|
|
64
|
+
loading: true,
|
|
65
|
+
loaded: false,
|
|
66
|
+
error: false,
|
|
67
|
+
children: []
|
|
68
|
+
})));
|
|
67
69
|
|
|
68
70
|
case NavigationTreeActionType.FinishLoading:
|
|
69
71
|
{
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
})
|
|
76
|
-
});
|
|
72
|
+
var newState = _objectSpread(_objectSpread({}, state), {}, _defineProperty({}, action.payload.path, _objectSpread(_objectSpread({}, state[action.payload.path]), {}, {
|
|
73
|
+
loading: false,
|
|
74
|
+
loaded: Boolean(action.payload.data),
|
|
75
|
+
error: Boolean(action.payload.error)
|
|
76
|
+
})));
|
|
77
77
|
|
|
78
78
|
if (action.payload.data) {
|
|
79
|
-
newState[action.payload.path].children = action.payload.data.map(_ref
|
|
80
|
-
|
|
81
|
-
name
|
|
82
|
-
} = _ref;
|
|
79
|
+
newState[action.payload.path].children = action.payload.data.map(function (_ref) {
|
|
80
|
+
var name = _ref.name;
|
|
83
81
|
return name;
|
|
84
82
|
});
|
|
85
83
|
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
84
|
+
var _iterator = _createForOfIteratorHelper(action.payload.data),
|
|
85
|
+
_step;
|
|
86
|
+
|
|
87
|
+
try {
|
|
88
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
89
|
+
var _state$path$collapsed, _state$path;
|
|
90
|
+
|
|
91
|
+
var item = _step.value;
|
|
92
|
+
var path = "".concat(action.payload.path, "/").concat(item.name); // expand the tree according to the active path
|
|
93
|
+
// prioritize the existing state to expand the tree only on first load
|
|
94
|
+
|
|
95
|
+
var _action$payload$activ = action.payload.activePath,
|
|
96
|
+
activePath = _action$payload$activ === void 0 ? '' : _action$payload$activ;
|
|
97
|
+
var collapsed = (_state$path$collapsed = (_state$path = state[path]) === null || _state$path === void 0 ? void 0 : _state$path.collapsed) !== null && _state$path$collapsed !== void 0 ? _state$path$collapsed : !activePath.startsWith("".concat(path, "/"));
|
|
98
|
+
newState[path] = getNodeState(_objectSpread(_objectSpread({}, item), {}, {
|
|
99
|
+
collapsed: collapsed,
|
|
100
|
+
path: path
|
|
101
|
+
}));
|
|
102
|
+
}
|
|
103
|
+
} catch (err) {
|
|
104
|
+
_iterator.e(err);
|
|
105
|
+
} finally {
|
|
106
|
+
_iterator.f();
|
|
100
107
|
}
|
|
101
108
|
}
|
|
102
109
|
|
|
@@ -104,9 +111,7 @@ function reducer() {
|
|
|
104
111
|
}
|
|
105
112
|
|
|
106
113
|
case NavigationTreeActionType.ResetNode:
|
|
107
|
-
return _objectSpread(_objectSpread({}, state), {}, {
|
|
108
|
-
[action.payload.path]: _objectSpread(_objectSpread({}, state[action.payload.path]), getDefaultNodeState())
|
|
109
|
-
});
|
|
114
|
+
return _objectSpread(_objectSpread({}, state), {}, _defineProperty({}, action.payload.path, _objectSpread(_objectSpread({}, state[action.payload.path]), getDefaultNodeState())));
|
|
110
115
|
|
|
111
116
|
default:
|
|
112
117
|
return state;
|
|
@@ -114,12 +119,12 @@ function reducer() {
|
|
|
114
119
|
}
|
|
115
120
|
|
|
116
121
|
function selectTreeAsList(state, rootPath) {
|
|
117
|
-
|
|
118
|
-
(0, _utils.traverseDFS)(state, rootPath, (node, level)
|
|
122
|
+
var list = [];
|
|
123
|
+
(0, _utils.traverseDFS)(state, rootPath, function (node, level) {
|
|
119
124
|
list.push(_objectSpread(_objectSpread({}, node), {}, {
|
|
120
|
-
level
|
|
125
|
+
level: level
|
|
121
126
|
}));
|
|
122
|
-
|
|
127
|
+
var serviceNode = (0, _utils.getServiceNode)(node, level);
|
|
123
128
|
|
|
124
129
|
if (serviceNode) {
|
|
125
130
|
list.push(serviceNode);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { DropdownMenuItemMixed } from '@
|
|
1
|
+
import { DropdownMenuItemMixed } from '@gravity-ui/uikit';
|
|
2
2
|
export declare type NavigationTreeNodeType = 'database' | 'directory' | 'table' | 'column_table' | 'index_table' | 'index' | 'topic';
|
|
3
3
|
export interface NavigationTreeDataItem {
|
|
4
4
|
name: string;
|