fix(loops): group loops by visibility

packages/ui/src/features/loops/components/LoopsListView.test.tsx

@@ -48,12 +48,11 @@ function controlledPanel(tab: HTMLElement): HTMLElement {
 }
 
 describe("LoopsListViewPresentation", () => {
-  it("does not render ownership groups while identity is loading", () => {
+  it("does not render visibility groups while loops are loading", () => {
     render(
       <Theme>
         <LoopsListViewPresentation
           loops={[loop("mine-team", "team")]}
-          currentUserId={null}
           isLoading
           onStartBlank={vi.fn()}
           onStartFromTemplate={vi.fn()}
@@ -64,7 +63,7 @@ describe("LoopsListViewPresentation", () => {
     expect(screen.queryByRole("tab")).not.toBeInTheDocument();
   });
 
-  it("groups loops by ownership rather than visibility", async () => {
+  it("groups loops by visibility regardless of their creator", async () => {
     const currentUser: UserBasic = {
       id: 1,
       uuid: "current-user",
@@ -78,31 +77,30 @@ describe("LoopsListViewPresentation", () => {
             loop("mine-team", "team"),
             loop("teammate-team", "team", 2),
           ]}
-          currentUserId={1}
           members={[currentUser]}
           onStartBlank={vi.fn()}
           onStartFromTemplate={vi.fn()}
         />
       </Theme>,
     );
 
-    const personalTab = screen.getByRole("tab", { name: "My loops (2)" });
+    const personalTab = screen.getByRole("tab", { name: "My loops (1)" });
     expect(
       within(controlledPanel(personalTab)).getByText("personal loop"),
     ).toBeVisible();
-    expect(
-      within(controlledPanel(personalTab)).getByText(
-        "team loop by current@example.com",
-      ),
-    ).toBeVisible();
 
-    const teamTab = screen.getByRole("tab", { name: "Team loops (1)" });
+    const teamTab = screen.getByRole("tab", { name: "Team loops (2)" });
     await userEvent.click(teamTab);
 
     expect(teamTab).toHaveAttribute("aria-selected", "true");
     expect(
-      within(controlledPanel(teamTab)).getByText("team loop"),
+      within(controlledPanel(teamTab)).getByText(
+        "team loop by current@example.com",
+      ),
     ).toBeVisible();
+    expect(
+      within(controlledPanel(teamTab)).getAllByText(/team loop/),
+    ).toHaveLength(2);
     // The deselected panel is inert, then unmounts when its transition ends.
     await waitFor(() =>
       expect(screen.queryByText("personal loop")).not.toBeInTheDocument(),
@@ -121,7 +119,6 @@ describe("LoopsListViewPresentation", () => {
             loop("personal", "personal"),
             loop("teammate-team", "team", 2),
           ]}
-          currentUserId={1}
           onStartBlank={vi.fn()}
           onStartFromTemplate={vi.fn()}
         />

packages/ui/src/features/loops/components/LoopsListView.tsx

@@ -3,8 +3,6 @@ import type { LoopSchemas } from "@posthog/api-client/loops";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@posthog/quill";
 import { ANALYTICS_EVENTS } from "@posthog/shared/analytics-events";
 import type { UserBasic } from "@posthog/shared/domain-types";
-import { useOptionalAuthenticatedClient } from "@posthog/ui/features/auth/authClient";
-import { useCurrentUser } from "@posthog/ui/features/auth/useCurrentUser";
 import { useOrgMembers } from "@posthog/ui/features/canvas/hooks/useOrgMembers";
 import { useBluebirdFlag } from "@posthog/ui/features/feature-flags/useBluebirdFlag";
 import { StopCloudRunDialog } from "@posthog/ui/features/sessions/components/StopCloudRunDialog";
@@ -79,22 +77,9 @@ export function LoopsListView() {
   // presentation — that renders bare in tests and Storybook, with no container
   // to resolve the flags service from.
   const bluebird = useBluebirdFlag();
-  const authenticatedClient = useOptionalAuthenticatedClient();
-  const {
-    data: currentUser,
-    isLoading: currentUserLoading,
-    isError: currentUserError,
-    error: currentUserQueryError,
-  } = useCurrentUser({ client: authenticatedClient });
   const limits = useLoopLimits();
   const limitReason =
     limits?.atLimit === true ? loopLimitReason(limits.max) : null;
-  let listError: unknown = null;
-  if (isError) {
-    listError = error;
-  } else if (currentUserError) {
-    listError = currentUserQueryError;
-  }
 
   // The page names itself (in-page header / title block), so it pushes no
   // breadcrumb row — only a space-attached loop scene has a parent to show.
@@ -148,9 +133,8 @@ export function LoopsListView() {
     <LoopsListViewPresentation
       sharedPageHeader={bluebird}
       loops={allLoops}
-      currentUserId={currentUser?.id ?? null}
-      isLoading={isLoading || currentUserLoading}
-      error={listError}
+      isLoading={isLoading}
+      error={isError ? error : null}
       limitReason={limitReason}
       members={members}
       membersLoading={membersLoading}
@@ -169,7 +153,6 @@ interface LoopsListViewPresentationProps {
   /** Bluebird: title/description/CTA move into the shared full-bleed header. */
   sharedPageHeader?: boolean;
   loops: LoopSchemas.Loop[];
-  currentUserId?: number | null;
   isLoading?: boolean;
   error?: unknown;
   limitReason?: string | null;
@@ -187,7 +170,6 @@ interface LoopsListViewPresentationProps {
 export function LoopsListViewPresentation({
   sharedPageHeader = false,
   loops,
-  currentUserId = null,
   isLoading = false,
   error = null,
   limitReason = null,
@@ -201,16 +183,8 @@ export function LoopsListViewPresentation({
   onResumeBuilderSession,
   onBuilderSessionStopped,
 }: LoopsListViewPresentationProps) {
-  const personalLoops = loops.filter(
-    (loop) =>
-      loop.visibility === "personal" ||
-      (currentUserId !== null && loop.created_by_id === currentUserId),
-  );
-  const teamLoops = loops.filter(
-    (loop) =>
-      loop.visibility === "team" &&
-      (currentUserId === null || loop.created_by_id !== currentUserId),
-  );
+  const personalLoops = loops.filter((loop) => loop.visibility === "personal");
+  const teamLoops = loops.filter((loop) => loop.visibility === "team");
 
   const createButton = (
     <Button