feat(editor): Load fixed template list as experiment (#6632)

* feat(editor): Load fixed template list as experiment

Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>

* Improve templates loading

Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>

* get rid of endResult message

Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>

* Do not lazy-load when fixedListExperiment

Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>

---------

Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>

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

@@ -31,7 +31,7 @@ import type { PropType } from 'vue';
 import type { ITemplatesCollection } from '@/Interface';
 import Card from '@/components/CollectionWorkflowCard.vue';
 import CollectionCard from '@/components/CollectionCard.vue';
-import VueAgile from 'vue-agile';
+import { VueAgile } from 'vue-agile';
 
 import { genericHelpers } from '@/mixins/genericHelpers';
 

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

@@ -55,6 +55,7 @@ import { abbreviateNumber, filterTemplateNodes } from '@/utils';
 import type { ITemplatesNode, ITemplatesWorkflow, ITemplatesWorkflowFull } from '@/Interface';
 import { mapStores } from 'pinia';
 import { useTemplatesStore } from '@/stores/templates.store';
+import TimeAgo from '@/components/TimeAgo.vue';
 
 export default defineComponent({
 	name: 'TemplateDetails',
@@ -72,6 +73,7 @@ export default defineComponent({
 	components: {
 		NodeIcon,
 		TemplateDetailsBlock,
+		TimeAgo,
 	},
 	computed: {
 		...mapStores(useTemplatesStore),

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

@@ -1,6 +1,6 @@
 <template>
 	<div :class="$style.list" v-if="loading || workflows.length">
-		<div :class="$style.header">
+		<div :class="$style.header" v-if="!hideHeader">
 			<n8n-heading :bold="true" size="medium" color="text-light">
 				{{ $locale.baseText('templates.workflows') }}
 				<span v-if="!loading && totalWorkflows" v-text="`(${totalWorkflows})`" />
@@ -57,6 +57,10 @@ export default defineComponent({
 		totalWorkflows: {
 			type: Number,
 		},
+		hideHeader: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	mounted() {
 		if (this.infiniteScrollEnabled) {