feat(editor): Debug executions in the editor (#6834)

packages/editor-ui/src/components/DebugPaywallModal.vue

@@ -0,0 +1,40 @@
+<script lang="ts" setup>
+import { useI18n } from '@/composables';
+import Modal from '@/components/Modal.vue';
+
+const props = defineProps<{
+	modalName: string;
+	data: { title: string; footerButtonAction: () => void };
+}>();
+
+const i18n = useI18n();
+</script>
+
+<template>
+	<Modal width="500px" :title="props.data.title" :name="props.modalName">
+		<template #content>
+			<n8n-text>
+				{{ i18n.baseText('executionsList.debug.paywall.content') }}
+				<br />
+				<n8n-link :to="i18n.baseText('executionsList.debug.paywall.link.url')">
+					{{ i18n.baseText('executionsList.debug.paywall.link.text') }}
+				</n8n-link>
+			</n8n-text>
+		</template>
+		<template #footer>
+			<div :class="$style.footer">
+				<n8n-button @click="props.data.footerButtonAction">
+					{{ i18n.baseText('generic.seePlans') }}
+				</n8n-button>
+			</div>
+		</template>
+	</Modal>
+</template>
+
+<style module lang="scss">
+.footer {
+	display: flex;
+	flex-direction: row;
+	justify-content: flex-end;
+}
+</style>