n8n-editor-ui 2.3.1 → 2.4.0

package/dist/assets/{MainHeader-CSaAWCWj.css → AppHeader-CiEVBSe4.css}

@@ -389,130 +389,6 @@
 --------------------------*/
 /* Break-point
 --------------------------*/
-/* Break-points
- -------------------------- */
-/* Scrollbar
- -------------------------- */
-/* Placeholder
- -------------------------- */
-/* BEM
- -------------------------- */
-._container_dsr9f_123 {
-  margin: 0 var(--spacing--4xs);
-}/* BEM support Func
- -------------------------- */
-/* Transition
--------------------------- */
-/* Color
--------------------------- */
-/* Link
--------------------------- */
-/* Border
--------------------------- */
-/* Outline
--------------------------- */
-/* Box shadow
--------------------------- */
-/* Fill
--------------------------- */
-/* Typography
--------------------------- */
-/* z-index
--------------------------- */
-/* Disable base
--------------------------- */
-/* Icon
--------------------------- */
-/* Checkbox
--------------------------- */
-/* Radio
--------------------------- */
-/* Select
--------------------------- */
-/* Alert
--------------------------- */
-/* MessageBox
--------------------------- */
-/* Message
--------------------------- */
-/* Notification
--------------------------- */
-/* Input
--------------------------- */
-/* Cascader
--------------------------- */
-/* Group
--------------------------- */
-/* Tab
--------------------------- */
-/* Button
--------------------------- */
-/* cascader
--------------------------- */
-/* Switch
--------------------------- */
-/* Dialog
--------------------------- */
-/* Table
--------------------------- */
-/* Pagination
--------------------------- */
-/* Popup
--------------------------- */
-/* Popover
--------------------------- */
-/* Tooltip
--------------------------- */
-/* Tag
--------------------------- */
-/* Tree
--------------------------- */
-/* Dropdown
--------------------------- */
-/* Badge
--------------------------- */
-/* Card
---------------------------*/
-/* Slider
---------------------------*/
-/* Steps
---------------------------*/
-/* Menu
---------------------------*/
-/* Rate
---------------------------*/
-/* DatePicker
---------------------------*/
-/* Loading
---------------------------*/
-/* Scrollbar
---------------------------*/
-/* Carousel
---------------------------*/
-/* Collapse
---------------------------*/
-/* Transfer
---------------------------*/
-/* Header
-  --------------------------*/
-/* Footer
---------------------------*/
-/* Main
---------------------------*/
-/* Timeline
---------------------------*/
-/* Backtop
---------------------------*/
-/* Link
---------------------------*/
-/* Calendar
---------------------------*/
-/* Form
--------------------------- */
-/* Avatar
---------------------------*/
-/* Break-point
---------------------------*/
 /* Break-points
  -------------------------- */
 /* Scrollbar
@@ -652,25 +528,8 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._container_uqc1z_123 {
-  display: contents;
-}
-._activator_uqc1z_127 {
-  color: var(--color--text--shade-1);
-  font-weight: var(--font-weight--regular);
-  font-size: 13px;
-  line-height: 24px;
-  align-items: center;
-}
-._activator_uqc1z_127 > span {
-  margin-right: 5px;
-}
-._group_uqc1z_138 {
-  display: flex;
-  gap: var(--spacing--xs);
-}
-._disabledShareButton_uqc1z_143 {
-  cursor: not-allowed;
+._container_dsr9f_123 {
+  margin: 0 var(--spacing--4xs);
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -793,19 +652,42 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._container_p6bf9_123 {
+._container_1kudh_123 {
   display: contents;
 }
-._activeVersionIndicator_p6bf9_127 {
+._activeVersionIndicator_1kudh_127 {
   display: inline-flex;
   align-items: center;
 }
-._activeVersionIndicator_p6bf9_127 ._icon_p6bf9_131:focus {
+._activeVersionIndicator_1kudh_127 ._icon_1kudh_131:focus {
   outline: none;
 }
-._publishButtonWrapper_p6bf9_135 {
+._publishButtonWrapper_1kudh_135 {
   position: relative;
   display: inline-block;
+}
+._indicatorDot_1kudh_140 {
+  height: var(--spacing--2xs);
+  width: var(--spacing--2xs);
+  border-radius: 50%;
+  display: inline-block;
+  margin-right: var(--spacing--2xs);
+}
+._indicatorPublished_1kudh_148 {
+  background-color: var(--color--mint-600);
+}
+._indicatorPublishedText_1kudh_152 {
+  color: var(--color--text--tint-1);
+}
+._indicatorChanges_1kudh_156 {
+  background-color: var(--color--yellow-500);
+}
+._indicatorIssues_1kudh_160 {
+  background-color: var(--color--red-600);
+}
+._flex_1kudh_164 {
+  display: flex;
+  align-items: center;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -928,63 +810,63 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-.name-container[data-v-22fed76c] {
+.name-container[data-v-d5e5e93f] {
   margin-right: var(--spacing--sm);
 }
-.name-container[data-v-22fed76c] .el-input {
+.name-container[data-v-d5e5e93f] .el-input {
   padding: 0;
 }
-.name[data-v-22fed76c] {
+.name[data-v-d5e5e93f] {
   color: var(--color--text--shade-1);
   font-size: var(--font-size--sm);
   padding: var(--spacing--3xs) var(--spacing--4xs) var(--spacing--4xs);
 }
-.add-tag[data-v-22fed76c] {
+.add-tag[data-v-d5e5e93f] {
   font-size: 12px;
   padding: 20px 0;
   color: var(--color--text--tint-1);
   font-weight: var(--font-weight--bold);
   white-space: nowrap;
 }
-.add-tag[data-v-22fed76c]:hover {
+.add-tag[data-v-d5e5e93f]:hover {
   color: var(--color--primary);
 }
-.tags[data-v-22fed76c] {
+.tags[data-v-d5e5e93f] {
   display: flex;
   align-items: center;
   width: 100%;
   flex: 1;
   margin-right: 20px;
 }
-.tags-edit[data-v-22fed76c] {
+.tags-edit[data-v-d5e5e93f] {
   min-width: 100px;
   width: 100%;
   max-width: 460px;
 }
-.actions[data-v-22fed76c] {
+.actions[data-v-d5e5e93f] {
   display: flex;
   align-items: center;
   gap: var(--spacing--md);
   flex-wrap: nowrap;
 }
 @media screen and (max-width: 767px) {
-.name[data-v-22fed76c] input {
+.name[data-v-d5e5e93f] input {
     min-width: 180px;
 }
 }
 @media (max-width: 1390px) {
-.name-container[data-v-22fed76c] {
+.name-container[data-v-d5e5e93f] {
     margin-right: var(--spacing--xs);
 }
-.actions[data-v-22fed76c] {
+.actions[data-v-d5e5e93f] {
     gap: var(--spacing--xs);
 }
 }
 @media (max-width: 1350px) {
-.name-container[data-v-22fed76c] {
+.name-container[data-v-d5e5e93f] {
     margin-right: var(--spacing--2xs);
 }
-.actions[data-v-22fed76c] {
+.actions[data-v-d5e5e93f] {
     gap: var(--spacing--2xs);
 }
 }/* BEM support Func

package/dist/assets/{MainSidebar-BehIhk7J.js → AppSidebar-B88OkpG6.js}

@@ -1,47 +1,28 @@
-import { C as computed, Cn as toDisplayString, D as createElementBlock, E as createCommentVNode, G as nextTick, Gt as unref, It as ref, J as onBeforeUnmount, M as createVNode, P as defineComponent, Q as onUnmounted, T as createBlock, Z as onMounted, _ as Fragment, _t as watch, b as Teleport, bn as normalizeStyle, bt as withCtx, et as openBlock, it as renderList, j as createTextVNode, q as onBeforeMount, vn as normalizeClass, w as createBaseVNode } from "./vue.runtime.esm-bundler-tP5dCd7J.js";
-import { _t as useI18n, mt as i18n } from "./_MapCache-ficiegRb.js";
-import { C as N8nResizeWrapper_default, N as N8nMenuItem_default, Sn as N8nButton_default, ht as N8nTooltip_default, s as N8nScrollArea_default, wn as N8nIcon_default, xn as N8nText_default } from "./src-XLGanEOK.js";
-import "./en-CF30SCh2.js";
-import "./preload-helper-CR0ecmWK.js";
-import { t as __plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BwBpWJRZ.js";
-import { v as useRoute, y as useRouter } from "./truncate-B1HVeveJ.js";
-import { Dr as useUsersStore, N as useWorkflowsStore, O as useTelemetry, Xn as useProjectsStore, Zn as useSourceControlStore, c as useTemplatesStore, d as trackTemplatesClick, f as useTemplatesDataQualityStore, gs as useSettingsStore, l as TemplateClickSource, oa as useUIStore, p as useCloudPlanStore, vr as hasPermission } from "./builder.store-D6GyopzN.js";
-import "./empty-DUjwPfU3.js";
-import "./sanitize-html-fRP2gWb9.js";
-import "./CalendarDate-zWqgZMlk.js";
-import "./path-browserify-CJwRhuT8.js";
-import { i as useBecomeTemplateCreatorStore, n as MainSidebarHeader_default, r as useSidebarLayout, t as BottomMenu_default } from "./BottomMenu-B-HQRX4l.js";
-import { Ao as getResourcePermissions, Bo as VIEWS, Jo as EXPERIMENT_TEMPLATES_DATA_QUALITY_KEY, Vo as ABOUT_MODAL_KEY, Xo as EXPERIMENT_TEMPLATE_RECO_V3_KEY, Yo as EXPERIMENT_TEMPLATE_RECO_V2_KEY, ms as WHATS_NEW_MODAL_KEY } from "./constants-DRIItkNt.js";
-import "./merge-k8vSyyXH.js";
-import { r as useRootStore } from "./_baseOrderBy-UJkFlXQy.js";
-import "./dateformat-CM9k0--B.js";
-import "./useDebounce-Bnb8W2LR.js";
-import "./retry-dP46utx2.js";
-import "./executions.store-a5l7sYPn.js";
-import "./useRunWorkflow-DfbxLgl-.js";
-import "./usePinnedData-FgnIiWSJ.js";
-import { _ as useCalloutHelpers } from "./nodeCreator.store-DTc1zzIQ.js";
-import "./nodeIcon-BWuZ9Qxh.js";
-import "./useCanvasOperations-DmDkQZsZ.js";
-import "./folders.store-j6Xz9xvI.js";
-import "./NodeIcon-BbsF7HzQ.js";
-import "./KeyboardShortcutTooltip-Bg_9TS__.js";
-import { t as useVersionsStore } from "./versions.store-a3DCEQMP.js";
-import { t as usePageRedirectionHelper } from "./usePageRedirectionHelper-w7WYnki8.js";
-import "./dataTable.store-CkhtfeY0.js";
-import { i as useGlobalEntityCreation, n as useBugReporting, r as EXTERNAL_LINKS } from "./useCommandBar-Ddao4vJv.js";
-import "./uniqBy-BInks7VO.js";
-import "./ProjectIcon-CNEqHlzp.js";
-import "./CredentialIcon-DJybkA4h.js";
-import "./sortByProperty-CV1aCzkS.js";
-import { u as CHAT_VIEW } from "./constants-DLTaaipl.js";
-import "./useRecentResources-D-zHnbqB.js";
-import { t as sourceControlEventBus } from "./sourceControl.eventBus-Bry8gLG7.js";
-import { t as useKeybindings } from "./useKeybindings-DDEBPDlo.js";
-import { n as usePersonalizedTemplatesV2Store, t as usePersonalizedTemplatesV3Store } from "./personalizedTemplatesV3.store-DBi4yorm.js";
-import "./chat.store-D1BqW7ao.js";
-import "./fileUtils-D_SiS8no.js";
-import { t as useSettingsItems } from "./useSettingsItems-CNv2tIdk.js";
+import { C as computed, Cn as toDisplayString, D as createElementBlock, E as createCommentVNode, G as nextTick, Gt as unref, It as ref, J as onBeforeUnmount, M as createVNode, P as defineComponent, Q as onUnmounted, T as createBlock, Z as onMounted, _ as Fragment, _t as watch, b as Teleport, bn as normalizeStyle, bt as withCtx, et as openBlock, it as renderList, j as createTextVNode, q as onBeforeMount, vn as normalizeClass, w as createBaseVNode } from "./vue.runtime.esm-bundler-XtMkEjzB.js";
+import { _t as useI18n, mt as i18n } from "./_MapCache-DkLivSSb.js";
+import { On as N8nText_default, P as N8nMenuItem_default, St as N8nTooltip_default, c as N8nScrollArea_default, jn as N8nIcon_default, kn as N8nButton_default, w as N8nResizeWrapper_default } from "./src-DpZSuyLC.js";
+import { t as __plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-fRq25RGE.js";
+import { v as useRoute, y as useRouter } from "./truncate-BrM_9cme.js";
+import { Mt as useTelemetry, Qn as TemplateClickSource, er as trackTemplatesClick, hr as useSourceControlStore, ls as useSettingsStore, nr as useCloudPlanStore, pn as useTemplatesStore, r as useUIStore, rr as hasPermission, s as useWorkflowsStore, t as useUsersStore, tr as useTemplatesDataQualityStore, zt as useProjectsStore } from "./users.store-Dh2O3NbU.js";
+import "./sanitize-html-DeDnsMgc.js";
+import "./empty-nq5-pHAR.js";
+import { n as MainSidebarHeader_default, r as useSidebarLayout, t as BottomMenu_default } from "./BottomMenu-CfzAqh6J.js";
+import { Bo as ABOUT_MODAL_KEY, Jo as EXPERIMENT_TEMPLATE_RECO_V2_KEY, Yo as EXPERIMENT_TEMPLATE_RECO_V3_KEY, fs as WHATS_NEW_MODAL_KEY, ko as getResourcePermissions, qo as EXPERIMENT_TEMPLATES_DATA_QUALITY_KEY, zo as VIEWS } from "./constants-D48cSFnx.js";
+import "./merge-B0-p153C.js";
+import { r as useRootStore } from "./_baseOrderBy-DvuuRU7J.js";
+import "./dateformat-BeHi9sF4.js";
+import "./useDebounce-C4ttil9E.js";
+import { t as useVersionsStore } from "./versions.store-BIW6cbdc.js";
+import { t as usePageRedirectionHelper } from "./usePageRedirectionHelper--cm71zDE.js";
+import { n as EXTERNAL_LINKS, t as useBugReporting } from "./useBugReporting-Bi1700UJ.js";
+import "./canvas.utils-Dv0fD5Il.js";
+import "./KeyboardShortcutTooltip-Dwz4Hv8g.js";
+import { u as CHAT_VIEW } from "./constants-Bgby4me8.js";
+import { t as sourceControlEventBus } from "./sourceControl.eventBus-l-XuMGfW.js";
+import { t as useKeybindings } from "./useKeybindings-CKjI_jnI.js";
+import { n as usePersonalizedTemplatesV2Store, t as usePersonalizedTemplatesV3Store } from "./personalizedTemplatesV3.store-CwD8voN0.js";
+import { t as useGlobalEntityCreation } from "./useGlobalEntityCreation-5MrJOTFc.js";
+import { t as useSettingsItems } from "./useSettingsItems-DDLH7vvJ.js";
 var MainSidebarSourceControl_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "MainSidebarSourceControl",
 	props: { isCollapsed: { type: Boolean } },
@@ -92,7 +73,7 @@ var MainSidebarSourceControl_vue_vue_type_script_setup_true_lang_default = /* @_
 				key: 0,
 				class: normalizeClass({
 					[_ctx.$style.sync]: true,
-					[_ctx.$style.collapsed]: _ctx.isCollapsed,
+					[_ctx.$style.collapsed]: __props.isCollapsed,
 					[_ctx.$style.isConnected]: unref(sourceControlStore).isEnterpriseSourceControlEnabled
 				}),
 				"data-test-id": "main-sidebar-source-control"
@@ -101,7 +82,7 @@ var MainSidebarSourceControl_vue_vue_type_script_setup_true_lang_default = /* @_
 				class: normalizeClass(_ctx.$style.connected),
 				"data-test-id": "main-sidebar-source-control-connected"
 			}, [createVNode(unref(N8nTooltip_default), {
-				disabled: !_ctx.isCollapsed,
+				disabled: !__props.isCollapsed,
 				"show-after": tooltipOpenDelay.value,
 				placement: "right"
 			}, {
@@ -115,7 +96,7 @@ var MainSidebarSourceControl_vue_vue_type_script_setup_true_lang_default = /* @_
 				}, [createVNode(unref(N8nIcon_default), {
 					icon: "git-branch",
 					size: "small"
-				}), !_ctx.isCollapsed ? (openBlock(), createBlock(unref(N8nText_default), {
+				}), !__props.isCollapsed ? (openBlock(), createBlock(unref(N8nText_default), {
 					key: 0,
 					bold: "",
 					size: "small",
@@ -126,9 +107,9 @@ var MainSidebarSourceControl_vue_vue_type_script_setup_true_lang_default = /* @_
 				}, 8, ["class"])) : createCommentVNode("", true)], 6)]),
 				_: 1
 			}, 8, ["disabled", "show-after"]), createBaseVNode("div", null, [createVNode(unref(N8nTooltip_default), {
-				disabled: !_ctx.isCollapsed && hasPullPermission.value,
+				disabled: !__props.isCollapsed && hasPullPermission.value,
 				"show-after": tooltipOpenDelay.value,
-				placement: _ctx.isCollapsed ? "right" : "top"
+				placement: __props.isCollapsed ? "right" : "top"
 			}, {
 				content: withCtx(() => [createBaseVNode("div", null, toDisplayString(!hasPullPermission.value ? unref(i18n$1).baseText("settings.sourceControl.button.pull.forbidden") : unref(i18n$1).baseText("settings.sourceControl.button.pull")), 1)]),
 				default: withCtx(() => [createVNode(unref(N8nButton_default), {
@@ -136,10 +117,10 @@ var MainSidebarSourceControl_vue_vue_type_script_setup_true_lang_default = /* @_
 					"data-test-id": "main-sidebar-source-control-pull",
 					icon: "arrow-down",
 					type: "tertiary",
-					size: _ctx.isCollapsed ? "small" : "mini",
+					size: __props.isCollapsed ? "small" : "mini",
 					text: "",
-					square: _ctx.isCollapsed,
-					label: _ctx.isCollapsed ? "" : unref(i18n$1).baseText("settings.sourceControl.button.pull"),
+					square: __props.isCollapsed,
+					label: __props.isCollapsed ? "" : unref(i18n$1).baseText("settings.sourceControl.button.pull"),
 					onClick: pullWorkfolder
 				}, null, 8, [
 					"disabled",
@@ -153,20 +134,20 @@ var MainSidebarSourceControl_vue_vue_type_script_setup_true_lang_default = /* @_
 				"show-after",
 				"placement"
 			]), createVNode(unref(N8nTooltip_default), {
-				disabled: !_ctx.isCollapsed && !unref(sourceControlStore).preferences.branchReadOnly && hasPushPermission.value,
+				disabled: !__props.isCollapsed && !unref(sourceControlStore).preferences.branchReadOnly && hasPushPermission.value,
 				"show-after": tooltipOpenDelay.value,
-				placement: _ctx.isCollapsed ? "right" : "top"
+				placement: __props.isCollapsed ? "right" : "top"
 			}, {
 				content: withCtx(() => [createBaseVNode("div", null, toDisplayString(unref(sourceControlStore).preferences.branchReadOnly || !hasPushPermission.value ? unref(i18n$1).baseText("settings.sourceControl.button.push.forbidden") : unref(i18n$1).baseText("settings.sourceControl.button.push")), 1)]),
 				default: withCtx(() => [createVNode(unref(N8nButton_default), {
-					square: _ctx.isCollapsed,
-					label: _ctx.isCollapsed ? "" : unref(i18n$1).baseText("settings.sourceControl.button.push"),
+					square: __props.isCollapsed,
+					label: __props.isCollapsed ? "" : unref(i18n$1).baseText("settings.sourceControl.button.push"),
 					disabled: unref(sourceControlStore).preferences.branchReadOnly || !hasPushPermission.value,
 					"data-test-id": "main-sidebar-source-control-push",
 					icon: "arrow-up",
 					type: "tertiary",
 					text: "",
-					size: _ctx.isCollapsed ? "small" : "mini",
+					size: __props.isCollapsed ? "small" : "mini",
 					onClick: pushWorkfolder
 				}, null, 8, [
 					"square",
@@ -520,7 +501,6 @@ var TemplateTooltip_default = /* @__PURE__ */ __plugin_vue_export_helper_default
 var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "MainSidebar",
 	setup(__props) {
-		const becomeTemplateCreatorStore = useBecomeTemplateCreatorStore();
 		const cloudPlanStore = useCloudPlanStore();
 		const rootStore = useRootStore();
 		const settingsStore = useSettingsStore();
@@ -536,10 +516,13 @@ var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 		const telemetry = useTelemetry();
 		const pageRedirectionHelper = usePageRedirectionHelper();
 		const { getReportingURL } = useBugReporting();
-		const calloutHelpers = useCalloutHelpers();
 		const { isCollapsed, sidebarWidth, onResizeStart, onResize, onResizeEnd, toggleCollapse } = useSidebarLayout();
 		const { settingsItems } = useSettingsItems();
 		const basePath = ref("");
+		const scrollAreaRef = ref();
+		const hasOverflow = ref(false);
+		const hasScrolledFromTop = ref(false);
+		let resizeObserver = null;
 		const showWhatsNewNotification = computed(() => versionsStore.hasVersionUpdates || versionsStore.whatsNewArticles.some((article) => !versionsStore.isWhatsNewArticleRead(article.id)));
 		const isTemplatesExperimentEnabled = computed(() => {
 			return personalizedTemplatesV2Store.isFeatureEnabled() || personalizedTemplatesV3Store.isFeatureEnabled() || templatesDataQualityStore.isFeatureEnabled();
@@ -552,14 +535,6 @@ var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				icon: "cloud",
 				available: settingsStore.isCloudDeployment && hasPermission(["instanceOwner"])
 			},
-			{
-				id: "templates",
-				icon: "package-open",
-				label: i18n$1.baseText("generic.templates"),
-				position: "bottom",
-				available: settingsStore.isTemplatesEnabled && calloutHelpers.isPreBuiltAgentsCalloutVisible.value && !isTemplatesExperimentEnabled.value,
-				route: { to: { name: VIEWS.PRE_BUILT_AGENT_TEMPLATES } }
-			},
 			{
 				id: "templates",
 				icon: "package-open",
@@ -572,7 +547,7 @@ var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				icon: "package-open",
 				label: i18n$1.baseText("generic.templates"),
 				position: "bottom",
-				available: settingsStore.isTemplatesEnabled && !calloutHelpers.isPreBuiltAgentsCalloutVisible.value && templatesStore.hasCustomTemplatesHost && !isTemplatesExperimentEnabled.value,
+				available: settingsStore.isTemplatesEnabled && templatesStore.hasCustomTemplatesHost && !isTemplatesExperimentEnabled.value,
 				route: { to: { name: VIEWS.TEMPLATES } }
 			},
 			{
@@ -580,7 +555,7 @@ var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				icon: "package-open",
 				label: i18n$1.baseText("generic.templates"),
 				position: "bottom",
-				available: settingsStore.isTemplatesEnabled && !calloutHelpers.isPreBuiltAgentsCalloutVisible.value && !templatesStore.hasCustomTemplatesHost && !isTemplatesExperimentEnabled.value,
+				available: settingsStore.isTemplatesEnabled && !templatesStore.hasCustomTemplatesHost && !isTemplatesExperimentEnabled.value,
 				link: {
 					href: templatesStore.websiteTemplateRepositoryURL,
 					target: "_blank"
@@ -663,12 +638,41 @@ var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 			}
 		]);
 		const visibleMenuItems = computed(() => mainMenuItems.value.filter((item) => item.available !== false));
+		const checkOverflow = () => {
+			const position = scrollAreaRef.value?.getScrollPosition();
+			if (position && scrollAreaRef.value?.$el) {
+				const element = scrollAreaRef.value.$el;
+				const hasVerticalOverflow = position.height > element.clientHeight;
+				hasOverflow.value = hasVerticalOverflow;
+				hasScrolledFromTop.value = hasVerticalOverflow && position.top > 0;
+			}
+		};
+		watch(isCollapsed, () => {
+			nextTick(() => {
+				checkOverflow();
+			});
+		});
 		onMounted(() => {
 			basePath.value = rootStore.baseUrl;
-			becomeTemplateCreatorStore.startMonitoringCta();
+			nextTick(() => {
+				checkOverflow();
+				if (scrollAreaRef.value?.$el) {
+					const element = scrollAreaRef.value.$el;
+					resizeObserver = new ResizeObserver(() => {
+						checkOverflow();
+					});
+					resizeObserver.observe(element);
+					checkOverflow();
+				}
+			});
+			window.addEventListener("resize", checkOverflow);
 		});
 		onBeforeUnmount(() => {
-			becomeTemplateCreatorStore.stopMonitoringCta();
+			if (resizeObserver) {
+				resizeObserver.disconnect();
+				resizeObserver = null;
+			}
+			window.removeEventListener("resize", checkOverflow);
 		});
 		const trackHelpItemClick = (itemType) => {
 			telemetry.track("User clicked help resource", {
@@ -768,18 +772,27 @@ var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 						onCollapse: unref(toggleCollapse),
 						onOpenCommandBar: openCommandBar
 					}, null, 8, ["is-collapsed", "onCollapse"]),
-					createVNode(unref(N8nScrollArea_default), { "as-child": "" }, {
-						default: withCtx(() => [createBaseVNode("div", { class: normalizeClass(_ctx.$style.scrollArea) }, [createVNode(ProjectNavigation_default, {
+					createBaseVNode("div", { class: normalizeClass({
+						[_ctx.$style.scrollAreaWrapper]: true,
+						[_ctx.$style.scrollAreaWrapperWithBottomBorder]: hasOverflow.value && !unref(isCollapsed),
+						[_ctx.$style.scrollAreaWrapperWithTopBorder]: hasScrolledFromTop.value && !unref(isCollapsed)
+					}) }, [createVNode(unref(N8nScrollArea_default), {
+						ref_key: "scrollAreaRef",
+						ref: scrollAreaRef,
+						onScrollCapture: checkOverflow
+					}, {
+						default: withCtx(() => [createVNode(ProjectNavigation_default, {
 							collapsed: unref(isCollapsed),
 							"plan-name": unref(cloudPlanStore).currentPlanData?.displayName
-						}, null, 8, ["collapsed", "plan-name"]), createVNode(BottomMenu_default, {
-							items: visibleMenuItems.value,
-							"is-collapsed": unref(isCollapsed),
-							onLogout,
-							onSelect: handleSelect
-						}, null, 8, ["items", "is-collapsed"])], 2)]),
+						}, null, 8, ["collapsed", "plan-name"])]),
 						_: 1
-					}),
+					}, 512)], 2),
+					createVNode(BottomMenu_default, {
+						items: visibleMenuItems.value,
+						"is-collapsed": unref(isCollapsed),
+						onLogout,
+						onSelect: handleSelect
+					}, null, 8, ["items", "is-collapsed"]),
 					createVNode(MainSidebarSourceControl_default, { "is-collapsed": unref(isCollapsed) }, null, 8, ["is-collapsed"]),
 					createVNode(MainSidebarTrialUpgrade_default),
 					createVNode(TemplateTooltip_default)
@@ -797,9 +810,19 @@ var MainSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 	}
 });
 var MainSidebar_vue_vue_type_style_index_0_lang_module_default = {
-	sideMenu: "_sideMenu_18grn_123",
-	sideMenuCollapsed: "_sideMenuCollapsed_18grn_131",
-	scrollArea: "_scrollArea_18grn_136"
+	sideMenu: "_sideMenu_13nlp_123",
+	sideMenuCollapsed: "_sideMenuCollapsed_13nlp_131",
+	scrollAreaWrapper: "_scrollAreaWrapper_13nlp_136",
+	scrollAreaWrapperWithBottomBorder: "_scrollAreaWrapperWithBottomBorder_13nlp_145",
+	scrollAreaWrapperWithTopBorder: "_scrollAreaWrapperWithTopBorder_13nlp_149"
 };
 var MainSidebar_default = /* @__PURE__ */ __plugin_vue_export_helper_default(MainSidebar_vue_vue_type_script_setup_true_lang_default, [["__cssModules", { "$style": MainSidebar_vue_vue_type_style_index_0_lang_module_default }]]);
