diff --git a/packages/design-system/src/components/N8nMenuItem/MenuItem.vue b/packages/design-system/src/components/N8nMenuItem/MenuItem.vue
index 3dbb7b327e0af..b0789934f9175 100644
--- a/packages/design-system/src/components/N8nMenuItem/MenuItem.vue
+++ b/packages/design-system/src/components/N8nMenuItem/MenuItem.vue
@@ -36,6 +36,9 @@
>
{{ child.label }}
+
+
+
{{ item.label }}
+
+
+
@@ -264,6 +270,7 @@ export default defineComponent({
padding: var(--spacing-2xs) var(--spacing-xs) !important;
margin: 0 !important;
border-radius: var(--border-radius-base) !important;
+ overflow: hidden;
}
.icon {
@@ -272,6 +279,13 @@ export default defineComponent({
text-align: center;
}
+.secondaryIcon {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ flex: 1;
+}
+
.label {
overflow: hidden;
text-overflow: ellipsis;
@@ -294,6 +308,9 @@ export default defineComponent({
.label {
display: none;
}
+ .secondaryIcon {
+ display: none;
+ }
}
.submenuPopper {
diff --git a/packages/design-system/src/types/menu.ts b/packages/design-system/src/types/menu.ts
index 17a7c400b63c1..b4c00f9a8a43e 100644
--- a/packages/design-system/src/types/menu.ts
+++ b/packages/design-system/src/types/menu.ts
@@ -2,6 +2,7 @@ export type IMenuItem = {
id: string;
label: string;
icon?: string;
+ secondaryIcon?: { name: string; size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' };
customIconSize?: 'medium' | 'small';
available?: boolean;
position?: 'top' | 'bottom';
diff --git a/packages/editor-ui/src/components/MainSidebar.vue b/packages/editor-ui/src/components/MainSidebar.vue
index 8656a25fa54cb..d8fa837daa9a0 100644
--- a/packages/editor-ui/src/components/MainSidebar.vue
+++ b/packages/editor-ui/src/components/MainSidebar.vue
@@ -216,6 +216,9 @@ export default defineComponent({
{
id: 'workflows',
icon: 'network-wired',
+ secondaryIcon: this.versionControlStore.preferences.branchReadOnly
+ ? { name: 'lock' }
+ : undefined,
label: this.$locale.baseText('mainSidebar.workflows'),
position: 'top',
activateOnRouteNames: [VIEWS.WORKFLOWS],
diff --git a/packages/editor-ui/src/plugins/icons/index.ts b/packages/editor-ui/src/plugins/icons/index.ts
index c5df57f73e0a5..ef898784af958 100644
--- a/packages/editor-ui/src/plugins/icons/index.ts
+++ b/packages/editor-ui/src/plugins/icons/index.ts
@@ -81,6 +81,7 @@ import {
faLink,
faList,
faLightbulb,
+ faLock,
faMapSigns,
faMousePointer,
faNetworkWired,
@@ -219,6 +220,7 @@ addIcon(faKey);
addIcon(faLink);
addIcon(faList);
addIcon(faLightbulb);
+addIcon(faLock);
addIcon(faMapSigns);
addIcon(faMousePointer);
addIcon(faNetworkWired);