fix(editor): Add disabled state with tooltip on project creation buttons if user lacks permission (#13867)

This commit is contained in:
Guillaume Jacquart
2025-03-12 16:14:02 +01:00
committed by GitHub
parent c7bcdc544d
commit e33d0d7466
6 changed files with 85 additions and 26 deletions

View File

@@ -83,15 +83,21 @@ const showAddFirstProject = computed(
bold
>
<span>{{ locale.baseText('projects.menu.title') }}</span>
<N8nButton
v-if="projectsStore.canCreateProjects"
icon="plus"
text
data-test-id="project-plus-button"
:disabled="isCreatingProject"
:class="$style.plusBtn"
@click="globalEntityCreation.createProject"
/>
<N8nTooltip
placement="right"
:disabled="projectsStore.hasPermissionToCreateProjects"
:content="locale.baseText('projects.create.permissionDenied')"
>
<N8nButton
v-if="projectsStore.canCreateProjects"
icon="plus"
text
data-test-id="project-plus-button"
:disabled="isCreatingProject || !projectsStore.hasPermissionToCreateProjects"
:class="$style.plusBtn"
@click="globalEntityCreation.createProject"
/>
</N8nTooltip>
</N8nText>
<ElMenu
v-if="projectsStore.isTeamProjectFeatureEnabled || isFoldersFeatureEnabled"
@@ -118,22 +124,28 @@ const showAddFirstProject = computed(
data-test-id="project-menu-item"
/>
</ElMenu>
<N8nButton
v-if="showAddFirstProject"
:class="[
$style.addFirstProjectBtn,
{
[$style.collapsed]: props.collapsed,
},
]"
:disabled="isCreatingProject"
type="secondary"
icon="plus"
data-test-id="add-first-project-button"
@click="globalEntityCreation.createProject"
<N8nTooltip
placement="right"
:disabled="projectsStore.hasPermissionToCreateProjects"
:content="locale.baseText('projects.create.permissionDenied')"
>
{{ locale.baseText('projects.menu.addFirstProject') }}
</N8nButton>
<N8nButton
v-if="showAddFirstProject"
:class="[
$style.addFirstProjectBtn,
{
[$style.collapsed]: props.collapsed,
},
]"
:disabled="isCreatingProject || !projectsStore.hasPermissionToCreateProjects"
type="secondary"
icon="plus"
data-test-id="add-first-project-button"
@click="globalEntityCreation.createProject"
>
{{ locale.baseText('projects.menu.addFirstProject') }}
</N8nButton>
</N8nTooltip>
<hr v-if="projectsStore.isTeamProjectFeatureEnabled" class="mb-m" />
</div>
</template>