Repository: n8n-io/n8n
File: packages/frontend/editor-ui/src/features/integrations/secretsProviders.ee/components/SecretsProviderConnectionModal.ee.vue (Vue)

Code before:
									<ParameterInputExpanded
										v-else
										:ref="(el) => modal.setParameterValidationState(property.name, el)"
										class="mb-l"
										:parameter="property"
										:value="modal.connectionSettings.value[property.name]"
										:label="LABEL_SIZE"
										event-source="secrets-provider-connection"
										@update="handleSettingChange"
									/>
								</form>
							</div>
						</div>

						<!-- Scope Tab Content (edit mode only) -->
						<div v-if="ACTIVE_TAB === 'sharing' && modal.isEditMode" :class="$style.mainContent">
							<div>
								<N8nInfoTip :bold="false" class="mb-s">
									{{ i18n.baseText('settings.secretsProviderConnections.modal.scope.info') }}
								</N8nInfoTip>
								<N8nInputLabel
									:label="i18n.baseText('settings.secretsProviderConnections.modal.scope.label')"
								>
									<N8nTooltip
										:disabled="!modal.isScopedMode.value"
										:content="
											i18n.baseText(
												'settings.secretsProviderConnections.modal.scope.disabled.tooltip',
											)
										"
										placement="top"
									>
										<N8nSelect
											:model-value="scopeSelectValue"
											size="large"
											filterable
											:disabled="!modal.canUpdate.value || modal.isScopedMode.value"
											data-test-id="secrets-provider-scope-select"
											@update:model-value="handleScopeSelect"
										>
											<template #prefix>
												<N8nText
													v-if="selectedScopeIcon?.type === 'emoji'"
													color="text-light"
													:class="$style.menuItemEmoji"
												>
													{{ selectedScopeIcon.value }}
												</N8nText>
												<N8nIcon
													v-else-if="selectedScopeIcon?.value"
													color="text-light"

Review comment (security):
I worry about "encouraging" the changing of an existing scope anywhere in our UI, as long as we don't have some guidance in place to help admins change the affected credentials before changing the scope of an external secret (e.g. like we do for deleting a vault).

Code after:
									<ParameterInputExpanded
										v-else
										:ref="(el) => modal.setParameterValidationState(property.name, el)"
										class="mb-l"
										:parameter="property"
										:value="modal.connectionSettings.value[property.name]"
										:label="LABEL_SIZE"
										event-source="secrets-provider-connection"
										@update="handleSettingChange"
									/>
								</form>
							</div>
						</div>

						<!-- Scope Tab Content (edit mode only) -->
						<div v-if="ACTIVE_TAB === 'sharing' && modal.isEditMode" :class="$style.mainContent">
							<div>
								<N8nInfoTip :bold="false" class="mb-s">
									{{ i18n.baseText('settings.secretsProviderConnections.modal.scope.info') }}
								</N8nInfoTip>
								<N8nInputLabel
									:label="i18n.baseText('settings.secretsProviderConnections.modal.scope.label')"
								>
									<N8nSelect
										:model-value="scopeSelectValue"
										size="large"
										filterable
										:disabled="!modal.canUpdate.value || modal.isScopedMode.value"
										data-test-id="secrets-provider-scope-select"
										@update:model-value="handleScopeSelect"
									>
										<template #prefix>
											<N8nText
												v-if="selectedScopeIcon?.type === 'emoji'"
												color="text-light"
												:class="$style.menuItemEmoji"
											>
												{{ selectedScopeIcon.value }}
											</N8nText>
											<N8nIcon
												v-else-if="selectedScopeIcon?.value"
												color="text-light"
												:icon="selectedScopeIcon.value"
											/>
										</template>
										<N8nOption
											v-for="option in scopeOptions"
											:key="option.value || 'global'"
											:value="option.value"
											:label="option.label"
											:class="{