test(editor): Fix first project add button in closed sidebar (#14991)

packages/frontend/editor-ui/src/components/Projects/ProjectNavigation.test.ts

@@ -213,4 +213,17 @@ describe('ProjectsNavigation', () => {
 		expect(addFirstProjectButton).toBeVisible();
 		expect(addFirstProjectButton).toBeDisabled();
 	});
+
+	it('should show add first project button without text when the menu is collapsed', async () => {
+		projectsStore.teamProjectsLimit = -1;
+
+		const { getByTestId } = renderComponent({
+			props: {
+				collapsed: true,
+			},
+		});
+
+		expect(getByTestId('add-first-project-button')).toBeVisible();
+		expect(getByTestId('add-first-project-button').classList.contains('collapsed')).toBe(true);
+	});
 });

packages/frontend/editor-ui/src/components/Projects/ProjectNavigation.vue

@@ -143,7 +143,7 @@ const showAddFirstProject = computed(
 				data-test-id="add-first-project-button"
 				@click="globalEntityCreation.createProject"
 			>
-				{{ locale.baseText('projects.menu.addFirstProject') }}
+				<span>{{ locale.baseText('projects.menu.addFirstProject') }}</span>
 			</N8nButton>
 		</N8nTooltip>
 		<hr v-if="projectsStore.isTeamProjectFeatureEnabled" class="mb-m" />
@@ -212,6 +212,7 @@ const showAddFirstProject = computed(
 	&.collapsed {
 		> span:last-child {
 			display: none;
+			margin: 0 var(--spacing-s) var(--spacing-m);
 		}
 	}
 }