fix(editor): Add button to refresh branches (#6387)

* fix(editor): Add button to refresh branches * trigger CI
n8n-io · Jun 6, 2023 · ce57816 · ce57816
1 parent e72521d
commit ce57816
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 14 deletions.
diff --git a/packages/editor-ui/src/plugins/i18n/locales/en.json b/packages/editor-ui/src/plugins/i18n/locales/en.json
@@ -1403,6 +1403,9 @@
 	"settings.versionControl.loading.pull": "Pulling from remote",
 	"settings.versionControl.loading.push": "Pushing to remote",
 	"settings.versionControl.saved.title": "Settings successfully saved",
+	"settings.versionControl.refreshBranches.tooltip": "Reload branches list",
+	"settings.versionControl.refreshBranches.success": "Branches successfully refreshed",
+	"settings.versionControl.refreshBranches.error": "Error refreshing branches",
 	"showMessage.cancel": "@:_reusableBaseText.cancel",
 	"showMessage.ok": "OK",
 	"showMessage.showDetails": "Show Details",

diff --git a/packages/editor-ui/src/views/SettingsVersionControl.vue b/packages/editor-ui/src/views/SettingsVersionControl.vue
@@ -162,6 +162,18 @@ async function refreshSshKey() {
 		toast.showError(error, locale.baseText('settings.versionControl.refreshSshKey.error.title'));
 	}
 }
+
+const refreshBranches = async () => {
+	try {
+		await versionControlStore.getBranches();
+		toast.showMessage({
+			title: locale.baseText('settings.versionControl.refreshBranches.success'),
+			type: 'success',
+		});
+	} catch (error) {
+		toast.showError(error, locale.baseText('settings.versionControl.refreshBranches.error'));
+	}
+};
 </script>
 
 <template>
@@ -288,20 +300,37 @@ async function refreshSshKey() {
 						locale.baseText('settings.versionControl.instanceSettings')
 					}}</n8n-heading>
 					<label>{{ locale.baseText('settings.versionControl.branches') }}</label>
-					<n8n-select
-						:value="versionControlStore.preferences.branchName"
-						class="mb-s"
-						size="medium"
-						filterable
-						@input="onSelect"
-					>
-						<n8n-option
-							v-for="b in versionControlStore.preferences.branches"
-							:key="b"
-							:value="b"
-							:label="b"
-						/>
-					</n8n-select>
+					<div :class="$style.branchSelection">
+						<n8n-select
+							:value="versionControlStore.preferences.branchName"
+							class="mb-s"
+							size="medium"
+							filterable
+							@input="onSelect"
+						>
+							<n8n-option
+								v-for="b in versionControlStore.preferences.branches"
+								:key="b"
+								:value="b"
+								:label="b"
+							/>
+						</n8n-select>
+						<n8n-tooltip placement="top">
+							<template #content>
+								<span>
+									{{ locale.baseText('settings.versionControl.refreshBranches.tooltip') }}
+								</span>
+							</template>
+							<n8n-button
+								size="small"
+								type="tertiary"
+								icon="sync"
+								square
+								:class="$style.refreshBranches"
+								@click="refreshBranches"
+							/>
+						</n8n-tooltip>
+					</div>
 					<n8n-checkbox
 						v-model="versionControlStore.preferences.branchReadOnly"
 						:class="$style.readOnly"
@@ -418,4 +447,14 @@ hr {
 	margin: 0 0 var(--spacing-xl);
 	border: 1px solid var(--color-foreground-light);
 }
+
+.branchSelection {
+	display: flex;
+
+	button.refreshBranches {
+		height: 36px;
+		width: 36px;
+		margin-left: var(--spacing-xs);
+	}
+}
 </style>