fix(mobile): retain requested PR environment while connecting

apps/mobile/src/features/pull-requests/pullRequestEnvironmentFallback.test.ts

@@ -1,5 +1,7 @@
 import { describe, expect, it } from "vite-plus/test";
 import type { EnvironmentProject } from "@t3tools/client-runtime/state/models";
+import type { EnvironmentConnectionPhase } from "@t3tools/client-runtime/connection";
+import { EnvironmentId } from "@t3tools/contracts";
 import { pullRequestFallbackEnvironment } from "./pullRequestEnvironmentFallback";
 
 const project = (environmentId: string, id: string, canonicalKey: string) =>
@@ -20,26 +22,55 @@ const target = {
   repository: "pingdotgg/t3code",
   host: "github.com",
 };
+const environment = (
+  environmentId: string,
+  connectionState: EnvironmentConnectionPhase = "connected",
+  isEnabled = true,
+) => ({ environmentId: EnvironmentId.make(environmentId), connectionState, isEnabled });
 
 describe("pullRequestFallbackEnvironment", () => {
   it("moves to a connected copy of the repository when the original is down", () => {
     expect(
-      pullRequestFallbackEnvironment(target, projects, new Set(["desktop", "server"])),
+      pullRequestFallbackEnvironment(target, projects, [
+        environment("desktop"),
+        environment("server"),
+      ]),
     ).toEqual({ environmentId: "server", projectId: "t3-copy" });
   });
 
   it("stays put while the original is connected or nothing else holds the repository", () => {
-    expect(pullRequestFallbackEnvironment(target, projects, new Set(["laptop", "server"]))).toBe(
-      null,
-    );
-    expect(pullRequestFallbackEnvironment(target, projects, new Set(["desktop"]))).toBe(null);
+    expect(
+      pullRequestFallbackEnvironment(target, projects, [
+        environment("laptop"),
+        environment("server"),
+      ]),
+    ).toBe(null);
+    expect(pullRequestFallbackEnvironment(target, projects, [environment("desktop")])).toBe(null);
   });
 
   it("derives the host from the original project when the route has none", () => {
     const { host: _host, ...hostless } = target;
-    expect(pullRequestFallbackEnvironment(hostless, projects, new Set(["server"]))).toEqual({
+    expect(pullRequestFallbackEnvironment(hostless, projects, [environment("server")])).toEqual({
       environmentId: "server",
       projectId: "t3-copy",
     });
   });
+
+  it.each(["available", "connecting", "reconnecting"] as const)(
+    "preserves an enabled target that is %s",
+    (phase) => {
+      expect(
+        pullRequestFallbackEnvironment(target, projects, [
+          environment("laptop", phase),
+          environment("server"),
+        ]),
+      ).toBe(null);
+    },
+  );
+
+  it("ignores disabled copies even if their connection still reports connected", () => {
+    expect(
+      pullRequestFallbackEnvironment(target, projects, [environment("server", "connected", false)]),
+    ).toBe(null);
+  });
 });

apps/mobile/src/features/pull-requests/pullRequestEnvironmentFallback.ts

@@ -1,4 +1,5 @@
 import type { EnvironmentProject } from "@t3tools/client-runtime/state/models";
+import type { EnvironmentConnectionSummary } from "@t3tools/client-runtime/state/presentation";
 
 export type PullRequestEnvironmentTarget = {
   readonly environmentId: string;
@@ -10,8 +11,26 @@ export type PullRequestEnvironmentTarget = {
 export function pullRequestFallbackEnvironment(
   target: PullRequestEnvironmentTarget,
   projects: ReadonlyArray<EnvironmentProject>,
-  connectedEnvironmentIds: ReadonlySet<string>,
+  environments: ReadonlyArray<
+    Pick<EnvironmentConnectionSummary, "environmentId" | "connectionState" | "isEnabled">
+  >,
 ) {
+  const requested = environments.find(
+    (environment) => environment.environmentId === target.environmentId,
+  );
+  // Available is also the initial state before the connection supervisor starts.
+  if (
+    requested?.isEnabled &&
+    (requested.connectionState === "available" ||
+      requested.connectionState === "connecting" ||
+      requested.connectionState === "reconnecting")
+  )
+    return null;
+  const connectedEnvironmentIds = new Set<string>(
+    environments
+      .filter((environment) => environment.isEnabled && environment.connectionState === "connected")
+      .map((environment) => environment.environmentId),
+  );
   if (connectedEnvironmentIds.has(target.environmentId)) return null;
   const own = projects.find(
     (project) => project.environmentId === target.environmentId && project.id === target.projectId,

apps/mobile/src/features/pull-requests/usePullRequestEnvironmentFallback.test.tsx

@@ -0,0 +1,140 @@
+import type { EnvironmentConnectionPhase } from "@t3tools/client-runtime/connection";
+import type { EnvironmentProject } from "@t3tools/client-runtime/state/models";
+import { EnvironmentId } from "@t3tools/contracts";
+import { act, useEffect, useState } from "react";
+import { createRoot } from "react-dom/client";
+import { expect, it, vi } from "vite-plus/test";
+
+import type { WorkspaceEnvironment } from "../../state/workspaceModel";
+import type { PullRequestEnvironmentTarget } from "./pullRequestEnvironmentFallback";
+
+const mocks = vi.hoisted(() => ({
+  environments: [] as ReadonlyArray<WorkspaceEnvironment>,
+  isReady: true,
+  projects: [] as ReadonlyArray<EnvironmentProject>,
+  navigation: { setParams: vi.fn<(params: Partial<PullRequestEnvironmentTarget>) => void>() },
+}));
+
+vi.mock("@react-navigation/native", () => ({ useNavigation: () => mocks.navigation }));
+vi.mock("../../state/entities", () => ({ useProjects: () => mocks.projects }));
+vi.mock("../../state/workspace", () => ({
+  useWorkspaceEnvironments: () => mocks.environments,
+  useConnectionsReady: () => mocks.isReady,
+}));
+
+import { usePullRequestEnvironmentFallback } from "./usePullRequestEnvironmentFallback";
+
+function environment(
+  environmentId: string,
+  connectionState: EnvironmentConnectionPhase,
+  isEnabled = true,
+): WorkspaceEnvironment {
+  return {
+    environmentId: EnvironmentId.make(environmentId),
+    environmentLabel: environmentId,
+    displayUrl: "",
+    isRelayManaged: false,
+    isEnabled,
+    connectionState,
+    connectionError: null,
+    connectionErrorTraceId: null,
+  };
+}
+
+function setup() {
+  (globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
+  mocks.isReady = true;
+  mocks.environments = [environment("requested", "connecting"), environment("copy", "connected")];
+  mocks.projects = [
+    { environmentId: "requested", id: "original" },
+    { environmentId: "copy", id: "copy-project" },
+  ].map(
+    (project) =>
+      ({
+        ...project,
+        repositoryIdentity: { canonicalKey: "github.com/owner/repo" },
+      }) as unknown as EnvironmentProject,
+  );
+  const container = document.createElement("div");
+  const root = createRoot(container);
+  mocks.navigation.setParams = vi.fn();
+  function Probe() {
+    const [params, updateParams] = useState({
+      environmentId: "requested",
+      projectId: "original",
+      repository: "owner/repo",
+      host: "github.com",
+    });
+    useEffect(() => {
+      mocks.navigation.setParams.mockImplementation((next) =>
+        updateParams((previous) => ({ ...previous, ...next })),
+      );
+    }, []);
+    usePullRequestEnvironmentFallback(params);
+    return <span>{`${params.environmentId}/${params.projectId}`}</span>;
+  }
+  return {
+    render() {
+      act(() => root.render(<Probe />));
+    },
+    get target() {
+      return container.textContent;
+    },
+    [Symbol.dispose]() {
+      act(() => root.unmount());
+    },
+  };
+}
+
+it.each(["available", "connecting", "reconnecting"] as const)(
+  "keeps the requested %s target when another copy connects first",
+  (phase) => {
+    using screen = setup();
+    mocks.environments = [environment("requested", phase), environment("copy", "connected")];
+    screen.render();
+    expect(screen.target).toBe("requested/original");
+    expect(mocks.navigation.setParams).not.toHaveBeenCalled();
+
+    mocks.environments = [environment("requested", "connected"), environment("copy", "connected")];
+    screen.render();
+    expect(screen.target).toBe("requested/original");
+    expect(mocks.navigation.setParams).not.toHaveBeenCalled();
+  },
+);
+
+it("waits for the catalog before treating the requested target as missing", () => {
+  using screen = setup();
+  mocks.isReady = false;
+  mocks.environments = [environment("copy", "connected")];
+  screen.render();
+  expect(screen.target).toBe("requested/original");
+  expect(mocks.navigation.setParams).not.toHaveBeenCalled();
+
+  mocks.isReady = true;
+  mocks.environments = [environment("requested", "available"), environment("copy", "connected")];
+  screen.render();
+  expect(screen.target).toBe("requested/original");
+  expect(mocks.navigation.setParams).not.toHaveBeenCalled();
+});
+
+it.each(["missing", "disabled", "offline", "error", "unsupported"] as const)(
+  "falls back to a connected copy when the requested target is %s",
+  (state) => {
+    using screen = setup();
+    mocks.environments = [
+      ...(state === "missing"
+        ? []
+        : [
+            environment(
+              "requested",
+              state === "disabled" ? "available" : state,
+              state !== "disabled",
+            ),
+          ]),
+      environment("copy", "connected"),
+    ];
+    screen.render();
+    expect(screen.target).toBe("copy/copy-project");
+    expect(mocks.navigation.setParams).toHaveBeenCalledTimes(1);
+  },
+);

apps/mobile/src/features/pull-requests/usePullRequestEnvironmentFallback.ts

@@ -2,7 +2,7 @@ import { useNavigation } from "@react-navigation/native";
 import { useEffect, useMemo } from "react";
 
 import { useProjects } from "../../state/entities";
-import { useWorkspaceEnvironments } from "../../state/workspace";
+import { useConnectionsReady, useWorkspaceEnvironments } from "../../state/workspace";
 import {
   pullRequestFallbackEnvironment,
   type PullRequestEnvironmentTarget,
@@ -11,13 +11,11 @@ import {
 export function usePullRequestEnvironmentFallback(params: PullRequestEnvironmentTarget) {
   const navigation = useNavigation();
   const projects = useProjects();
-  const connected = useWorkspaceEnvironments()
-    .filter((environment) => environment.connectionState === "connected")
-    .map((environment) => String(environment.environmentId))
-    .join("\n");
+  const isReady = useConnectionsReady();
+  const environments = useWorkspaceEnvironments();
   const fallback = useMemo(
-    () => pullRequestFallbackEnvironment(params, projects, new Set(connected.split("\n"))),
-    [params, projects, connected],
+    () => (isReady ? pullRequestFallbackEnvironment(params, projects, environments) : null),
+    [params, projects, environments, isReady],
   );
   useEffect(() => {
     if (fallback) navigation.setParams(fallback);

apps/mobile/vite.config.ts

@@ -2,6 +2,7 @@ import { defineConfig } from "vite-plus";
 import "vite-plus/test/config";
 
 const reactTests = [
+  "src/features/pull-requests/usePullRequestEnvironmentFallback.test.tsx",
   "src/components/ui/Dialog.android.test.tsx",
   "src/features/settings/SettingsServerControlsRouteScreen.test.tsx",
   "src/features/settings/components/BranchNamingSettings.test.tsx",