refactor: Add Onboarding call prompts (#3682)

* ✨ Implemented initial onboarding call prompt logic

* ✨ Added onboarding call prompt feature environment variable

* ✨ Implemented onboarding session signup modal

* 📈 Added initial telemetry for the onboarding call prompt

* ✔️ Fixing linter error in server.ts

* 💄 Updating onboaring call prompt and modal wording and styling

* ✨ Implemented initial version of fake doors feature

* ✨ Added parameters to onboarding call prompt request

* ✨ Finished implementing fake doors in settings

* 🔨 Updating onboarding call prompt fetching logic (fetching before timeout starts)

* 👌 Updating onboarding call prompt and fake door components based on the front-end review feedback

* ✨ Updated fake doors so they support UI location specification. Added credentials UI fake doors.

* ⚡ Added checkbox to the signup form, improved N8NCheckbox formatting to better handle overflow

* 💄 Moving seignup checkbox label text to i18n file, updating checkbox component css to force text wrap

* ✨ Update API calls to work with the new workflow request and response formats

* 👌 Updating fake door front-end based on the review feedback

* 👌 Updating onboarding call prompt and fake doors UI based in the product feedback

* ✨  Updated onboarding call prompts front-end to work with new endpoints and added new telemetry events

* 🐛 Fixing onboarding call prompts not appearing in first user sessions

* ⚡️ add createdAt to PublicUser

* 👌 Updating onboarding call prompts front-end to work with the latest back-end and addressing latest product review

* ✨ Improving error handling when submitting user emails on signup

* 💄 Updating info text on Logging feature page

* 💄 Updating first onboarding call prompt timeout to 5 minutes

* 💄 Fixing `N8nCheckbox` component font overflow

Co-authored-by: Ben Hesseldieck <b.hesseldieck@gmail.com>

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

@@ -25,6 +25,17 @@
 				</i>
 				<span slot="title">{{ $locale.baseText('settings.n8napi') }}</span>
 			</n8n-menu-item>
+			<n8n-menu-item
+				v-for="fakeDoor in settingsFakeDoorFeatures"
+				v-bind:key="fakeDoor.featureName"
+				:index="`/settings/coming-soon/${fakeDoor.id}`"
+				:class="$style.tab"
+			>
+				<i :class="$style.icon">
+					<font-awesome-icon :icon="fakeDoor.icon" />
+				</i>
+				<span slot="title">{{ $locale.baseText(fakeDoor.featureName) }}</span>
+			</n8n-menu-item>
 			<n8n-menu-item index="/settings/community-nodes" v-if="canAccessCommunityNodes()" :class="$style.tab">
 				<i :class="$style.icon">
 					<font-awesome-icon icon="cube" />
@@ -45,6 +56,7 @@ import mixins from 'vue-typed-mixins';
 import { mapGetters } from 'vuex';
 import { ABOUT_MODAL_KEY, VIEWS } from '@/constants';
 import { userHelpers } from './mixins/userHelpers';
+import { IFakeDoor } from '@/Interface';
 
 export default mixins(
 	userHelpers,
@@ -52,6 +64,9 @@ export default mixins(
 	name: 'SettingsSidebar',
 	computed: {
 		...mapGetters('settings', ['versionCli']),
+		settingsFakeDoorFeatures(): IFakeDoor[] {
+			return this.$store.getters['ui/getFakeDoorByLocation']('settings');
+		},
 	},
 	methods: {
 		canAccessPersonalSettings(): boolean {