fix(web): Tailscale HTTPS no longer says "Start Tailscale" while it runs

apps/web/src/components/settings/ConnectionsSettings.logic.test.ts

@@ -1,7 +1,9 @@
 import type { DesktopWslState } from "@t3tools/contracts";
+import { createAdvertisedEndpoint } from "@t3tools/shared/advertisedEndpoint";
 import { describe, expect, it, vi } from "vite-plus/test";
 import {
   applyWslEnableSelection,
+  missingTailscaleEndpointDescription,
   selectQrEndpointOption,
   togglePairingScopeSelection,
 } from "./ConnectionsSettings.logic";
@@ -123,3 +125,35 @@ describe("selectQrEndpointOption", () => {
     );
   });
 });
+
+describe("missingTailscaleEndpointDescription", () => {
+  const networkAccessible = { mode: "network-accessible", tailscaleServeEnabled: false } as const;
+  const tailscaleIp = createAdvertisedEndpoint({
+    id: "tailscale-ip:http://100.84.12.7:4780",
+    label: "Tailscale IP",
+    provider: { id: "tailscale", label: "Tailscale", kind: "private-network", isAddon: true },
+    httpBaseUrl: "http://100.84.12.7:4780",
+    reachability: "private-network",
+    source: "desktop-addon",
+  });
+
+  it("does not ask to start Tailscale when its adapter is up but MagicDNS could not be read", () => {
+    expect(missingTailscaleEndpointDescription(networkAccessible, [tailscaleIp])).toBe(
+      "Tailscale is running, but its MagicDNS name could not be read. Make sure the tailscale command is installed and MagicDNS is on.",
+    );
+  });
+
+  it("keeps detection-off guidance when Network access is off, even with a cached IP", () => {
+    expect(
+      missingTailscaleEndpointDescription({ mode: "local-only", tailscaleServeEnabled: false }, [
+        tailscaleIp,
+      ]),
+    ).toBe("Turn on Network access to detect Tailscale.");
+  });
+
+  it("asks to start Tailscale when no Tailscale address is present", () => {
+    expect(missingTailscaleEndpointDescription(networkAccessible, [])).toBe(
+      "Start Tailscale to set up HTTPS access through MagicDNS.",
+    );
+  });
+});

apps/web/src/components/settings/ConnectionsSettings.logic.ts

@@ -61,9 +61,13 @@ export function isQrShareableEndpoint(endpoint: AdvertisedEndpoint): boolean {
  * means unchecked. */
 export function missingTailscaleEndpointDescription(
   state: Pick<DesktopServerExposureState, "mode" | "tailscaleServeEnabled"> | null,
+  endpoints: ReadonlyArray<AdvertisedEndpoint>,
 ): string {
-  return state && state.mode !== "network-accessible" && !state.tailscaleServeEnabled
-    ? "Turn on Network access to detect Tailscale."
+  if (state && state.mode !== "network-accessible" && !state.tailscaleServeEnabled) {
+    return "Turn on Network access to detect Tailscale.";
+  }
+  return endpoints.some((endpoint) => endpoint.id.startsWith("tailscale-ip:"))
+    ? "Tailscale is running, but its MagicDNS name could not be read. Make sure the tailscale command is installed and MagicDNS is on."
     : "Start Tailscale to set up HTTPS access through MagicDNS.";
 }
 

apps/web/src/components/settings/ConnectionsSettings.tsx

@@ -911,7 +911,10 @@ export function ConnectionsSettings() {
           ? tailscaleHttpsEndpoint.status === "available"
             ? tailscaleHttpsEndpoint.httpBaseUrl
             : "Use Tailscale Serve to expose this backend through a MagicDNS HTTPS URL."
-          : missingTailscaleEndpointDescription(desktopServerExposureState)
+          : missingTailscaleEndpointDescription(
+              desktopServerExposureState,
+              desktopAdvertisedEndpoints,
+            )
       }
       control={
         tailscaleHttpsEndpoint ? (