From 0e0a064fa7ae54a8a6b695bd4bb19da71334fea0 Mon Sep 17 00:00:00 2001
From: Csaba Tuncsik <csaba@n8n.io>
Date: Wed, 19 Apr 2023 16:01:32 +0200
Subject: [PATCH] feat(editor): Version control (WIP) (#6013)

* feat(editor): Version control settings (with feature flag)

* feat(editor): replace posthog feature flag with local storage key
---
 .../src/components/SettingsSidebar.vue        | 16 ++++++++++++
 packages/editor-ui/src/constants.ts           |  1 +
 .../src/plugins/i18n/locales/en.json          |  1 +
 packages/editor-ui/src/router.ts              | 26 +++++++++++++++++++
 .../src/views/SettingsVersionControl.vue      | 11 ++++++++
 5 files changed, 55 insertions(+)
 create mode 100644 packages/editor-ui/src/views/SettingsVersionControl.vue

diff --git a/packages/editor-ui/src/components/SettingsSidebar.vue b/packages/editor-ui/src/components/SettingsSidebar.vue
index bd9c380a1ad28..8b4676b9eb696 100644
--- a/packages/editor-ui/src/components/SettingsSidebar.vue
+++ b/packages/editor-ui/src/components/SettingsSidebar.vue
@@ -74,6 +74,14 @@ export default mixins(userHelpers, pushConnection).extend({
 					available: this.canAccessApiSettings(),
 					activateOnRouteNames: [VIEWS.API_SETTINGS],
 				},
+				{
+					id: 'settings-version-control',
+					icon: 'code-branch',
+					label: this.$locale.baseText('settings.versionControl.title'),
+					position: 'top',
+					available: this.canAccessVersionControl(),
+					activateOnRouteNames: [VIEWS.VERSION_CONTROL],
+				},
 				{
 					id: 'settings-sso',
 					icon: 'user-lock',
@@ -151,6 +159,9 @@ export default mixins(userHelpers, pushConnection).extend({
 		canAccessUsageAndPlan(): boolean {
 			return this.canUserAccessRouteByName(VIEWS.USAGE);
 		},
+		canAccessVersionControl(): boolean {
+			return this.canUserAccessRouteByName(VIEWS.VERSION_CONTROL);
+		},
 		canAccessSso(): boolean {
 			return this.canUserAccessRouteByName(VIEWS.SSO_SETTINGS);
 		},
@@ -207,6 +218,11 @@ export default mixins(userHelpers, pushConnection).extend({
 						this.$router.push({ name: VIEWS.SSO_SETTINGS });
 					}
 					break;
+				case 'settings-version-control':
+					if (this.$router.currentRoute.name !== VIEWS.VERSION_CONTROL) {
+						this.$router.push({ name: VIEWS.VERSION_CONTROL });
+					}
+					break;
 				default:
 					break;
 			}
diff --git a/packages/editor-ui/src/constants.ts b/packages/editor-ui/src/constants.ts
index a2cb6d066168a..1c4aaef204473 100644
--- a/packages/editor-ui/src/constants.ts
+++ b/packages/editor-ui/src/constants.ts
@@ -395,6 +395,7 @@ export enum VIEWS {
 	LOG_STREAMING_SETTINGS = 'LogStreamingSettingsView',
 	SSO_SETTINGS = 'SSoSettings',
 	SAML_ONBOARDING = 'SamlOnboarding',
+	VERSION_CONTROL = 'VersionControl',
 }
 
 export enum FAKE_DOOR_FEATURES {
diff --git a/packages/editor-ui/src/plugins/i18n/locales/en.json b/packages/editor-ui/src/plugins/i18n/locales/en.json
index 781d56acc504c..b78516a1b7f53 100644
--- a/packages/editor-ui/src/plugins/i18n/locales/en.json
+++ b/packages/editor-ui/src/plugins/i18n/locales/en.json
@@ -1291,6 +1291,7 @@
 	"settings.usageAndPlan.license.activation.success.message": "Your {name} {type} has been successfully activated.",
 	"settings.usageAndPlan.desktop.title": "Upgrade to n8n Cloud for the full experience",
 	"settings.usageAndPlan.desktop.description": "Cloud plans allow you to collaborate with teammates. Plus you don’t need to leave this app open all the time for your workflows to run.",
+	"settings.versionControl.title": "Version Control",
 	"showMessage.cancel": "@:_reusableBaseText.cancel",
 	"showMessage.ok": "OK",
 	"showMessage.showDetails": "Show Details",
diff --git a/packages/editor-ui/src/router.ts b/packages/editor-ui/src/router.ts
index fdce8341cf2c5..dacfc5db92464 100644
--- a/packages/editor-ui/src/router.ts
+++ b/packages/editor-ui/src/router.ts
@@ -40,6 +40,7 @@ import SettingsUsageAndPlanVue from './views/SettingsUsageAndPlan.vue';
 import SettingsSso from './views/SettingsSso.vue';
 import SignoutView from '@/views/SignoutView.vue';
 import SamlOnboarding from '@/views/SamlOnboarding.vue';
+import SettingsVersionControl from './views/SettingsVersionControl.vue';
 
 Vue.use(Router);
 
@@ -572,6 +573,31 @@ export const routes = [
 					},
 				},
 			},
+			{
+				path: 'version-control',
+				name: VIEWS.VERSION_CONTROL,
+				components: {
+					settingsView: SettingsVersionControl,
+				},
+				meta: {
+					telemetry: {
+						pageCategory: 'settings',
+						getProperties(route: Route) {
+							return {
+								feature: 'vc',
+							};
+						},
+					},
+					permissions: {
+						allow: {
+							role: [ROLE.Owner],
+						},
+						deny: {
+							shouldDeny: () => !window.localStorage.getItem('version-control'),
+						},
+					},
+				},
+			},
 			{
 				path: 'sso',
 				name: VIEWS.SSO_SETTINGS,
diff --git a/packages/editor-ui/src/views/SettingsVersionControl.vue b/packages/editor-ui/src/views/SettingsVersionControl.vue
new file mode 100644
index 0000000000000..ca0a897e6c399
--- /dev/null
+++ b/packages/editor-ui/src/views/SettingsVersionControl.vue
@@ -0,0 +1,11 @@
+<script lang="ts" setup>
+import { i18n as locale } from '@/plugins/i18n';
+</script>
+
+<template>
+	<div>
+		<n8n-heading size="2xlarge">{{ locale.baseText('settings.versionControl.title') }}</n8n-heading>
+	</div>
+</template>
+
+<style lang="scss" module></style>