diff --git a/packages/design-system/theme/preview/index.html b/packages/design-system/theme/preview/index.html
index 2de021bca5..ed1c514ab2 100644
--- a/packages/design-system/theme/preview/index.html
+++ b/packages/design-system/theme/preview/index.html
@@ -886,9 +886,9 @@
 	</body>
 	<!-- import Vue before Element -->
 	<!-- <script src="https://unpkg.com/vue/dist/vue.js"></script> -->
-	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+	<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
 	<!-- import JavaScript -->
-	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
+	<script src="https://unpkg.com/element-plus/lib/index.js"></script>
 	<script>
 		const original = {
 			color_primary: '#409EFF',
@@ -919,8 +919,7 @@
 		};
 
 		Vue.config.devtools = true;
-		new Vue({
-			el: '#app',
+		Vue.createApp({
 			data() {
 				return {
 					global: {},
@@ -1330,6 +1329,6 @@
 					this.visible = true;
 				},
 			},
-		});
+		}).mount('#app');
 	</script>
 </html>
diff --git a/packages/editor-ui/src/components/MainSidebarSourceControl.vue b/packages/editor-ui/src/components/MainSidebarSourceControl.vue
index a67b112e33..95b0dbbf4c 100644
--- a/packages/editor-ui/src/components/MainSidebarSourceControl.vue
+++ b/packages/editor-ui/src/components/MainSidebarSourceControl.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { computed, nextTick ref } from 'vue';
+import { computed, nextTick, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import { createEventBus } from 'n8n-design-system/utils';
 import { useI18n, useLoadingService, useMessage, useToast } from '@/composables';
diff --git a/packages/editor-ui/src/components/SourceControlPullModal.ee.vue b/packages/editor-ui/src/components/SourceControlPullModal.ee.vue
index 957f708915..c869ef78c6 100644
--- a/packages/editor-ui/src/components/SourceControlPullModal.ee.vue
+++ b/packages/editor-ui/src/components/SourceControlPullModal.ee.vue
@@ -63,7 +63,7 @@ async function pullWorkfolder() {
 		});
 
 		if (hasVariablesOrCredentials) {
-			nextTick(() => {
+			void nextTick(() => {
 				toast.showMessage({
 					message: i18n.baseText('settings.sourceControl.pull.oneLastStep.description'),
 					title: i18n.baseText('settings.sourceControl.pull.oneLastStep.title'),
diff --git a/packages/editor-ui/src/components/SourceControlPushModal.ee.vue b/packages/editor-ui/src/components/SourceControlPushModal.ee.vue
index 352b5bdd5b..136f5c4b2a 100644
--- a/packages/editor-ui/src/components/SourceControlPushModal.ee.vue
+++ b/packages/editor-ui/src/components/SourceControlPushModal.ee.vue
@@ -268,9 +268,9 @@ async function commitAndPush() {
 						>
 							<div :class="$style.listItemBody">
 								<n8n-checkbox
-									:value="staged[file.file]"
+									:modelValue="staged[file.file]"
 									:class="$style.listItemCheckbox"
-									@input="setStagedStatus(file, !staged[file.file])"
+									@update:modelValue="setStagedStatus(file, !staged[file.file])"
 								/>
 								<div>
 									<n8n-text v-if="file.status === 'deleted'" color="text-light">
@@ -300,7 +300,7 @@ async function commitAndPush() {
 						</n8n-card>
 					</div>
 					<n8n-notice class="mt-0" v-else>
-						<i18n path="settings.sourceControl.modals.push.noWorkflowChanges">
+						<i18n-t keypath="settings.sourceControl.modals.push.noWorkflowChanges">
 							<template #link>
 								<n8n-link size="small" :to="i18n.baseText('settings.sourceControl.docs.using.url')">
 									{{
@@ -308,7 +308,7 @@ async function commitAndPush() {
 									}}
 								</n8n-link>
 							</template>
-						</i18n>
+						</i18n-t>
 					</n8n-notice>
 
 					<n8n-text bold tag="p" class="mt-l mb-2xs">
diff --git a/packages/editor-ui/src/views/NodeView.vue b/packages/editor-ui/src/views/NodeView.vue
index f769309fce..9875613582 100644
--- a/packages/editor-ui/src/views/NodeView.vue
+++ b/packages/editor-ui/src/views/NodeView.vue
@@ -315,7 +315,7 @@ import {
 	N8nPlusEndpointType,
 	EVENT_PLUS_ENDPOINT_CLICK,
 } from '@/plugins/endpoints/N8nPlusEndpointType';
-import type { ElNotificationComponent } from 'element-ui/types/notification';
+import type { ElNotification } from 'element-plus';
 import { sourceControlEventBus } from '@/event-bus/source-control';
 
 interface AddNodeOptions {
@@ -634,7 +634,7 @@ export default defineComponent({
 			isProductionExecutionPreview: false,
 			enterTimer: undefined as undefined | ReturnType<typeof setTimeout>,
 			exitTimer: undefined as undefined | ReturnType<typeof setTimeout>,
-			readOnlyNotification: null as null | ElNotificationComponent,
+			readOnlyNotification: null as null | ElNotification,
 			// jsplumb automatically deletes all loose connections which is in turn recorded
 			// in undo history as a user action.
 			// This should prevent automatically removed connections from populating undo stack
@@ -3845,7 +3845,7 @@ export default defineComponent({
 				this.readOnlyEnv &&
 				[VIEWS.NEW_WORKFLOW, VIEWS.TEMPLATE_IMPORT].includes(this.$route.name)
 			) {
-				this.$nextTick(async () => {
+				void this.$nextTick(async () => {
 					this.resetWorkspace();
 					this.uiStore.stateIsDirty = false;