diff --git a/apps/web/src/components/SidebarConnor.tsx b/apps/web/src/components/SidebarConnor.tsx index 0696e54cca46..cacf60cc41c6 100644 --- a/apps/web/src/components/SidebarConnor.tsx +++ b/apps/web/src/components/SidebarConnor.tsx @@ -26,7 +26,7 @@ import { settlePromise, squashAtomCommandFailure, } from "@t3tools/client-runtime/state/runtime"; -import type { ScopedThreadRef } from "@t3tools/contracts"; +import type { EnvironmentId, ScopedThreadRef } from "@t3tools/contracts"; import type { SidebarProjectSortOrder, SidebarThreadSortOrder } from "@t3tools/contracts/settings"; import { ArrowUpDownIcon, @@ -34,6 +34,7 @@ import { CircleAlertIcon, CircleDashedIcon, CircleHelpIcon, + CloudIcon, EyeOffIcon, FolderPlusIcon, GitBranchIcon, @@ -509,10 +510,34 @@ function WorktreeName(props: { ); } +/** Shown only for groups living on a non-primary machine; the local checkout + is the unmarked default, so it stays glyph-free. */ +function RemoteEnvironmentGlyph({ label }: { label: string }) { + return ( + + + } + > + + + {label} + + ); +} + interface GroupSectionProps { group: ConnorGroup; /** Where git status is read: the worktree, or the project root for the root checkout. */ gitCwd: string | null; + /** Machine name when the group is remote; null for the local checkout. */ + remoteEnvironmentLabel: string | null; /** Rows in display order: the thread-sort setting's ordering. */ displayThreads: readonly EnvironmentThreadShell[]; name: string; @@ -650,22 +675,21 @@ function StackGroupSection(props: GroupSectionProps) {
{group.branch ? ( - <> - - {group.branch} - - ) : ( - - {group.kind === "local" ? "local checkout" : "worktree"} - - )} + + ) : null} + {props.remoteEnvironmentLabel ? ( + + ) : null} + + {group.branch ?? (group.kind === "local" ? "local checkout" : "worktree")} + {group.threads.length === 1 ? "1 thread" : `${group.threads.length} threads`} @@ -994,6 +1018,15 @@ export default function SidebarConnor() { ), [environments], ); + // Anything not on the primary environment is "somewhere else": the card + // gets a machine glyph, the local checkout stays unmarked. + const resolveRemoteEnvironmentLabel = useCallback( + (environmentId: EnvironmentId): string | null => + primaryEnvironmentId === null || environmentId === primaryEnvironmentId + ? null + : (environmentLabelById.get(environmentId) ?? "Remote machine"), + [environmentLabelById, primaryEnvironmentId], + ); const orderedProjects = useMemo( () => orderItemsByPreferredIds({ @@ -2014,6 +2047,9 @@ export default function SidebarConnor() { projectCwdByKey.get(`${group.environmentId}:${group.projectId}`) ?? null } + remoteEnvironmentLabel={resolveRemoteEnvironmentLabel( + group.environmentId, + )} displayThreads={displayThreads} name={ group.kind === "local"