fix(web): show live progress while adding an environment

[f4llenz]

What Changed

Submitting the Add Environment dialog now replaces the button with a status panel: a spinner, the host being contacted, an elapsed m:ss counter, and a one-line description of what is happening. After 8 seconds the description switches to a mode-specific hint. SSH explains that first-time setup installs T3 Code on the remote machine and can take a few minutes. Remote link suggests checking that the host is reachable. Success closes the dialog with the existing toast and failure shows the existing error block, as before.

The boolean adding flag became a nullable record of mode, host, and start time, and the copy plus clock math live in a pure describeAddEnvironmentProgress helper in ConnectionsSettings.logic.ts with tests. A pasted pairing URL shows only its host in the panel. The elapsed counter sits outside the live region so screen readers hear the title and hint but not every tick.

Why

Adding an environment only flipped the button label to "Adding…" and disabled the inputs. SSH provisioning can take minutes on a fresh host while it installs and starts the remote server, and remote link waits up to 10 seconds per request on an unreachable host. Users read the silent dialog as frozen. The 8 second threshold sits under the 10 second remote request timeout so the hint lands before a dead host errors out.

Verification

• 17 focused tests in ConnectionsSettings.logic.test.ts pass, covering elapsed formatting, the hint threshold edge for both modes, host interpolation, and pairing URL reduction.
• Web typecheck passes. Scoped lint reports only the pre-existing memoization warning elsewhere in the component.
• Browser verified on web against base bc8584b: an unreachable host shows the panel, the hint switch, then the timeout error; a real pairing against a LAN T3 server completes and closes the dialog. Checked in dark and light themes.
• Web and desktop share this dialog. SSH mode is desktop only and was not exercised in a real desktop run. Mobile has its own add flow and is unchanged.

UI Changes

Same unreachable host, captured a few seconds after submit.

Before	After

Before. Unreachable host, 14 seconds of "Adding…" until the timeout error.

before.mp4

After. Same host. The panel appears on submit, the hint switches at 8 seconds, then the timeout error replaces it.

after.mp4

After, real pairing. A reachable LAN server completes in about 2 seconds and the dialog closes with the existing toast.

after-success.mp4

Checklist

• This PR is small and focused
• I explained what changed and why
• I included before/after screenshots for any UI changes
• I included a video for animation/interaction changes

Claude Fable 5.1 in T3 Code via the Claude Code harness.

---

Note

Low Risk
UI-only changes to the add-environment dialog and pure helpers; connection behavior and success/error handling are unchanged aside from when progress UI appears.

Overview
The Add environment dialog no longer leaves users on a disabled Adding… button during long SSH or remote pairing waits. Submitting now swaps the action for a live status panel with a spinner, host-specific title, an m:ss elapsed counter, and mode-specific guidance that switches to a slow-operation hint after 8 seconds (before the ~10s remote timeout).

In-progress state moves from a boolean to nullable AddEnvironmentProgress (remote vs SSH, display host, start time). Copy and timing live in describeAddEnvironmentProgress and displayPairingHost in ConnectionsSettings.logic.ts, with unit tests. Remote pairing validates input before starting the clock; SSH (manual and discovered host) keeps one timer across alias resolution and connect. The elapsed time is aria-hidden so screen readers get title and detail without every tick.

^{Reviewed by Cursor Bugbot for commit 8d5b0f8. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Show live progress panel while adding an environment in ConnectionsSettings

• Replaces the boolean add-in-progress state with nullable AddEnvironmentProgress that tracks connection mode, display host, and start timestamp
• Adds AddEnvironmentProgressPanel, a memoized component that refreshes once per second and renders a spinner, host-specific status, mode-specific guidance, and elapsed time
• Adds describeAddEnvironmentProgress in ConnectionsSettings.logic.ts to format elapsed time and switch to a slow-operation hint after 8 seconds (ADD_ENVIRONMENT_SLOW_HINT_MS)
• Adds displayPairingHost to extract only the server host and port from pairing URLs or bare host inputs, stripping scheme, path, and token
• Remote add now validates input before starting progress; SSH flows (manual and discovered-host) show one continuous timer across alias resolution and connection
• Risk: handleAddSavedBackend removed the early boolean busy-state assignment, so any code relying on the old adding flag being set before validation must use the new progress-state check instead

^{Macroscope summarized a81d807.}

[macroscopeapp]

Approvability

Verdict: Approved at 0999931

Macroscope's review found this PR approvable — This is a focused settings UX improvement that adds a tested progress panel while preserving the existing remote-pairing and SSH connection flows. Its production impact is limited to rendering status text and a once-per-second timer during an already-existing operation.

^{You can add or adjust custom eligibility rules. Learn more.}

[cursor]

Cursor Bugbot has reviewed your changes using default effort and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 646d5b0. Configure here.}

Dismissing prior approval to re-evaluate 0999931