Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions desktop/playwright.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@ export default defineConfig({
"**/project-commit-detail.spec.ts",
"**/project-inbox.spec.ts",
"**/project-pr-review.spec.ts",
"**/projects-empty-create.spec.ts",
"**/persona-model-combobox-screenshots.spec.ts",
"**/drafts-screenshots.spec.ts",
"**/drafts-all-fix-screenshots.spec.ts",
Expand Down
22 changes: 20 additions & 2 deletions desktop/src/features/projects/ui/ProjectCards.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -263,16 +263,34 @@ function StatusPill({ status }: { status: string }) {
);
}

export function EmptyState() {
export function EmptyState({
onCreateRepository,
}: {
onCreateRepository?: () => void;
} = {}) {
return (
<div className="flex flex-1 flex-col items-center justify-center gap-3 px-4 py-16 text-center">
<div
className="flex flex-1 flex-col items-center justify-center gap-3 px-4 py-16 text-center"
data-testid="projects-empty-state"
>
<FolderGit2 className="h-10 w-10 text-muted-foreground/40" />
<div className="space-y-1">
<p className="text-sm font-medium text-foreground">No projects yet</p>
<p className="text-sm text-muted-foreground">
Projects published to this relay will appear here.
</p>
</div>
{onCreateRepository ? (
<Button
className="mt-2"
data-testid="projects-empty-create-repository"
onClick={onCreateRepository}
size="sm"
type="button"
>
Create repository
</Button>
) : null}
</div>
);
}
Expand Down
10 changes: 5 additions & 5 deletions desktop/src/features/projects/ui/ProjectsView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -447,10 +447,6 @@ export function ProjectsView() {
);
}

if (projects.length === 0) {
return <EmptyState />;
}

const repositoryItems =
visibleProjects.length === 0 ? (
<EmptyFilteredState />
Expand Down Expand Up @@ -649,7 +645,11 @@ export function ProjectsView() {
</div>
<div className="mx-auto w-full max-w-6xl">
<div className="w-full min-w-0 pb-4 pt-4">
{filter === "all" ? (
{projects.length === 0 ? (
<EmptyState
onCreateRepository={() => setCreateProjectOpen(true)}
/>
) : filter === "all" ? (
<ProjectsOverviewPanel
localRepositoryCount={localProjectCount}
metadata={
Expand Down
53 changes: 53 additions & 0 deletions desktop/tests/e2e/projects-empty-create.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import { expect, test } from "@playwright/test";

import { installMockBridge, TEST_IDENTITIES } from "../helpers/bridge";

const DEFAULT_MOCK_PUBKEY = "deadbeef".repeat(8);

// The projects surface is a preview feature — opt in before the app mounts.
async function enableProjectsFeature(page: import("@playwright/test").Page) {
await page.addInitScript(() => {
window.localStorage.setItem(
"buzz-feature-overrides-v1",
JSON.stringify({ projects: true }),
);
});
}

/** Hide every seeded mock project so Projects renders the true empty state. */
async function hideAllMockProjects(page: import("@playwright/test").Page) {
const hiddenCards = [
`30617:${DEFAULT_MOCK_PUBKEY}:buzz`,
`30617:${TEST_IDENTITIES.alice.pubkey}:relay-tools`,
`30617:${TEST_IDENTITIES.bob.pubkey}:design-system`,
];
await page.addInitScript((cards) => {
window.localStorage.setItem(
"buzz.projects.hidden-cards.v1",
JSON.stringify(cards),
);
}, hiddenCards);
}

test("empty Projects keeps Create repository controls", async ({ page }) => {
await enableProjectsFeature(page);
await hideAllMockProjects(page);
await installMockBridge(page);
await page.goto("/", { waitUntil: "domcontentloaded" });
await page.getByTestId("open-projects-view").click();

await expect(
page.getByRole("heading", { level: 1, name: "Projects" }),
).toBeVisible();
await expect(page.getByTestId("projects-empty-state")).toBeVisible();
await expect(page.getByTestId("projects-create-menu")).toBeVisible();

await page.getByTestId("projects-create-menu").hover();
await page.getByRole("menuitem", { name: "Repository" }).click();
await expect(page.getByTestId("create-project-dialog")).toBeVisible();
await page.keyboard.press("Escape");

await page.getByTestId("projects-empty-create-repository").click();
await expect(page.getByTestId("create-project-dialog")).toBeVisible();
await expect(page.getByTestId("create-project-name")).toBeVisible();
});