feat(editor): create new workflows page (#4267)

* feat(editor): extract credentials view into reusable layout components for workflows view

* feat(editor): add workflow card and start work on empty state

* feat: add hoverable card and finish workflows empty state

* fix: undo workflows response interface changes

* chore: fix linting issues.

* fix: remove enterprise sharing env schema

* fix(editor): fix workflows resource view when sharing is enabled

* fix: change owner tag design and order

* feat: add personalization survey on workflows page

* fix: update component snapshots

* feat: refactored workflow card to use workflow-activator properly

* fix: fix workflow activator and proptypes

* fix: hide owner tag for workflow card until sharing is available

* fix: fixed ownedBy and sharedWith appearing for workflows list

* feat: update tags component design

* refactor: change resource filter select to n8n-user-select

* fix: made telemetry messages reusable

* chore: remove unused import

* refactor: fix component name casing

* refactor: use Vue.set to make workflow property reactive

* feat: add support for clicking on tags for filtering

* chore: fix tags linting issues

* fix: fix resources list layout when title words are very long

* refactor: add active and inactive status text to workflow activator

* fix: fix credentials and workflows sorting when name contains leading whitespace

* fix: remove wrongfully added style tag

* feat: add translations and storybook examples for truncated tags

* fix: remove enterprise sharing env from schema

* refactor: fix workflows module and workflows field store naming conflict

* fix: fix workflow activator wrapping

* feat: updated empty workflows list cards design

* feat: update workflow activator margins and workflow card

* feat: add duplicate workflow functionality and update tags

* feat: fix duplicate workflow flow

* fix: fix status color for workflow activator with could not be started status

* fix: remove createdAt and updatedAt from workflow duplication

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

@@ -0,0 +1,66 @@
+<template>
+	<n8n-card
+		:class="$style.card"
+		v-on="$listeners"
+	>
+		<template #header v-if="!loading">
+			<span
+				v-text="title"
+				:class="$style.title"
+			/>
+		</template>
+		<n8n-loading :loading="loading" :rows="3" variant="p" />
+		<template #footer v-if="!loading">
+			<slot name="footer" />
+		</template>
+	</n8n-card>
+</template>
+
+<script lang="ts">
+import { genericHelpers } from '@/components/mixins/genericHelpers';
+import mixins from 'vue-typed-mixins';
+
+export default mixins(genericHelpers).extend({
+	name: 'Card',
+	props: {
+		loading: {
+			type: Boolean,
+		},
+		title: {
+			type: String,
+		},
+	},
+});
+</script>
+
+<style lang="scss" module>
+.card {
+	width: 240px !important;
+	height: 140px;
+	margin-right: var(--spacing-2xs);
+	cursor: pointer;
+
+	&:last-child {
+		margin-right: var(--spacing-5xs);
+	}
+
+	&:hover {
+		box-shadow: 0 2px 4px rgba(68,28,23,0.07);
+	}
+
+	> div {
+		height: 100%;
+	}
+}
+
+.title {
+	display: -webkit-box;
+	-webkit-line-clamp: 4;
+	-webkit-box-orient: vertical;
+	font-size: var(--font-size-s);
+	line-height: var(--font-line-height-regular);
+	font-weight: var(--font-weight-bold);
+	overflow: hidden;
+	white-space: normal;
+}
+</style>