feat(editor): Add admin toggle for computer use in AI settings (no-changelog) (#28452)

This commit is contained in:
Albert Alises 2026-04-15 10:08:39 +02:00 committed by GitHub
parent f216fda511
commit e20f8e91ce
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 54 additions and 7 deletions

View file

@ -4227,6 +4227,9 @@
"settings.n8nAgent.description": "Enable or disable AI Assistant for this instance and control permissions",
"settings.n8nAgent.enable.label": "Enable AI Assistant",
"settings.n8nAgent.enable.description": "Enables the feature for all users in the instance",
"settings.n8nAgent.computerUse.label": "Enable Computer Use for AI Assistant",
"settings.n8nAgent.computerUse.description": "Allows users on this instance to connect AI Assistant to their computer to work with files, shell and browser",
"settings.n8nAgent.computerUse.disabled.warning": "Computer use has been disabled by your administrator",
"settings.n8nAgent.permissions.title": "Permissions",
"settings.n8nAgent.permissions.description": "Control which actions need approval before agent executes them. These settings don't grant users any extra permissions",
"settings.n8nAgent.permissions.alwaysAllow": "Always allow",
@ -5482,7 +5485,8 @@
"instanceAi.activitySummary.messages": "{count} messages",
"instanceAi.activitySummary.questions": "{count} answered questions",
"instanceAi.activitySummary.subagents": "{count} subagents",
"instanceAi.filesystem.label": "Local gateway",
"instanceAi.filesystem.label": "Allow AI Assistant to Connect to My Computer",
"instanceAi.filesystem.description": "Enables the AI Assistant to use your local computer to read and write files, execute commands and use your browser",
"instanceAi.filesystem.connected": "Files connected",
"instanceAi.filesystem.connectWaiting": "Connecting...",
"instanceAi.filesystem.copied": "Copied!",

View file

@ -92,12 +92,15 @@ onMounted(() => {
<template>
<div :class="$style.section">
<N8nHeading tag="h2" size="small">
{{ i18n.baseText('instanceAi.filesystem.label') }}
</N8nHeading>
<div :class="$style.switchRow">
<span :class="$style.switchLabel">{{ i18n.baseText('instanceAi.filesystem.label') }}</span>
<div>
<N8nHeading tag="h2" size="small">
{{ i18n.baseText('instanceAi.filesystem.label') }}
</N8nHeading>
<N8nText size="small" color="text-light">
{{ i18n.baseText('instanceAi.filesystem.description') }}
</N8nText>
</div>
<ElSwitch
:model-value="!isLocalGatewayDisabled"
:disabled="store.isLocalGatewayDisabled"
@ -105,7 +108,14 @@ onMounted(() => {
/>
</div>
<template v-if="!isLocalGatewayDisabled">
<div v-if="store.isLocalGatewayDisabled" :class="$style.warningRow">
<N8nIcon icon="triangle-alert" size="small" />
<N8nText size="small" color="text-light">
{{ i18n.baseText('settings.n8nAgent.computerUse.disabled.warning') }}
</N8nText>
</div>
<template v-if="!isLocalGatewayDisabled && !store.isLocalGatewayDisabled">
<!-- Gateway connected -->
<div v-if="store.isGatewayConnected" :class="$style.connectedBlock">
<div :class="$style.statusRow">
@ -192,6 +202,14 @@ onMounted(() => {
color: var(--color--text--tint-1);
}
.warningRow {
display: flex;
align-items: center;
gap: var(--spacing--3xs);
padding: var(--spacing--4xs) 0;
color: var(--color--warning);
}
.connectedBlock {
display: flex;
flex-direction: column;

View file

@ -58,6 +58,11 @@ function handleEnabledToggle(value: string | number | boolean) {
void store.save();
}
function handleComputerUseToggle(value: string | number | boolean) {
store.setField('localGatewayDisabled', !Boolean(value));
void store.save();
}
function handlePermissionChange(key: keyof InstanceAiPermissions, value: InstanceAiPermissionMode) {
store.setPermission(key, value);
void store.save();
@ -100,6 +105,26 @@ function handlePermissionChange(key: keyof InstanceAiPermissions, value: Instanc
/>
</div>
</div>
<div :class="$style.card">
<div :class="$style.settingsRow">
<div :class="$style.settingsRowLeft">
<span :class="$style.settingsRowLabel">
{{ i18n.baseText('settings.n8nAgent.computerUse.label') }}
</span>
<span :class="$style.settingsRowDescription">
{{ i18n.baseText('settings.n8nAgent.computerUse.description') }}
</span>
</div>
<ElSwitch
:class="$style.toggle"
:model-value="!(store.settings?.localGatewayDisabled ?? false)"
:disabled="store.isSaving"
data-test-id="n8n-agent-computer-use-toggle"
@update:model-value="handleComputerUseToggle"
/>
</div>
</div>
</template>
<div :class="$style.card">