From 5c77534fd58223d339449537210208543c76b404 Mon Sep 17 00:00:00 2001
From: Dotta <bippadotta@protonmail.com>
Date: Tue, 18 Aug 2026 17:13:43 +0000
Subject: [PATCH] fix(apps): recognize draft connections in Browse

Co-Authored-By: Paperclip <noreply@paperclip.ing>
---
 ui/src/pages/apps/Browse.test.tsx | 50 ++++++++++++++++++++++++++++++-
 ui/src/pages/apps/Browse.tsx      |  2 +-
 2 files changed, 50 insertions(+), 2 deletions(-)

diff --git a/ui/src/pages/apps/Browse.test.tsx b/ui/src/pages/apps/Browse.test.tsx
index 6c40de03863..9eab1fd2404 100644
--- a/ui/src/pages/apps/Browse.test.tsx
+++ b/ui/src/pages/apps/Browse.test.tsx
@@ -245,7 +245,8 @@ describe("Browse store door (PAP-13254 door 1)", () => {
     );
     expect(editButtons).toHaveLength(2);
     expect(editButtons.every((button) => button.textContent?.includes("Edit connections"))).toBe(true);
-    expect(container.textContent).toContain("2 connected");
+    // draft connections count toward the total (they are real, pending-setup connections)
+    expect(container.textContent).toContain("3 connected");
     expect(container.textContent).toContain("Dotta’s Notion");
     expect(container.querySelector('[title="Dotta"] [data-slot="avatar"]')).toBeTruthy();
 
@@ -266,6 +267,53 @@ describe("Browse store door (PAP-13254 door 1)", () => {
     );
   });
 
+  it("treats an existing draft-only Notion connection as editable", async () => {
+    const applicationId = "057a2df6-175f-4dde-b246-743706444122";
+    const connectionId = "46dc23c1-ecfa-46f7-8e60-34a7cdbd661e";
+    listApplicationsMock.mockResolvedValue({
+      applications: [
+        {
+          id: applicationId,
+          name: "Notion",
+          status: "active",
+          applicationKey: "notion",
+          metadata: {},
+        },
+      ],
+    });
+    listConnectionsMock.mockResolvedValue({
+      connections: [
+        {
+          id: connectionId,
+          applicationId,
+          name: "Notion",
+          status: "draft",
+          config: { sourceTemplateKey: "notion" },
+          transportConfig: {},
+        },
+      ],
+    });
+
+    await renderBrowse();
+
+    const editButtons = Array.from(
+      container.querySelectorAll<HTMLButtonElement>(
+        'button[aria-label="Edit connection for Notion"]',
+      ),
+    );
+    expect(editButtons).toHaveLength(2);
+    expect(container.querySelector('button[aria-label="Connect for Notion"]')).toBeNull();
+    expect(container.textContent).toContain("1 connected");
+    expect(
+      container.querySelector('button[aria-label="Add another Notion account"]')?.textContent,
+    ).toContain("Add new");
+
+    await act(async () => {
+      editButtons[0]?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+    });
+    expect(navigateMock).toHaveBeenCalledWith(`/apps/${connectionId}/setup`);
+  });
+
   it("keeps the custom URL option available when gallery search has no matches", async () => {
     await renderBrowse();
 
diff --git a/ui/src/pages/apps/Browse.tsx b/ui/src/pages/apps/Browse.tsx
index d0577d30277..c34ff3b193e 100644
--- a/ui/src/pages/apps/Browse.tsx
+++ b/ui/src/pages/apps/Browse.tsx
@@ -125,7 +125,7 @@ export function Browse() {
     );
     const connectionsByApplicationId = new Map<string, typeof connections>();
     for (const connection of connections) {
-      if (connection.status === "archived" || connection.status === "draft") continue;
+      if (connection.status === "archived") continue;
       connectionsByApplicationId.set(
         connection.applicationId,
         [...(connectionsByApplicationId.get(connection.applicationId) ?? []), connection],