feat(editor): Clean up lead enrichment experiment (no-changelog) (#9572)

This commit is contained in:
Tomi Turtiainen
2024-06-03 10:35:55 +03:00
committed by GitHub
parent 99c15a0fd8
commit 09472fb9ee
17 changed files with 46 additions and 1263 deletions

View File

@@ -157,15 +157,6 @@
/>
</template>
</ModalRoot>
<ModalRoot :name="SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY">
<template #default="{ modalName, data }">
<SuggestedTemplatesPreviewModal
data-test-id="suggested-templates-preview-modal"
:modal-name="modalName"
:data="data"
/>
</template>
</ModalRoot>
<ModalRoot :name="SETUP_CREDENTIALS_MODAL_KEY">
<template #default="{ modalName, data }">
@@ -210,7 +201,6 @@ import {
DEBUG_PAYWALL_MODAL_KEY,
MFA_SETUP_MODAL_KEY,
WORKFLOW_HISTORY_VERSION_RESTORE,
SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY,
SETUP_CREDENTIALS_MODAL_KEY,
GENERATE_CURL_MODAL_KEY,
} from '@/constants';
@@ -245,7 +235,6 @@ import SourceControlPullModal from '@/components/SourceControlPullModal.ee.vue';
import ExternalSecretsProviderModal from '@/components/ExternalSecretsProviderModal.ee.vue';
import DebugPaywallModal from '@/components/DebugPaywallModal.vue';
import WorkflowHistoryVersionRestoreModal from '@/components/WorkflowHistory/WorkflowHistoryVersionRestoreModal.vue';
import SuggestedTemplatesPreviewModal from '@/components/SuggestedTemplates/SuggestedTemplatesPreviewModal.vue';
import SetupWorkflowCredentialsModal from '@/components/SetupWorkflowCredentialsModal/SetupWorkflowCredentialsModal.vue';
export default defineComponent({
@@ -281,7 +270,6 @@ export default defineComponent({
DebugPaywallModal,
MfaSetupModal,
WorkflowHistoryVersionRestoreModal,
SuggestedTemplatesPreviewModal,
SetupWorkflowCredentialsModal,
},
data: () => ({
@@ -314,7 +302,6 @@ export default defineComponent({
DEBUG_PAYWALL_MODAL_KEY,
MFA_SETUP_MODAL_KEY,
WORKFLOW_HISTORY_VERSION_RESTORE,
SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY,
SETUP_CREDENTIALS_MODAL_KEY,
}),
});

View File

@@ -1,107 +0,0 @@
<script setup lang="ts">
import { useRouter } from 'vue-router';
import { computed } from 'vue';
import { useUsersStore } from '@/stores/users.store';
import { useUIStore } from '@/stores/ui.store';
import { VIEWS } from '@/constants';
import type { ITemplatesCollection, IUser } from '@/Interface';
import SuggestedTemplatesSection from '@/components/SuggestedTemplates/SuggestedTemplatesSection.vue';
const usersStore = useUsersStore();
const uiStore = useUIStore();
const router = useRouter();
const currentUser = computed(() => usersStore.currentUser);
const upperCaseFirstName = (user: IUser | null) => {
if (!user?.firstName) return;
return user.firstName?.charAt(0)?.toUpperCase() + user?.firstName?.slice(1);
};
const defaultSection = computed(() => {
if (!uiStore.suggestedTemplates) {
return null;
}
return uiStore.suggestedTemplates.sections[0];
});
const suggestedTemplates = computed(() => {
const carouselCollections = Array<ITemplatesCollection>();
if (!uiStore.suggestedTemplates || !defaultSection.value) {
return carouselCollections;
}
defaultSection.value.workflows.forEach((workflow, index) => {
carouselCollections.push({
id: index,
name: workflow.title,
workflows: [{ id: index }],
nodes: workflow.nodes,
});
});
return carouselCollections;
});
function openCanvas() {
uiStore.nodeViewInitialized = false;
void router.push({ name: VIEWS.NEW_WORKFLOW });
}
defineExpose({
currentUser,
openCanvas,
suggestedTemplates,
});
</script>
<template>
<div :class="$style.container" data-test-id="suggested-templates-page-container">
<div :class="$style.header">
<n8n-heading tag="h1" size="2xlarge" class="mb-2xs">
{{
$locale.baseText('suggestedTemplates.heading', {
interpolate: {
name: upperCaseFirstName(currentUser) || $locale.baseText('generic.welcome'),
},
})
}}
</n8n-heading>
<n8n-text
size="large"
color="text-base"
data-test-id="suggested-template-section-description"
>
{{ defaultSection?.description }}
</n8n-text>
</div>
<div :class="$style.content">
<SuggestedTemplatesSection
v-for="section in uiStore.suggestedTemplates?.sections"
:key="section.title"
:section="section"
:show-title="false"
/>
</div>
<div>
<n8n-button
:label="$locale.baseText('suggestedTemplates.newWorkflowButton')"
type="secondary"
size="medium"
icon="plus"
data-test-id="suggested-templates-new-workflow-button"
@click="openCanvas"
/>
</div>
</div>
</template>
<style lang="scss" module>
.container {
display: flex;
flex-direction: column;
gap: var(--spacing-l);
}
.header {
margin-bottom: var(--spacing-l);
}
</style>

View File

@@ -1,109 +0,0 @@
<script lang="ts" setup>
import { useI18n } from '@/composables/useI18n';
import { useRouter } from 'vue-router';
import { useToast } from '@/composables/useToast';
import { useUIStore } from '@/stores/ui.store';
import { useUsersStore } from '@/stores/users.store';
import { useTelemetry } from '@/composables/useTelemetry';
import {
SUGGESTED_TEMPLATES_FLAG,
SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY,
VIEWS,
} from '@/constants';
import type { IWorkflowDb, SuggestedTemplatesWorkflowPreview } from '@/Interface';
import Modal from '@/components/Modal.vue';
import WorkflowPreview from '@/components/WorkflowPreview.vue';
const props = defineProps<{
modalName: string;
data: {
workflow: SuggestedTemplatesWorkflowPreview;
};
}>();
const i18n = useI18n();
const router = useRouter();
const uiStore = useUIStore();
const usersStore = useUsersStore();
const toast = useToast();
const telemetry = useTelemetry();
function showConfirmationMessage(event: PointerEvent) {
if (event.target instanceof HTMLAnchorElement) {
event.preventDefault();
// @ts-expect-error Additional parameters are not necessary for this function
toast.showMessage({
title: i18n.baseText('suggestedTemplates.notification.confirmation.title'),
message: i18n.baseText('suggestedTemplates.notification.confirmation.message'),
type: 'success',
});
telemetry.track(
'User wants to be notified once template is ready',
{ templateName: props.data.workflow.title, email: usersStore.currentUser?.email },
{
withPostHog: true,
},
);
}
}
function openCanvas() {
uiStore.setNotificationsForView(VIEWS.WORKFLOW, [
{
title: i18n.baseText('suggestedTemplates.notification.comingSoon.title'),
message: i18n.baseText('suggestedTemplates.notification.comingSoon.message'),
type: 'info',
duration: 10000,
onClick: showConfirmationMessage,
},
]);
localStorage.setItem(SUGGESTED_TEMPLATES_FLAG, 'false');
uiStore.deleteSuggestedTemplates();
uiStore.closeModal(SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY);
uiStore.nodeViewInitialized = false;
void router.push({ name: VIEWS.NEW_WORKFLOW });
telemetry.track(
'User clicked Use Template button',
{ templateName: props.data.workflow.title },
{ withPostHog: true },
);
}
</script>
<template>
<Modal width="900px" height="640px" :name="props.modalName">
<template #header>
<n8n-heading tag="h2" size="xlarge">
{{ $props.data.workflow.title }}
</n8n-heading>
</template>
<template #content>
<WorkflowPreview
:loading="false"
:workflow="$props.data.workflow.preview as IWorkflowDb"
:can-open-n-d-v="false"
:hide-node-issues="true"
@close="uiStore.closeModal(SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY)"
/>
</template>
<template #footer>
<div>
<n8n-text> {{ $props.data.workflow.description }} </n8n-text>
</div>
<div :class="$style.footerButtons">
<n8n-button
float="right"
data-test-id="use-template-button"
:label="$locale.baseText('suggestedTemplates.modal.button.label')"
@click="openCanvas"
/>
</div>
</template>
</Modal>
</template>
<style module lang="scss">
.footerButtons {
margin-top: var(--spacing-xl);
}
</style>

View File

@@ -1,82 +0,0 @@
<script setup lang="ts">
import { type PropType, computed } from 'vue';
import { useUIStore } from '@/stores/ui.store';
import { useTelemetry } from '@/composables/useTelemetry';
import type { ITemplatesCollection, ITemplatesNode, SuggestedTemplatesSection } from '@/Interface';
import TemplatesInfoCarousel from '@/components/TemplatesInfoCarousel.vue';
import { SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY } from '@/constants';
const uiStore = useUIStore();
const telemetry = useTelemetry();
const props = defineProps({
section: {
type: Object as PropType<SuggestedTemplatesSection>,
required: true,
},
title: {
type: String as PropType<string>,
required: false,
},
showTitle: {
type: Boolean as PropType<boolean>,
default: true,
},
});
const sectionTemplates = computed(() => {
const carouselCollections = Array<ITemplatesCollection>();
if (!uiStore.suggestedTemplates) {
return carouselCollections;
}
props.section.workflows.forEach((workflow, index) => {
carouselCollections.push({
id: index,
name: workflow.title,
workflows: [{ id: index }],
nodes: workflow.nodes as ITemplatesNode[],
});
});
return carouselCollections;
});
function onOpenCollection({ id }: { event: Event; id: number }) {
uiStore.openModalWithData({
name: SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY,
data: { workflow: props.section.workflows[id] },
});
telemetry.track(
'User clicked template recommendation',
{ templateName: props.section.workflows[id].title },
{ withPostHog: true },
);
}
</script>
<template>
<div :class="$style.container" data-test-id="suggested-templates-section-container">
<div v-if="showTitle" :class="$style.header">
<n8n-text size="large" color="text-base" :bold="true">
{{ props.title ?? section.title }}
</n8n-text>
</div>
<div :class="$style.content">
<TemplatesInfoCarousel
:collections="sectionTemplates"
:loading="false"
:show-item-count="false"
:show-navigation="false"
cards-width="24%"
@open-collection="onOpenCollection"
/>
</div>
</div>
</template>
<style lang="scss" module>
.container {
display: flex;
flex-direction: column;
gap: var(--spacing-l);
}
</style>

View File

@@ -114,9 +114,6 @@
<template #default="{ item, updateItemSize }">
<slot :data="item" :update-item-size="updateItemSize" />
</template>
<template #postListContent>
<slot name="postListContent" />
</template>
</n8n-recycle-scroller>
<n8n-datatable
v-if="type === 'datatable'"