From e3f47994b17d510b329db83dca412a18b6b47e3d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Iv=C3=A1n=20Ovejero?= <ivov.src@gmail.com>
Date: Wed, 10 May 2023 09:51:11 +0200
Subject: [PATCH] refactor(editor): Add GitHub 30k stars banner (no-changelog)
 (#6204)

* :zap: Add GitHub 30k stars banner

* refactor(editor): Add date check to GitHub 30k stars banner (#6210)
---
 .../layouts/ResourcesListLayout.vue           | 28 ++++++++++++++++++-
 packages/editor-ui/src/constants.ts           |  3 ++
 .../src/plugins/i18n/locales/en.json          |  2 ++
 packages/editor-ui/src/plugins/icons/index.ts |  2 ++
 4 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/packages/editor-ui/src/components/layouts/ResourcesListLayout.vue b/packages/editor-ui/src/components/layouts/ResourcesListLayout.vue
index e781672db5..ba6109e429 100644
--- a/packages/editor-ui/src/components/layouts/ResourcesListLayout.vue
+++ b/packages/editor-ui/src/components/layouts/ResourcesListLayout.vue
@@ -61,6 +61,20 @@
 			<page-view-layout-list :overflow="type !== 'list'" v-else>
 				<template #header>
 					<div class="mb-xs">
+						<n8n-callout
+							v-if="starsBannerShouldRender"
+							theme="secondary"
+							icon="star"
+							:class="$style['github-stars-banner']"
+						>
+							<span v-html="$locale.baseText('githubStars.banner.title')"></span>
+							<template #trailingContent>
+								<n8n-link :to="repoUrl" size="small" theme="secondary" bold underline>
+									{{ $locale.baseText('githubStars.banner.link') }}
+								</n8n-link>
+							</template>
+						</n8n-callout>
+
 						<div :class="$style['filters-row']">
 							<n8n-input
 								:class="[$style['search'], 'mr-2xs']"
@@ -187,7 +201,11 @@ import mixins from 'vue-typed-mixins';
 
 import PageViewLayout from '@/components/layouts/PageViewLayout.vue';
 import PageViewLayoutList from '@/components/layouts/PageViewLayoutList.vue';
-import { EnterpriseEditionFeature } from '@/constants';
+import {
+	EnterpriseEditionFeature,
+	GITHUB_STARS_BANNER_SHOW_UNTIL_DATE,
+	MAIN_REPOSITORY_URL,
+} from '@/constants';
 import TemplateCard from '@/components/TemplateCard.vue';
 import type { PropType } from 'vue';
 import { debounceHelper } from '@/mixins/debounce';
@@ -299,10 +317,14 @@ export default mixins(showMessage, debounceHelper).extend({
 			rowsPerPage: 10 as number | '*',
 			resettingFilters: false,
 			EnterpriseEditionFeature,
+			repoUrl: MAIN_REPOSITORY_URL,
 		};
 	},
 	computed: {
 		...mapStores(useSettingsStore, useUsersStore),
+		starsBannerShouldRender() {
+			return this.resourceKey === 'workflows' && new Date() < GITHUB_STARS_BANNER_SHOW_UNTIL_DATE;
+		},
 		subviewResources(): IResource[] {
 			if (!this.shareable) {
 				return this.resources as IResource[];
@@ -533,4 +555,8 @@ export default mixins(showMessage, debounceHelper).extend({
 .datatable {
 	padding-bottom: var(--spacing-s);
 }
+
+.github-stars-banner {
+	margin-bottom: var(--spacing-m);
+}
 </style>
diff --git a/packages/editor-ui/src/constants.ts b/packages/editor-ui/src/constants.ts
index 501fbbcdeb..99e14b81f7 100644
--- a/packages/editor-ui/src/constants.ts
+++ b/packages/editor-ui/src/constants.ts
@@ -80,6 +80,7 @@ export const COMMUNITY_NODES_BLOCKLIST_DOCS_URL = `https://${DOCS_DOMAIN}/integr
 export const CUSTOM_NODES_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/creating-nodes/code/create-n8n-nodes-module/`;
 export const EXPRESSIONS_DOCS_URL = `https://${DOCS_DOMAIN}/code-examples/expressions/`;
 export const N8N_PRICING_PAGE_URL = 'https://n8n.io/pricing';
+export const MAIN_REPOSITORY_URL = 'https://github.com/n8n-io/n8n';
 
 // node types
 export const BAMBOO_HR_NODE_TYPE = 'n8n-nodes-base.bambooHr';
@@ -548,3 +549,5 @@ export const ALLOWED_HTML_TAGS = [
 	'details',
 	'summary',
 ];
+
+export const GITHUB_STARS_BANNER_SHOW_UNTIL_DATE = new Date('2023-06-01');
diff --git a/packages/editor-ui/src/plugins/i18n/locales/en.json b/packages/editor-ui/src/plugins/i18n/locales/en.json
index fa89ec4ca1..64dce45c60 100644
--- a/packages/editor-ui/src/plugins/i18n/locales/en.json
+++ b/packages/editor-ui/src/plugins/i18n/locales/en.json
@@ -593,6 +593,8 @@
 	"genericHelpers.secShort": "s",
 	"genericHelpers.showMessage.message": "Executions are read-only. Make changes from the <b>Workflow</b> tab.",
 	"genericHelpers.showMessage.title": "Cannot edit execution",
+	"githubStars.banner.title": "<b>Celebrating 30,000 stars on GitHub!</b> A big thank you to our community for your amazing support and contributions",
+	"githubStars.banner.link": "Star us on GitHub",
 	"mainSidebar.aboutN8n": "About n8n",
 	"mainSidebar.confirmMessage.workflowDelete.cancelButtonText": "",
 	"mainSidebar.confirmMessage.workflowDelete.confirmButtonText": "Yes, delete",
diff --git a/packages/editor-ui/src/plugins/icons/index.ts b/packages/editor-ui/src/plugins/icons/index.ts
index 90257a28ce..3a4532429a 100644
--- a/packages/editor-ui/src/plugins/icons/index.ts
+++ b/packages/editor-ui/src/plugins/icons/index.ts
@@ -105,6 +105,7 @@ import {
 	faSignOutAlt,
 	faSlidersH,
 	faSpinner,
+	faStar,
 	faStop,
 	faSun,
 	faSync,
@@ -241,6 +242,7 @@ addIcon(faSlidersH);
 addIcon(faSpinner);
 addIcon(faSolidStickyNote);
 addIcon(faStickyNote as IconDefinition);
+addIcon(faStar);
 addIcon(faStop);
 addIcon(faSun);
 addIcon(faSync);