@teambit/component 0.0.996 → 0.0.999

package/dist/{preview-1677382720052.js → preview-1677555458635.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.996/dist/component.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.996/dist/component.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.999/dist/component.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.999/dist/component.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/dist/ui/menu/menu.js

@@ -196,7 +196,7 @@ function VersionRelatedDropdowns({
   const {
     lanesModel
   } = (0, _lanesHooks().useLanes)();
-  const currentLane = lanesModel !== null && lanesModel !== void 0 && (_lanesModel$viewedLan = lanesModel.viewedLane) !== null && _lanesModel$viewedLan !== void 0 && _lanesModel$viewedLan.id && !(lanesModel !== null && lanesModel !== void 0 && (_lanesModel$viewedLan2 = lanesModel.viewedLane) !== null && _lanesModel$viewedLan2 !== void 0 && _lanesModel$viewedLan2.id.isDefault()) ? lanesModel.viewedLane : undefined;
+  const viewedLane = lanesModel !== null && lanesModel !== void 0 && (_lanesModel$viewedLan = lanesModel.viewedLane) !== null && _lanesModel$viewedLan !== void 0 && _lanesModel$viewedLan.id && !(lanesModel !== null && lanesModel !== void 0 && (_lanesModel$viewedLan2 = lanesModel.viewedLane) !== null && _lanesModel$viewedLan2 !== void 0 && _lanesModel$viewedLan2.id.isDefault()) ? lanesModel.viewedLane : undefined;
   const {
     logs
   } = component;
@@ -218,9 +218,9 @@ function VersionRelatedDropdowns({
   }, [logs]);
   const isNew = snaps.length === 0 && tags.length === 0;
   const lanes = (lanesModel === null || lanesModel === void 0 ? void 0 : (_lanesModel$getLanesB = lanesModel.getLanesByComponentId(component.id)) === null || _lanesModel$getLanesB === void 0 ? void 0 : _lanesModel$getLanesB.filter(lane => !lane.id.isDefault())) || [];
-  const localVersion = isWorkspace && !isNew && !currentLane;
+  const localVersion = isWorkspace && !isNew && (!viewedLane || (lanesModel === null || lanesModel === void 0 ? void 0 : lanesModel.isViewingCurrentLane()));
   const currentVersion = isWorkspace && !isNew && !(location !== null && location !== void 0 && location.search.includes('version')) ? 'workspace' : component.version;
-  const methods = useConsumeMethods(component, consumeMethods, currentLane);
+  const methods = useConsumeMethods(component, consumeMethods, viewedLane);
   return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, consumeMethods && tags.length > 0 && /*#__PURE__*/_react().default.createElement(_uiFoundationUiUseBox().UseBoxDropdown, {
     position: "bottom-end",
     className: (0, _classnames().default)(_menuModule().default.useBox, _menuModule().default.hideOnMobile),
@@ -235,7 +235,7 @@ function VersionRelatedDropdowns({
     localVersion: localVersion,
     currentVersion: currentVersion,
     latestVersion: component.latest,
-    currentLane: currentLane,
+    currentLane: viewedLane,
     className: className,
     menuClassName: _menuModule().default.componentVersionMenu
   }));

package/dist/ui/menu/menu.js.map

@@ -1 +1 @@
-{"version":3,"names":["getComponentIdStr","componentIdStr","isFunction","ComponentMenu","navigationSlot","widgetSlot","className","host","menuItemSlot","consumeMethodSlot","skipRightSide","useComponent","path","useComponentFilters","idFromLocation","useIdFromLocation","_componentIdStr","componentId","ComponentID","fromString","undefined","resolvedComponentIdStr","useComponentOptions","logFilters","customUseComponent","component","useComponentQuery","toString","mainMenuItems","useMemo","groupBy","flatten","values","classnames","styles","topBar","leftSide","rightSide","hideOnMobile","VersionRelatedDropdowns","consumeMethods","location","useLocation","lanesModel","useLanes","currentLane","viewedLane","id","isDefault","logs","isWorkspace","snaps","filter","log","tag","map","snap","version","hash","tags","tagLookup","Map","forEach","set","compact","toArray","reverse","get","isNew","length","lanes","getLanesByComponentId","lane","localVersion","currentVersion","search","includes","methods","useConsumeMethods","useBox","name","latest","componentVersionMenu","componentModel","method","x","Component","Title"],"sources":["menu.tsx"],"sourcesContent":["import { Routes, Route } from 'react-router-dom';\nimport { MainDropdown, MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';\nimport { VersionDropdown } from '@teambit/component.ui.version-dropdown';\nimport { FullLoader } from '@teambit/ui-foundation.ui.full-loader';\nimport type { ConsumeMethod } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { useLocation } from '@teambit/base-react.navigation.link';\nimport { flatten, groupBy, compact, isFunction } from 'lodash';\nimport classnames from 'classnames';\nimport React, { useMemo } from 'react';\nimport { UseBoxDropdown } from '@teambit/ui-foundation.ui.use-box.dropdown';\nimport { useLanes } from '@teambit/lanes.hooks.use-lanes';\nimport { LaneModel } from '@teambit/lanes.ui.models.lanes-model';\nimport { Menu as ConsumeMethodsMenu } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { LegacyComponentLog } from '@teambit/legacy-component-log';\nimport type { ComponentModel } from '../component-model';\nimport { useComponent as useComponentQuery, UseComponentType } from '../use-component';\nimport { CollapsibleMenuNav } from './menu-nav';\nimport styles from './menu.module.scss';\nimport { OrderedNavigationSlot, ConsumeMethodSlot } from './nav-plugin';\nimport { useIdFromLocation } from '../use-component-from-location';\nimport { ComponentID } from '../..';\nimport { Filters } from '../use-component-query';\n\nexport type MenuProps = {\n  className?: string;\n\n  /**\n   * skip the right side.\n   */\n  skipRightSide?: boolean;\n\n  /**\n   * slot for top bar menu nav items\n   */\n  navigationSlot: OrderedNavigationSlot;\n  /**\n   * right side menu item slot\n   */\n  widgetSlot: OrderedNavigationSlot;\n  host: string;\n  /**\n   * main dropdown item slot\n   */\n  menuItemSlot: MenuItemSlot;\n\n  consumeMethodSlot: ConsumeMethodSlot;\n\n  componentIdStr?: string | (() => string | undefined);\n\n  useComponent?: UseComponentType;\n\n  path?: string;\n\n  useComponentFilters?: () => Filters;\n};\nfunction getComponentIdStr(componentIdStr?: string | (() => string | undefined)): string | undefined {\n  if (isFunction(componentIdStr)) return componentIdStr();\n  return componentIdStr;\n}\n/**\n * top bar menu.\n */\nexport function ComponentMenu({\n  navigationSlot,\n  widgetSlot,\n  className,\n  host,\n  menuItemSlot,\n  consumeMethodSlot,\n  componentIdStr,\n  skipRightSide,\n  useComponent,\n  path,\n  useComponentFilters,\n}: MenuProps) {\n  const idFromLocation = useIdFromLocation();\n  const _componentIdStr = getComponentIdStr(componentIdStr);\n  const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;\n  const resolvedComponentIdStr = path || idFromLocation;\n\n  const useComponentOptions = {\n    logFilters: useComponentFilters?.(),\n    customUseComponent: useComponent,\n  };\n\n  const { component } = useComponentQuery(host, componentId?.toString() || idFromLocation, useComponentOptions);\n  const mainMenuItems = useMemo(() => groupBy(flatten(menuItemSlot.values()), 'category'), [menuItemSlot]);\n  if (!component) return <FullLoader />;\n  return (\n    <Routes>\n      <Route\n        path={`${resolvedComponentIdStr}/*`}\n        element={\n          <div className={classnames(styles.topBar, className)}>\n            <div className={styles.leftSide}>\n              <CollapsibleMenuNav navigationSlot={navigationSlot} widgetSlot={widgetSlot} />\n            </div>\n            {!skipRightSide && (\n              <div className={styles.rightSide}>\n                <VersionRelatedDropdowns component={component} consumeMethods={consumeMethodSlot} host={host} />\n                <MainDropdown className={styles.hideOnMobile} menuItems={mainMenuItems} />\n              </div>\n            )}\n          </div>\n        }\n      />\n    </Routes>\n  );\n}\n\nexport function VersionRelatedDropdowns({\n  component,\n  consumeMethods,\n  className,\n  host,\n}: {\n  component: ComponentModel;\n  consumeMethods?: ConsumeMethodSlot;\n  className?: string;\n  host: string;\n}) {\n  const location = useLocation();\n  const { lanesModel } = useLanes();\n  const currentLane =\n    lanesModel?.viewedLane?.id && !lanesModel?.viewedLane?.id.isDefault() ? lanesModel.viewedLane : undefined;\n\n  const { logs } = component;\n  const isWorkspace = host === 'teambit.workspace/workspace';\n\n  const snaps = useMemo(() => {\n    return (logs || []).filter((log) => !log.tag).map((snap) => ({ ...snap, version: snap.hash }));\n  }, [logs]);\n\n  const tags = useMemo(() => {\n    const tagLookup = new Map<string, LegacyComponentLog>();\n    (logs || [])\n      .filter((log) => log.tag)\n      .forEach((tag) => {\n        tagLookup.set(tag?.tag as string, tag);\n      });\n    return compact(\n      component.tags\n        ?.toArray()\n        .reverse()\n        .map((tag) => tagLookup.get(tag.version.version))\n    ).map((tag) => ({ ...tag, version: tag.tag as string }));\n  }, [logs]);\n\n  const isNew = snaps.length === 0 && tags.length === 0;\n\n  const lanes = lanesModel?.getLanesByComponentId(component.id)?.filter((lane) => !lane.id.isDefault()) || [];\n  const localVersion = isWorkspace && !isNew && !currentLane;\n\n  const currentVersion =\n    isWorkspace && !isNew && !location?.search.includes('version') ? 'workspace' : component.version;\n\n  const methods = useConsumeMethods(component, consumeMethods, currentLane);\n  return (\n    <>\n      {consumeMethods && tags.length > 0 && (\n        <UseBoxDropdown\n          position=\"bottom-end\"\n          className={classnames(styles.useBox, styles.hideOnMobile)}\n          Menu={<ConsumeMethodsMenu methods={methods} componentName={component.id.name} />}\n        />\n      )}\n      <VersionDropdown\n        tags={tags}\n        snaps={snaps}\n        lanes={lanes}\n        localVersion={localVersion}\n        currentVersion={currentVersion}\n        latestVersion={component.latest}\n        currentLane={currentLane}\n        className={className}\n        menuClassName={styles.componentVersionMenu}\n      />\n    </>\n  );\n}\n\nfunction useConsumeMethods(\n  componentModel?: ComponentModel,\n  consumeMethods?: ConsumeMethodSlot,\n  currentLane?: LaneModel\n): ConsumeMethod[] {\n  // if (!consumeMethods || !componentModel) return [];\n  return useMemo(\n    () =>\n      flatten(consumeMethods?.values())\n        .map((method) => {\n          if (!componentModel) return undefined;\n          return method?.(componentModel, { currentLane });\n        })\n        .filter((x) => !!x && x.Component && x.Title) as ConsumeMethod[],\n    [consumeMethods, componentModel, currentLane]\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["getComponentIdStr","componentIdStr","isFunction","ComponentMenu","navigationSlot","widgetSlot","className","host","menuItemSlot","consumeMethodSlot","skipRightSide","useComponent","path","useComponentFilters","idFromLocation","useIdFromLocation","_componentIdStr","componentId","ComponentID","fromString","undefined","resolvedComponentIdStr","useComponentOptions","logFilters","customUseComponent","component","useComponentQuery","toString","mainMenuItems","useMemo","groupBy","flatten","values","classnames","styles","topBar","leftSide","rightSide","hideOnMobile","VersionRelatedDropdowns","consumeMethods","location","useLocation","lanesModel","useLanes","viewedLane","id","isDefault","logs","isWorkspace","snaps","filter","log","tag","map","snap","version","hash","tags","tagLookup","Map","forEach","set","compact","toArray","reverse","get","isNew","length","lanes","getLanesByComponentId","lane","localVersion","isViewingCurrentLane","currentVersion","search","includes","methods","useConsumeMethods","useBox","name","latest","componentVersionMenu","componentModel","currentLane","method","x","Component","Title"],"sources":["menu.tsx"],"sourcesContent":["import { Routes, Route } from 'react-router-dom';\nimport { MainDropdown, MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';\nimport { VersionDropdown } from '@teambit/component.ui.version-dropdown';\nimport { FullLoader } from '@teambit/ui-foundation.ui.full-loader';\nimport type { ConsumeMethod } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { useLocation } from '@teambit/base-react.navigation.link';\nimport { flatten, groupBy, compact, isFunction } from 'lodash';\nimport classnames from 'classnames';\nimport React, { useMemo } from 'react';\nimport { UseBoxDropdown } from '@teambit/ui-foundation.ui.use-box.dropdown';\nimport { useLanes } from '@teambit/lanes.hooks.use-lanes';\nimport { LaneModel } from '@teambit/lanes.ui.models.lanes-model';\nimport { Menu as ConsumeMethodsMenu } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { LegacyComponentLog } from '@teambit/legacy-component-log';\nimport type { ComponentModel } from '../component-model';\nimport { useComponent as useComponentQuery, UseComponentType } from '../use-component';\nimport { CollapsibleMenuNav } from './menu-nav';\nimport styles from './menu.module.scss';\nimport { OrderedNavigationSlot, ConsumeMethodSlot } from './nav-plugin';\nimport { useIdFromLocation } from '../use-component-from-location';\nimport { ComponentID } from '../..';\nimport { Filters } from '../use-component-query';\n\nexport type MenuProps = {\n  className?: string;\n\n  /**\n   * skip the right side.\n   */\n  skipRightSide?: boolean;\n\n  /**\n   * slot for top bar menu nav items\n   */\n  navigationSlot: OrderedNavigationSlot;\n  /**\n   * right side menu item slot\n   */\n  widgetSlot: OrderedNavigationSlot;\n  host: string;\n  /**\n   * main dropdown item slot\n   */\n  menuItemSlot: MenuItemSlot;\n\n  consumeMethodSlot: ConsumeMethodSlot;\n\n  componentIdStr?: string | (() => string | undefined);\n\n  useComponent?: UseComponentType;\n\n  path?: string;\n\n  useComponentFilters?: () => Filters;\n};\nfunction getComponentIdStr(componentIdStr?: string | (() => string | undefined)): string | undefined {\n  if (isFunction(componentIdStr)) return componentIdStr();\n  return componentIdStr;\n}\n/**\n * top bar menu.\n */\nexport function ComponentMenu({\n  navigationSlot,\n  widgetSlot,\n  className,\n  host,\n  menuItemSlot,\n  consumeMethodSlot,\n  componentIdStr,\n  skipRightSide,\n  useComponent,\n  path,\n  useComponentFilters,\n}: MenuProps) {\n  const idFromLocation = useIdFromLocation();\n  const _componentIdStr = getComponentIdStr(componentIdStr);\n  const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;\n  const resolvedComponentIdStr = path || idFromLocation;\n\n  const useComponentOptions = {\n    logFilters: useComponentFilters?.(),\n    customUseComponent: useComponent,\n  };\n\n  const { component } = useComponentQuery(host, componentId?.toString() || idFromLocation, useComponentOptions);\n  const mainMenuItems = useMemo(() => groupBy(flatten(menuItemSlot.values()), 'category'), [menuItemSlot]);\n  if (!component) return <FullLoader />;\n  return (\n    <Routes>\n      <Route\n        path={`${resolvedComponentIdStr}/*`}\n        element={\n          <div className={classnames(styles.topBar, className)}>\n            <div className={styles.leftSide}>\n              <CollapsibleMenuNav navigationSlot={navigationSlot} widgetSlot={widgetSlot} />\n            </div>\n            {!skipRightSide && (\n              <div className={styles.rightSide}>\n                <VersionRelatedDropdowns component={component} consumeMethods={consumeMethodSlot} host={host} />\n                <MainDropdown className={styles.hideOnMobile} menuItems={mainMenuItems} />\n              </div>\n            )}\n          </div>\n        }\n      />\n    </Routes>\n  );\n}\n\nexport function VersionRelatedDropdowns({\n  component,\n  consumeMethods,\n  className,\n  host,\n}: {\n  component: ComponentModel;\n  consumeMethods?: ConsumeMethodSlot;\n  className?: string;\n  host: string;\n}) {\n  const location = useLocation();\n  const { lanesModel } = useLanes();\n  const viewedLane =\n    lanesModel?.viewedLane?.id && !lanesModel?.viewedLane?.id.isDefault() ? lanesModel.viewedLane : undefined;\n\n  const { logs } = component;\n  const isWorkspace = host === 'teambit.workspace/workspace';\n\n  const snaps = useMemo(() => {\n    return (logs || []).filter((log) => !log.tag).map((snap) => ({ ...snap, version: snap.hash }));\n  }, [logs]);\n\n  const tags = useMemo(() => {\n    const tagLookup = new Map<string, LegacyComponentLog>();\n    (logs || [])\n      .filter((log) => log.tag)\n      .forEach((tag) => {\n        tagLookup.set(tag?.tag as string, tag);\n      });\n    return compact(\n      component.tags\n        ?.toArray()\n        .reverse()\n        .map((tag) => tagLookup.get(tag.version.version))\n    ).map((tag) => ({ ...tag, version: tag.tag as string }));\n  }, [logs]);\n\n  const isNew = snaps.length === 0 && tags.length === 0;\n\n  const lanes = lanesModel?.getLanesByComponentId(component.id)?.filter((lane) => !lane.id.isDefault()) || [];\n  const localVersion = isWorkspace && !isNew && (!viewedLane || lanesModel?.isViewingCurrentLane());\n\n  const currentVersion =\n    isWorkspace && !isNew && !location?.search.includes('version') ? 'workspace' : component.version;\n\n  const methods = useConsumeMethods(component, consumeMethods, viewedLane);\n  return (\n    <>\n      {consumeMethods && tags.length > 0 && (\n        <UseBoxDropdown\n          position=\"bottom-end\"\n          className={classnames(styles.useBox, styles.hideOnMobile)}\n          Menu={<ConsumeMethodsMenu methods={methods} componentName={component.id.name} />}\n        />\n      )}\n      <VersionDropdown\n        tags={tags}\n        snaps={snaps}\n        lanes={lanes}\n        localVersion={localVersion}\n        currentVersion={currentVersion}\n        latestVersion={component.latest}\n        currentLane={viewedLane}\n        className={className}\n        menuClassName={styles.componentVersionMenu}\n      />\n    </>\n  );\n}\n\nfunction useConsumeMethods(\n  componentModel?: ComponentModel,\n  consumeMethods?: ConsumeMethodSlot,\n  currentLane?: LaneModel\n): ConsumeMethod[] {\n  // if (!consumeMethods || !componentModel) return [];\n  return useMemo(\n    () =>\n      flatten(consumeMethods?.values())\n        .map((method) => {\n          if (!componentModel) return undefined;\n          return method?.(componentModel, { currentLane });\n        })\n        .filter((x) => !!x && x.Component && x.Title) as ConsumeMethod[],\n    [consumeMethods, componentModel, currentLane]\n  );\n}\n"],"mappings":"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"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/component",
-  "version": "0.0.996",
+  "version": "0.0.999",
   "homepage": "https://bit.dev/teambit/component/component",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.component",
     "name": "component",
-    "version": "0.0.996"
+    "version": "0.0.999"
   },
   "dependencies": {
     "@teambit/any-fs": "0.0.5",
@@ -31,43 +31,43 @@
     "@teambit/base-ui.layout.breakpoints": "1.0.0",
     "@teambit/component-id": "0.0.427",
     "@teambit/ui-foundation.ui.menu-widget-icon": "0.0.497",
-    "@teambit/aspect-loader": "0.0.996",
-    "@teambit/graph": "0.0.996",
+    "@teambit/aspect-loader": "0.0.999",
+    "@teambit/graph": "0.0.999",
     "@teambit/legacy-bit-id": "0.0.423",
     "@teambit/toolbox.path.match-patterns": "0.0.9",
     "@teambit/toolbox.string.capitalize": "0.0.490",
-    "@teambit/cli": "0.0.669",
-    "@teambit/express": "0.0.767",
-    "@teambit/graphql": "0.0.996",
+    "@teambit/cli": "0.0.670",
+    "@teambit/express": "0.0.768",
+    "@teambit/graphql": "0.0.999",
     "@teambit/bit-error": "0.0.402",
-    "@teambit/command-bar": "0.0.996",
+    "@teambit/command-bar": "0.0.999",
     "@teambit/component.ui.deprecation-icon": "0.0.504",
-    "@teambit/preview": "0.0.996",
-    "@teambit/pubsub": "0.0.996",
-    "@teambit/react-router": "0.0.996",
+    "@teambit/preview": "0.0.999",
+    "@teambit/pubsub": "0.0.999",
+    "@teambit/react-router": "0.0.999",
     "@teambit/ui-foundation.ui.is-browser": "0.0.495",
     "@teambit/ui-foundation.ui.main-dropdown": "0.0.497",
     "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.501",
     "@teambit/ui-foundation.ui.use-box.menu": "0.0.133",
-    "@teambit/ui": "0.0.996",
+    "@teambit/ui": "0.0.999",
     "@teambit/component-issues": "0.0.88",
     "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.500",
     "@teambit/cli-table": "0.0.41",
-    "@teambit/component-descriptor": "0.0.238",
+    "@teambit/component-descriptor": "0.0.239",
     "@teambit/ui-foundation.ui.react-router.use-query": "0.0.496",
     "@teambit/design.ui.empty-box": "0.0.364",
     "@teambit/harmony.ui.aspect-box": "0.0.497",
+    "@teambit/compositions": "0.0.999",
+    "@teambit/deprecation": "0.0.999",
+    "@teambit/envs": "0.0.999",
+    "@teambit/legacy-component-log": "0.0.399",
     "@teambit/design.ui.pages.not-found": "0.0.366",
     "@teambit/design.ui.pages.server-error": "0.0.366",
-    "@teambit/compositions": "0.0.996",
-    "@teambit/deprecation": "0.0.996",
-    "@teambit/envs": "0.0.996",
-    "@teambit/legacy-component-log": "0.0.399",
     "@teambit/design.ui.styles.ellipsis": "0.0.357",
     "@teambit/envs.ui.env-icon": "0.0.495",
-    "@teambit/component.ui.version-dropdown": "0.0.735",
-    "@teambit/lanes.hooks.use-lanes": "0.0.132",
-    "@teambit/lanes.ui.models.lanes-model": "0.0.94",
+    "@teambit/component.ui.version-dropdown": "0.0.736",
+    "@teambit/lanes.hooks.use-lanes": "0.0.133",
+    "@teambit/lanes.ui.models.lanes-model": "0.0.95",
     "@teambit/ui-foundation.ui.full-loader": "0.0.495",
     "@teambit/ui-foundation.ui.use-box.dropdown": "0.0.132"
   },
@@ -88,7 +88,7 @@
   "peerDependencies": {
     "react-router-dom": "^6.0.0",
     "@apollo/client": "^3.6.0",
-    "@teambit/legacy": "1.0.451",
+    "@teambit/legacy": "1.0.452",
     "react": "^16.8.0 || ^17.0.0",
     "react-dom": "^16.8.0 || ^17.0.0"
   },

package/ui/menu/menu.tsx

@@ -121,7 +121,7 @@ export function VersionRelatedDropdowns({
 }) {
   const location = useLocation();
   const { lanesModel } = useLanes();
-  const currentLane =
+  const viewedLane =
     lanesModel?.viewedLane?.id && !lanesModel?.viewedLane?.id.isDefault() ? lanesModel.viewedLane : undefined;
 
   const { logs } = component;
@@ -149,12 +149,12 @@ export function VersionRelatedDropdowns({
   const isNew = snaps.length === 0 && tags.length === 0;
 
   const lanes = lanesModel?.getLanesByComponentId(component.id)?.filter((lane) => !lane.id.isDefault()) || [];
-  const localVersion = isWorkspace && !isNew && !currentLane;
+  const localVersion = isWorkspace && !isNew && (!viewedLane || lanesModel?.isViewingCurrentLane());
 
   const currentVersion =
     isWorkspace && !isNew && !location?.search.includes('version') ? 'workspace' : component.version;
 
-  const methods = useConsumeMethods(component, consumeMethods, currentLane);
+  const methods = useConsumeMethods(component, consumeMethods, viewedLane);
   return (
     <>
       {consumeMethods && tags.length > 0 && (
@@ -171,7 +171,7 @@ export function VersionRelatedDropdowns({
         localVersion={localVersion}
         currentVersion={currentVersion}
         latestVersion={component.latest}
-        currentLane={currentLane}
+        currentLane={viewedLane}
         className={className}
         menuClassName={styles.componentVersionMenu}
       />