@teambit/component.ui.version-dropdown 0.0.907 → 0.0.909
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/dist/{preview-1756496771585.js → preview-1757423686319.js} +2 -2
- package/dist/version-dropdown-placeholder.module.scss +1 -1
- package/dist/version-dropdown.d.ts +3 -3
- package/dist/version-dropdown.js +17 -22
- package/dist/version-dropdown.js.map +1 -1
- package/dist/version-dropdown.module.scss +14 -21
- package/dist/version-info/version-info.js.map +1 -1
- package/dist/version-info/version-info.module.scss +0 -1
- package/package.json +4 -4
- package/version-dropdown-placeholder.module.scss +1 -1
- package/version-dropdown.module.scss +14 -21
- package/version-dropdown.tsx +29 -35
- package/version-info/version-info.module.scss +0 -1
- package/version-info/version-info.tsx +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.component_ui_version-dropdown@0.0.
|
|
2
|
-
import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.component_ui_version-dropdown@0.0.
|
|
1
|
+
import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.component_ui_version-dropdown@0.0.909/dist/version-dropdown.composition.js';
|
|
2
|
+
import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad/teambit.component_ui_version-dropdown@0.0.909/dist/version-dropdown.docs.js';
|
|
3
3
|
|
|
4
4
|
export const compositions = [compositions_0];
|
|
5
5
|
export const overview = [overview_0];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { type ComponentType, type HTMLAttributes } from 'react';
|
|
2
2
|
import type { LegacyComponentLog } from '@teambit/legacy-component-log';
|
|
3
3
|
import type { LaneModel } from '@teambit/lanes.ui.models.lanes-model';
|
|
4
4
|
import type { VersionProps } from './version-dropdown-placeholder';
|
|
@@ -36,8 +36,8 @@ export type VersionDropdownProps = {
|
|
|
36
36
|
menuClassName?: string;
|
|
37
37
|
showVersionDetails?: boolean;
|
|
38
38
|
disabled?: boolean;
|
|
39
|
-
PlaceholderComponent?:
|
|
40
|
-
} &
|
|
39
|
+
PlaceholderComponent?: ComponentType<VersionProps>;
|
|
40
|
+
} & HTMLAttributes<HTMLDivElement>;
|
|
41
41
|
export declare const VersionDropdown: React.MemoExoticComponent<typeof _VersionDropdown>;
|
|
42
42
|
declare function _VersionDropdown({ currentVersion, latestVersion, localVersion, useCurrentVersionLog, hasMoreVersions, loading, overrideVersionHref, className, placeholderClassName, getActiveTabIndex, dropdownClassName, menuClassName, showVersionDetails, disabled, PlaceholderComponent: _PlaceholderComponent, currentLane, useComponentVersions, lanes, ...rest }: VersionDropdownProps): React.JSX.Element;
|
|
43
43
|
export type VersionMenuTab = {
|
package/dist/version-dropdown.js
CHANGED
|
@@ -50,14 +50,14 @@ const version_info_1 = require("./version-info");
|
|
|
50
50
|
const lane_info_1 = require("./lane-info");
|
|
51
51
|
const version_dropdown_placeholder_1 = require("./version-dropdown-placeholder");
|
|
52
52
|
exports.LOCAL_VERSION = 'workspace';
|
|
53
|
-
exports.VersionDropdown = react_1.
|
|
54
|
-
const VersionMenu = react_1.
|
|
53
|
+
exports.VersionDropdown = (0, react_1.memo)(_VersionDropdown);
|
|
54
|
+
const VersionMenu = (0, react_1.memo)(_VersionMenu);
|
|
55
55
|
function _VersionDropdown(_a) {
|
|
56
56
|
var { currentVersion, latestVersion, localVersion, useCurrentVersionLog, hasMoreVersions, loading, overrideVersionHref, className, placeholderClassName, getActiveTabIndex, dropdownClassName, menuClassName, showVersionDetails = true, disabled, PlaceholderComponent: _PlaceholderComponent, currentLane, useComponentVersions, lanes } = _a, rest = __rest(_a, ["currentVersion", "latestVersion", "localVersion", "useCurrentVersionLog", "hasMoreVersions", "loading", "overrideVersionHref", "className", "placeholderClassName", "getActiveTabIndex", "dropdownClassName", "menuClassName", "showVersionDetails", "disabled", "PlaceholderComponent", "currentLane", "useComponentVersions", "lanes"]);
|
|
57
57
|
const [key, setKey] = (0, react_1.useState)(0);
|
|
58
58
|
const singleVersion = !hasMoreVersions;
|
|
59
59
|
const [open, setOpen] = (0, react_1.useState)(false);
|
|
60
|
-
react_1.
|
|
60
|
+
(0, react_1.useEffect)(() => {
|
|
61
61
|
if (loading && open) {
|
|
62
62
|
setOpen(false);
|
|
63
63
|
}
|
|
@@ -88,11 +88,11 @@ const defaultActiveTabIndex = (currentVersion, tabs = [], tags, snaps) => {
|
|
|
88
88
|
};
|
|
89
89
|
const VERSION_TAB_NAMES = ['TAG', 'SNAP', 'LANE'];
|
|
90
90
|
function _VersionMenu(_a) {
|
|
91
|
-
var _b
|
|
91
|
+
var _b;
|
|
92
92
|
var { currentVersion, localVersion, latestVersion, overrideVersionHref, showVersionDetails, useVersions, currentLane, lanes, getActiveTabIndex = defaultActiveTabIndex, loading: loadingFromProps, open, onVersionClicked } = _a, rest = __rest(_a, ["currentVersion", "localVersion", "latestVersion", "overrideVersionHref", "showVersionDetails", "useVersions", "currentLane", "lanes", "getActiveTabIndex", "loading", "open", "onVersionClicked"]);
|
|
93
93
|
const { snaps, tags, loading: loadingVersions } = (useVersions === null || useVersions === void 0 ? void 0 : useVersions()) || {};
|
|
94
94
|
const loading = loadingFromProps || loadingVersions;
|
|
95
|
-
const tabs = react_1.
|
|
95
|
+
const tabs = (0, react_1.useMemo)(() => VERSION_TAB_NAMES.map((name) => {
|
|
96
96
|
switch (name) {
|
|
97
97
|
case 'SNAP':
|
|
98
98
|
return { name, payload: snaps || [] };
|
|
@@ -102,9 +102,9 @@ function _VersionMenu(_a) {
|
|
|
102
102
|
return { name, payload: tags || [] };
|
|
103
103
|
}
|
|
104
104
|
}).filter((tab) => tab.payload.length > 0), [snaps === null || snaps === void 0 ? void 0 : snaps.length, tags === null || tags === void 0 ? void 0 : tags.length, lanes === null || lanes === void 0 ? void 0 : lanes.length, loading]);
|
|
105
|
-
const [activeTabIndex, setActiveTab] = react_1.
|
|
106
|
-
const activeTab = react_1.
|
|
107
|
-
react_1.
|
|
105
|
+
const [activeTabIndex, setActiveTab] = (0, react_1.useState)(getActiveTabIndex(currentVersion, tabs, tags, snaps, currentLane));
|
|
106
|
+
const activeTab = (0, react_1.useMemo)(() => (activeTabIndex !== undefined ? tabs[activeTabIndex] : undefined), [activeTabIndex, tabs]);
|
|
107
|
+
(0, react_1.useEffect)(() => {
|
|
108
108
|
if (!currentLane)
|
|
109
109
|
return;
|
|
110
110
|
if (tabs.length === 0)
|
|
@@ -114,11 +114,8 @@ function _VersionMenu(_a) {
|
|
|
114
114
|
setActiveTab(_activeTabIndex);
|
|
115
115
|
}, [currentLane, tabs.length, tags === null || tags === void 0 ? void 0 : tags.length, snaps === null || snaps === void 0 ? void 0 : snaps.length, currentVersion, loading]);
|
|
116
116
|
const multipleTabs = tabs.length > 1;
|
|
117
|
-
const
|
|
118
|
-
|
|
119
|
-
: `Switch between ${(_b = tabs[0]) === null || _b === void 0 ? void 0 : _b.name.toLocaleLowerCase()}s`;
|
|
120
|
-
const showTab = activeTabIndex !== undefined && ((_c = tabs[activeTabIndex]) === null || _c === void 0 ? void 0 : _c.payload.length) > 0;
|
|
121
|
-
const _rowRenderer = react_1.default.useCallback(function VersionRowRenderer({ index }) {
|
|
117
|
+
const showTab = activeTabIndex !== undefined && ((_b = tabs[activeTabIndex]) === null || _b === void 0 ? void 0 : _b.payload.length) > 0;
|
|
118
|
+
const _rowRenderer = (0, react_1.useCallback)(function VersionRowRenderer({ index }) {
|
|
122
119
|
const { name, payload = [] } = activeTab || {};
|
|
123
120
|
const item = payload[index];
|
|
124
121
|
if (!item)
|
|
@@ -130,20 +127,18 @@ function _VersionMenu(_a) {
|
|
|
130
127
|
const version = item;
|
|
131
128
|
return (react_1.default.createElement(version_info_1.VersionInfo, Object.assign({ key: version.version, currentVersion: currentVersion, latestVersion: latestVersion, overrideVersionHref: overrideVersionHref, showDetails: showVersionDetails, onVersionClicked: onVersionClicked }, version)));
|
|
132
129
|
}, [activeTab, currentVersion, latestVersion, showVersionDetails, currentLane === null || currentLane === void 0 ? void 0 : currentLane.id.toString(), showTab]);
|
|
133
|
-
const rowRenderer = react_1.
|
|
134
|
-
const ActiveTab = react_1.
|
|
130
|
+
const rowRenderer = (0, react_1.useMemo)(() => (showTab && activeTab ? _rowRenderer : () => null), [showTab, activeTab, _rowRenderer]);
|
|
131
|
+
const ActiveTab = (0, react_1.useMemo)(() => {
|
|
135
132
|
return activeTab === null || activeTab === void 0 ? void 0 : activeTab.payload.map((payload, index) => {
|
|
136
133
|
return rowRenderer({ index });
|
|
137
134
|
});
|
|
138
135
|
}, [activeTab]);
|
|
139
136
|
return (react_1.default.createElement("div", Object.assign({}, rest, { className: (0, classnames_1.default)(version_dropdown_module_scss_1.default.versionMenuContainer, !open && version_dropdown_module_scss_1.default.hide) }),
|
|
140
|
-
react_1.default.createElement(
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
react_1.default.createElement("
|
|
145
|
-
react_1.default.createElement(design_ui_avatar_1.UserAvatar, { size: 24, account: {}, className: version_dropdown_module_scss_1.default.versionUserAvatar }),
|
|
146
|
-
react_1.default.createElement("span", { className: version_dropdown_module_scss_1.default.versionName }, exports.LOCAL_VERSION))))),
|
|
137
|
+
loading && react_1.default.createElement(base_ui_loaders_skeleton_1.LineSkeleton, { count: 6, className: version_dropdown_module_scss_1.default.loader }),
|
|
138
|
+
!loading && localVersion && (react_1.default.createElement(design_ui_surfaces_menu_link_item_1.MenuLinkItem, { href: '?', active: currentVersion === exports.LOCAL_VERSION, className: (0, classnames_1.default)(version_dropdown_module_scss_1.default.versionRow, version_dropdown_module_scss_1.default.localVersion), onClick: onVersionClicked },
|
|
139
|
+
react_1.default.createElement("div", { className: version_dropdown_module_scss_1.default.version },
|
|
140
|
+
react_1.default.createElement(design_ui_avatar_1.UserAvatar, { size: 24, account: {}, className: version_dropdown_module_scss_1.default.versionUserAvatar }),
|
|
141
|
+
react_1.default.createElement("span", { className: version_dropdown_module_scss_1.default.versionName }, exports.LOCAL_VERSION)))),
|
|
147
142
|
react_1.default.createElement("div", { className: (0, classnames_1.default)(multipleTabs && version_dropdown_module_scss_1.default.tabs) }, multipleTabs &&
|
|
148
143
|
tabs.map(({ name }, index) => {
|
|
149
144
|
return (react_1.default.createElement(ui_foundation_ui_use_box_tab_1.Tab, { className: version_dropdown_module_scss_1.default.tab, key: name, isActive: activeTabIndex === index, onClick: () => setActiveTab(index) }, name));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version-dropdown.js","sourceRoot":"","sources":["../version-dropdown.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"version-dropdown.js","sourceRoot":"","sources":["../version-dropdown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,40 +1,21 @@
|
|
|
1
1
|
@import '@teambit/ui-foundation.ui.constants.z-indexes/z-indexes.module.scss';
|
|
2
2
|
|
|
3
3
|
.versionDropdown {
|
|
4
|
-
height: 100%;
|
|
5
|
-
|
|
6
|
-
> div {
|
|
7
|
-
height: 100%;
|
|
8
|
-
display: flex;
|
|
9
|
-
align-items: center;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
4
|
.menu {
|
|
13
5
|
padding: 0;
|
|
14
6
|
right: 0;
|
|
15
|
-
// top: 43px;
|
|
16
7
|
font-size: var(--bit-p-xs);
|
|
17
|
-
border-radius:
|
|
8
|
+
border-radius: 8px;
|
|
18
9
|
z-index: $modal-z-index;
|
|
19
10
|
border: 1px solid var(--border-medium-color, #ededed);
|
|
20
11
|
}
|
|
21
12
|
}
|
|
22
13
|
|
|
23
|
-
.title {
|
|
24
|
-
padding: 16px;
|
|
25
|
-
padding-bottom: 12px;
|
|
26
|
-
border-bottom: 1px solid var(--bit-border-color-lightest, #ededed);
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.titleContainer {
|
|
30
|
-
margin-bottom: 2px;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
14
|
.versionContainerRoot {
|
|
34
15
|
max-height: 240px;
|
|
35
16
|
overflow-y: scroll;
|
|
36
|
-
padding-bottom: 8px;
|
|
37
17
|
position: relative;
|
|
18
|
+
padding-bottom: 8px;
|
|
38
19
|
}
|
|
39
20
|
|
|
40
21
|
.versionRow {
|
|
@@ -50,6 +31,8 @@
|
|
|
50
31
|
|
|
51
32
|
&.localVersion {
|
|
52
33
|
border-bottom: 1px solid var(--bit-border-color-lightest, #ededed);
|
|
34
|
+
border-top-left-radius: 7px;
|
|
35
|
+
border-top-right-radius: 7px;
|
|
53
36
|
}
|
|
54
37
|
|
|
55
38
|
.versionTimestamp {
|
|
@@ -75,6 +58,7 @@
|
|
|
75
58
|
.versionName {
|
|
76
59
|
padding: 0px 8px;
|
|
77
60
|
min-width: fit-content;
|
|
61
|
+
text-transform: capitalize;
|
|
78
62
|
}
|
|
79
63
|
}
|
|
80
64
|
|
|
@@ -130,6 +114,15 @@
|
|
|
130
114
|
|
|
131
115
|
> div {
|
|
132
116
|
padding: 8px 0px;
|
|
117
|
+
border-radius: 0px;
|
|
118
|
+
&:first-child {
|
|
119
|
+
border-top-left-radius: 7px;
|
|
120
|
+
border-top-right-radius: 7px;
|
|
121
|
+
}
|
|
122
|
+
&:last-child {
|
|
123
|
+
border-bottom-left-radius: 7px;
|
|
124
|
+
border-bottom-right-radius: 7px;
|
|
125
|
+
}
|
|
133
126
|
}
|
|
134
127
|
}
|
|
135
128
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version-info.js","sourceRoot":"","sources":["../../version-info/version-info.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kGAA0E;AAC1E,oEAAsD;AACtD,oFAAmE;AACnE,+CAA0D;AAC1D,gEAAuD;AACvD,kFAA8D;AAC9D,4DAAoC;
|
|
1
|
+
{"version":3,"file":"version-info.js","sourceRoot":"","sources":["../../version-info/version-info.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,18 +1,19 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@teambit/component.ui.version-dropdown",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.909",
|
|
4
4
|
"homepage": "https://bit.cloud/teambit/component/ui/version-dropdown",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"componentId": {
|
|
7
7
|
"scope": "teambit.component",
|
|
8
8
|
"name": "ui/version-dropdown",
|
|
9
|
-
"version": "0.0.
|
|
9
|
+
"version": "0.0.909"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"classnames": "2.2.6",
|
|
13
13
|
"semver": "7.7.1",
|
|
14
14
|
"core-js": "^3.0.0",
|
|
15
15
|
"@teambit/base-ui.loaders.skeleton": "1.0.1",
|
|
16
|
+
"@teambit/design.ui.avatar": "1.1.22",
|
|
16
17
|
"@teambit/design.ui.styles.ellipsis": "0.0.357",
|
|
17
18
|
"@teambit/design.ui.time-ago": "0.0.381",
|
|
18
19
|
"@teambit/evangelist.elements.icon": "1.0.5",
|
|
@@ -22,8 +23,7 @@
|
|
|
22
23
|
"@teambit/lanes.ui.models.lanes-model": "0.0.229",
|
|
23
24
|
"@teambit/legacy-component-log": "0.0.410",
|
|
24
25
|
"@teambit/ui-foundation.ui.use-box.tab": "0.0.122",
|
|
25
|
-
"@teambit/component.ui.version-label": "0.0.509"
|
|
26
|
-
"@teambit/design.ui.avatar": "1.1.21"
|
|
26
|
+
"@teambit/component.ui.version-label": "0.0.509"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@types/classnames": "2.2.11",
|
|
@@ -1,40 +1,21 @@
|
|
|
1
1
|
@import '@teambit/ui-foundation.ui.constants.z-indexes/z-indexes.module.scss';
|
|
2
2
|
|
|
3
3
|
.versionDropdown {
|
|
4
|
-
height: 100%;
|
|
5
|
-
|
|
6
|
-
> div {
|
|
7
|
-
height: 100%;
|
|
8
|
-
display: flex;
|
|
9
|
-
align-items: center;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
4
|
.menu {
|
|
13
5
|
padding: 0;
|
|
14
6
|
right: 0;
|
|
15
|
-
// top: 43px;
|
|
16
7
|
font-size: var(--bit-p-xs);
|
|
17
|
-
border-radius:
|
|
8
|
+
border-radius: 8px;
|
|
18
9
|
z-index: $modal-z-index;
|
|
19
10
|
border: 1px solid var(--border-medium-color, #ededed);
|
|
20
11
|
}
|
|
21
12
|
}
|
|
22
13
|
|
|
23
|
-
.title {
|
|
24
|
-
padding: 16px;
|
|
25
|
-
padding-bottom: 12px;
|
|
26
|
-
border-bottom: 1px solid var(--bit-border-color-lightest, #ededed);
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.titleContainer {
|
|
30
|
-
margin-bottom: 2px;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
14
|
.versionContainerRoot {
|
|
34
15
|
max-height: 240px;
|
|
35
16
|
overflow-y: scroll;
|
|
36
|
-
padding-bottom: 8px;
|
|
37
17
|
position: relative;
|
|
18
|
+
padding-bottom: 8px;
|
|
38
19
|
}
|
|
39
20
|
|
|
40
21
|
.versionRow {
|
|
@@ -50,6 +31,8 @@
|
|
|
50
31
|
|
|
51
32
|
&.localVersion {
|
|
52
33
|
border-bottom: 1px solid var(--bit-border-color-lightest, #ededed);
|
|
34
|
+
border-top-left-radius: 7px;
|
|
35
|
+
border-top-right-radius: 7px;
|
|
53
36
|
}
|
|
54
37
|
|
|
55
38
|
.versionTimestamp {
|
|
@@ -75,6 +58,7 @@
|
|
|
75
58
|
.versionName {
|
|
76
59
|
padding: 0px 8px;
|
|
77
60
|
min-width: fit-content;
|
|
61
|
+
text-transform: capitalize;
|
|
78
62
|
}
|
|
79
63
|
}
|
|
80
64
|
|
|
@@ -130,6 +114,15 @@
|
|
|
130
114
|
|
|
131
115
|
> div {
|
|
132
116
|
padding: 8px 0px;
|
|
117
|
+
border-radius: 0px;
|
|
118
|
+
&:first-child {
|
|
119
|
+
border-top-left-radius: 7px;
|
|
120
|
+
border-top-right-radius: 7px;
|
|
121
|
+
}
|
|
122
|
+
&:last-child {
|
|
123
|
+
border-bottom-left-radius: 7px;
|
|
124
|
+
border-bottom-right-radius: 7px;
|
|
125
|
+
}
|
|
133
126
|
}
|
|
134
127
|
}
|
|
135
128
|
|
package/version-dropdown.tsx
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useState } from 'react';
|
|
1
|
+
import React, { useState, useEffect, useCallback, useMemo, memo, type ComponentType, type HTMLAttributes } from 'react';
|
|
2
2
|
import { MenuLinkItem } from '@teambit/design.ui.surfaces.menu.link-item';
|
|
3
3
|
import { Dropdown } from '@teambit/evangelist.surfaces.dropdown';
|
|
4
4
|
import { Tab } from '@teambit/ui-foundation.ui.use-box.tab';
|
|
@@ -52,11 +52,11 @@ export type VersionDropdownProps = {
|
|
|
52
52
|
menuClassName?: string;
|
|
53
53
|
showVersionDetails?: boolean;
|
|
54
54
|
disabled?: boolean;
|
|
55
|
-
PlaceholderComponent?:
|
|
56
|
-
} &
|
|
55
|
+
PlaceholderComponent?: ComponentType<VersionProps>;
|
|
56
|
+
} & HTMLAttributes<HTMLDivElement>;
|
|
57
57
|
|
|
58
|
-
export const VersionDropdown =
|
|
59
|
-
const VersionMenu =
|
|
58
|
+
export const VersionDropdown = memo(_VersionDropdown);
|
|
59
|
+
const VersionMenu = memo(_VersionMenu);
|
|
60
60
|
function _VersionDropdown({
|
|
61
61
|
currentVersion,
|
|
62
62
|
latestVersion,
|
|
@@ -82,7 +82,7 @@ function _VersionDropdown({
|
|
|
82
82
|
const singleVersion = !hasMoreVersions;
|
|
83
83
|
const [open, setOpen] = useState(false);
|
|
84
84
|
|
|
85
|
-
|
|
85
|
+
useEffect(() => {
|
|
86
86
|
if (loading && open) {
|
|
87
87
|
setOpen(false);
|
|
88
88
|
}
|
|
@@ -176,7 +176,7 @@ type VersionMenuProps = {
|
|
|
176
176
|
getActiveTabIndex?: GetActiveTabIndex;
|
|
177
177
|
open?: boolean;
|
|
178
178
|
onVersionClicked?: () => void;
|
|
179
|
-
} &
|
|
179
|
+
} & HTMLAttributes<HTMLDivElement>;
|
|
180
180
|
|
|
181
181
|
export type VersionMenuTab =
|
|
182
182
|
| {
|
|
@@ -217,7 +217,7 @@ function _VersionMenu({
|
|
|
217
217
|
const { snaps, tags, loading: loadingVersions } = useVersions?.() || {};
|
|
218
218
|
const loading = loadingFromProps || loadingVersions;
|
|
219
219
|
|
|
220
|
-
const tabs =
|
|
220
|
+
const tabs = useMemo(
|
|
221
221
|
() =>
|
|
222
222
|
VERSION_TAB_NAMES.map((name) => {
|
|
223
223
|
switch (name) {
|
|
@@ -232,16 +232,16 @@ function _VersionMenu({
|
|
|
232
232
|
[snaps?.length, tags?.length, lanes?.length, loading]
|
|
233
233
|
);
|
|
234
234
|
|
|
235
|
-
const [activeTabIndex, setActiveTab] =
|
|
235
|
+
const [activeTabIndex, setActiveTab] = useState<number | undefined>(
|
|
236
236
|
getActiveTabIndex(currentVersion, tabs, tags, snaps, currentLane)
|
|
237
237
|
);
|
|
238
238
|
|
|
239
|
-
const activeTab =
|
|
239
|
+
const activeTab = useMemo(
|
|
240
240
|
() => (activeTabIndex !== undefined ? tabs[activeTabIndex] : undefined),
|
|
241
241
|
[activeTabIndex, tabs]
|
|
242
242
|
);
|
|
243
243
|
|
|
244
|
-
|
|
244
|
+
useEffect(() => {
|
|
245
245
|
if (!currentLane) return;
|
|
246
246
|
if (tabs.length === 0) return;
|
|
247
247
|
const _activeTabIndex = getActiveTabIndex(currentVersion, tabs, tags, snaps, currentLane);
|
|
@@ -249,13 +249,10 @@ function _VersionMenu({
|
|
|
249
249
|
}, [currentLane, tabs.length, tags?.length, snaps?.length, currentVersion, loading]);
|
|
250
250
|
|
|
251
251
|
const multipleTabs = tabs.length > 1;
|
|
252
|
-
const message = multipleTabs
|
|
253
|
-
? 'Switch to view tags, snaps, or lanes'
|
|
254
|
-
: `Switch between ${tabs[0]?.name.toLocaleLowerCase()}s`;
|
|
255
252
|
|
|
256
253
|
const showTab = activeTabIndex !== undefined && tabs[activeTabIndex]?.payload.length > 0;
|
|
257
254
|
|
|
258
|
-
const _rowRenderer =
|
|
255
|
+
const _rowRenderer = useCallback(
|
|
259
256
|
function VersionRowRenderer({ index }) {
|
|
260
257
|
const { name, payload = [] } = activeTab || {};
|
|
261
258
|
const item = payload[index];
|
|
@@ -274,18 +271,18 @@ function _VersionMenu({
|
|
|
274
271
|
showDetails={showVersionDetails}
|
|
275
272
|
onVersionClicked={onVersionClicked}
|
|
276
273
|
{...version}
|
|
277
|
-
|
|
274
|
+
/>
|
|
278
275
|
);
|
|
279
276
|
},
|
|
280
277
|
[activeTab, currentVersion, latestVersion, showVersionDetails, currentLane?.id.toString(), showTab]
|
|
281
278
|
);
|
|
282
279
|
|
|
283
|
-
const rowRenderer =
|
|
280
|
+
const rowRenderer = useMemo(
|
|
284
281
|
() => (showTab && activeTab ? _rowRenderer : () => null),
|
|
285
282
|
[showTab, activeTab, _rowRenderer]
|
|
286
283
|
);
|
|
287
284
|
|
|
288
|
-
const ActiveTab =
|
|
285
|
+
const ActiveTab = useMemo(() => {
|
|
289
286
|
return activeTab?.payload.map((payload, index) => {
|
|
290
287
|
return rowRenderer({ index });
|
|
291
288
|
});
|
|
@@ -293,23 +290,20 @@ function _VersionMenu({
|
|
|
293
290
|
|
|
294
291
|
return (
|
|
295
292
|
<div {...rest} className={classNames(styles.versionMenuContainer, !open && styles.hide)}>
|
|
296
|
-
<
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
<
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
</MenuLinkItem>
|
|
311
|
-
)}
|
|
312
|
-
</div>
|
|
293
|
+
{loading && <LineSkeleton count={6} className={styles.loader} />}
|
|
294
|
+
{!loading && localVersion && (
|
|
295
|
+
<MenuLinkItem
|
|
296
|
+
href={'?'}
|
|
297
|
+
active={currentVersion === LOCAL_VERSION}
|
|
298
|
+
className={classNames(styles.versionRow, styles.localVersion)}
|
|
299
|
+
onClick={onVersionClicked}
|
|
300
|
+
>
|
|
301
|
+
<div className={styles.version}>
|
|
302
|
+
<UserAvatar size={24} account={{}} className={styles.versionUserAvatar} />
|
|
303
|
+
<span className={styles.versionName}>{LOCAL_VERSION}</span>
|
|
304
|
+
</div>
|
|
305
|
+
</MenuLinkItem>
|
|
306
|
+
)}
|
|
313
307
|
<div className={classNames(multipleTabs && styles.tabs)}>
|
|
314
308
|
{multipleTabs &&
|
|
315
309
|
tabs.map(({ name }, index) => {
|
|
@@ -5,7 +5,6 @@ import React, { useMemo, useRef, useEffect } from 'react';
|
|
|
5
5
|
import { UserAvatar } from '@teambit/design.ui.avatar';
|
|
6
6
|
import { Ellipsis } from '@teambit/design.ui.styles.ellipsis';
|
|
7
7
|
import classNames from 'classnames';
|
|
8
|
-
|
|
9
8
|
import type { DropdownComponentVersion } from '../version-dropdown';
|
|
10
9
|
import styles from './version-info.module.scss';
|
|
11
10
|
|