From 35449667bfab7324350fe92e1f6538e3ae3cadb1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Iv=C3=A1n=20Ovejero?= <ivov.src@gmail.com>
Date: Mon, 22 Jan 2024 12:28:21 +0100
Subject: [PATCH] fix(editor): Fix secondary icon for environments on sidebar
 menu item (#8407)

---
 .../design-system/src/components/N8nMenuItem/MenuItem.vue | 8 ++++++--
 .../design-system/src/components/N8nTooltip/Tooltip.vue   | 2 +-
 packages/editor-ui/src/plugins/i18n/locales/en.json       | 2 +-
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/design-system/src/components/N8nMenuItem/MenuItem.vue b/packages/design-system/src/components/N8nMenuItem/MenuItem.vue
index 603b833e30..007325b1c3 100644
--- a/packages/design-system/src/components/N8nMenuItem/MenuItem.vue
+++ b/packages/design-system/src/components/N8nMenuItem/MenuItem.vue
@@ -63,13 +63,16 @@
 					<span :class="$style.label">{{ item.label }}</span>
 					<N8nTooltip
 						v-if="item.secondaryIcon"
-						:class="$style.secondaryIcon"
 						:placement="item.secondaryIcon?.tooltip?.placement || 'right'"
 						:content="item.secondaryIcon?.tooltip?.content"
 						:disabled="compact || !item.secondaryIcon?.tooltip?.content"
 						:show-after="tooltipDelay"
 					>
-						<N8nIcon :icon="item.secondaryIcon.name" :size="item.secondaryIcon.size || 'small'" />
+						<N8nIcon
+							:class="$style.secondaryIcon"
+							:icon="item.secondaryIcon.name"
+							:size="item.secondaryIcon.size || 'small'"
+						/>
 					</N8nTooltip>
 				</ElMenuItem>
 			</ConditionalRouterLink>
@@ -274,6 +277,7 @@ export default defineComponent({
 	align-items: center;
 	justify-content: flex-end;
 	flex: 1;
+	margin-left: 20px;
 }
 
 .label {
diff --git a/packages/design-system/src/components/N8nTooltip/Tooltip.vue b/packages/design-system/src/components/N8nTooltip/Tooltip.vue
index a338ea8744..fa280f4d9f 100644
--- a/packages/design-system/src/components/N8nTooltip/Tooltip.vue
+++ b/packages/design-system/src/components/N8nTooltip/Tooltip.vue
@@ -3,7 +3,7 @@
 		<slot />
 		<template #content>
 			<slot name="content">
-				{{ content }}
+				<div v-html="content"></div>
 			</slot>
 			<div
 				v-if="buttons.length"
diff --git a/packages/editor-ui/src/plugins/i18n/locales/en.json b/packages/editor-ui/src/plugins/i18n/locales/en.json
index 9a532916b8..3db1094d1c 100644
--- a/packages/editor-ui/src/plugins/i18n/locales/en.json
+++ b/packages/editor-ui/src/plugins/i18n/locales/en.json
@@ -739,7 +739,7 @@
 	"mainSidebar.showMessage.stopExecution.title": "Execution stopped",
 	"mainSidebar.templates": "Templates",
 	"mainSidebar.workflows": "Workflows",
-	"mainSidebar.workflows.readOnlyEnv.tooltip": "Protected mode is active, so no workflows changes are allowed. Change this in Settings, under 'Source Control'",
+	"mainSidebar.workflows.readOnlyEnv.tooltip": "Protected instances prevent editing workflows (recommended for production environments). <a target=\"_blank\" href=\"https://docs.n8n.io/source-control-environments/\">More info</a>",
 	"mainSidebar.executions": "All executions",
 	"mainSidebar.workersView": "Workers",
 	"menuActions.duplicate": "Duplicate",