-export { MainSidebar_default as default };
+var AppSidebar_default = /* @__PURE__ */ defineComponent({
+	__name: "AppSidebar",
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(MainSidebar_default);
+		};
+	}
+});
+export { AppSidebar_default as default };

package/dist/assets/{MainSidebar-CEsQ8o1Y.css → AppSidebar-qYnACKTG.css}

@@ -746,7 +746,7 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._sideMenu_18grn_123 {
+._sideMenu_13nlp_123 {
   position: relative;
   height: 100%;
   display: flex;
@@ -754,12 +754,21 @@
   border-right: var(--border);
   background-color: var(--menu--color--background, var(--color--background--light-2));
 }
-._sideMenu_18grn_123._sideMenuCollapsed_18grn_131 {
+._sideMenu_13nlp_123._sideMenuCollapsed_13nlp_131 {
   width: 42px;
   min-width: auto;
 }
-._scrollArea_18grn_136 {
-  height: 100%;
+._scrollAreaWrapper_13nlp_136 {
+  position: relative;
+  flex: 1;
+  min-height: 0;
   display: flex;
   flex-direction: column;
+  padding-top: var(--spacing--2xs);
+}
+._scrollAreaWrapperWithBottomBorder_13nlp_145 {
+  border-bottom: var(--border);
+}
+._scrollAreaWrapperWithTopBorder_13nlp_149 {
+  border-top: var(--border);
 }