# Files changed · PR \#22728 · pingdotgg/t3code [View on GitCafe](https://git.cafe/pingdotgg/t3code/pull/22728/diffs) Repository: [pingdotgg/t3code](https://git.cafe/pingdotgg/t3code) Visibility: public [refactor\(web\): ChatView's draft machine routing lives in useDraftEnvironmentRouting](https://git.cafe/pingdotgg/t3code/pull/22728.md) Version: 6 Head commit: 7483af891cd7a34bc9f3c661a49d3af59b42574b Base commit: 08ca07f2b1229c4de2131e514c73b38577e9f3eb Comparison base: 08ca07f2b1229c4de2131e514c73b38577e9f3eb Showing up to 20 entries from this revision. If the pull request changes, reopen the first page before continuing. ## apps/web/src/components/ChatView.tsx Status: modified; +22; −183 ```diff @@ -23,9 +23,7 @@ recallCheckoutIsRepo, rememberCheckoutIsRepo, } from "./ChatView.logic"; -import { useLoadBalancedEnvironment } from "../hooks/useLoadBalancedEnvironment"; import { useLogicalProjectEnvironments } from "../hooks/useLogicalProjectEnvironments"; -import { useScratchProject } from "../hooks/useScratchProject"; import { useStableCallback } from "../hooks/useStableCallback"; import { useProjectScriptEditing } from "./chat/useProjectScriptEditing"; import { RightPanelSurfaceContent } from "./chat/RightPanelSurfaceContent"; @@ -72,7 +70,6 @@ type RunId, type RunAttemptId, ProviderInteractionMode, - resolveProjectProviderInstanceEnabled, RuntimeMode, } from "@t3tools/contracts"; import { deriveThreadTitleSeed } from "@t3tools/client-runtime/operations"; @@ -336,7 +333,6 @@ resolveThreadDetailRef, useEnvironmentSupportsServerBrowser, useProject, - useProjects, useThreadProjection, useThreadStatus, useThreadHistory, @@ -486,6 +482,7 @@ import { ThreadVisitWatermark } from "./chat/ThreadVisitWatermark"; import { ChatTerminalDrawers } from "./chat/ChatTerminalDrawers"; import { ChatRightPanel } from "./chat/ChatRightPanel"; +import { useDraftEnvironmentRouting } from "./chat/useDraftEnvironmentRouting"; import { backgroundWorkBannerItem, branchMismatchBannerItem, @@ -1479,7 +1476,6 @@ useRightPanelStore.getState().reconcileFileSurfaces(activeThreadRef, activeProject !== null); }, [activeEnvironmentBootstrapComplete, activeProject, activeThreadRef]); - const allProjects = useProjects(); const primaryEnvironmentId = primaryEnvironment?.environmentId ?? null; useEffect(() => { if (!activeThreadRef || !activeProjectRef) return; @@ -1501,7 +1497,6 @@ connection: activeEnvironment.connection, }; })() as EnvironmentUnavailableState | null; - const { openScratchProject } = useScratchProject(); const activeProjectIsScratch = activeProject !== null && isScratchProject( @@ -2475,189 +2470,33 @@ }; const onToggleDiffStable = useStableCallback(onToggleDiff); - const needsLoadBalancing = automaticEnvironment && !draftThread?.loadBalancedEnvironmentId; - const loadBalancingCandidates = needsLoadBalancing - ? logicalProjectEnvironments - .filter((candidate) => { - const environment = environmentById.get(candidate.environmentId); - return ( - environment?.connection.phase === "connected" && - (loadBalancingSettings.loadBalancingWeights[candidate.environmentId] ?? 50) > 0 && - referencedThreadContexts.every( - (record) => record.environmentId === candidate.environmentId, - ) && - providersByEnvironment - .get(candidate.environmentId) - ?.some( - (provider) => - (activeProviderInstanceId === null || - provider.instanceId === activeProviderInstanceId) && - provider.driver === selectedProvider && - (environment.serverConfig?.settings - ? resolveProjectProviderInstanceEnabled( - environment.serverConfig.settings, - candidate.projectId, - provider.instanceId, - ) - : provider.enabled) && - provider.installed && - provider.status !== "error" && - provider.auth.status !== "unauthenticated" && - provider.availability !== "unavailable", - ) - ); - }) - .map((candidate) => candidate.environmentId) - : []; - const loadBalancing = useLoadBalancedEnvironment( + const { - loadBalancingCandidates, - loadBalancingSettings.loadBalancingWeights, - ); - useEffect(() => { - if (!needsLoadBalancing || loadBalancing.pending || !draftId || sendInFlightRef.current) return; - const target = logicalProjectEnvironments.find( - (environment) => environment.environmentId === loadBalancing.environmentId, - ); - if (!target?.projectId) return; - setDraftThreadContext(draftId, { - projectRef: scopeProjectRef(target.environmentId, target.projectId), - environmentSelection: "auto", - loadBalancedEnvironmentId: target.environmentId, - }); - }, [ needsLoadBalancing, + loadBalancing, - loadBalancing.pending, + onAutoEnvironmentStable, - loadBalancing.environmentId, + autoEnvironmentLabel, + isEnvironmentChanging, + readPendingEnvironmentChange, + onEnvironmentChangeStable, + } = useDraftEnvironmentRouting({ draftId, + draftThread, + envLocked, + automaticEnvironment, logicalProjectEnvironments, + environmentById, + providersByEnvironment, + loadBalancingSettings, + referencedThreadContexts, + activeProviderInstanceId, + selectedProvider, + composerHasAttachments, + activeProjectKey, + activeProjectIsScratch, + projectGroupingSettings, sendInFlightRef, - setDraftThreadContext, - ]); - const onAutoEnvironment = () => { - if (envLocked || !draftId) return; - if (composerHasAttachments) { - toastManager.add({ - type: "warning", - id: "load-balancing-attachments", - title: "Keep attachments on this machine", - description: - "Remove attachments before choosing automatic routing, then attach them on the selected machine.", - }); - return; - } - loadBalancing.refresh( - logicalProjectEnvironments.map((environment) => environment.environmentId), - ); - setDraftThreadContext(draftId, { - environmentSelection: "auto", - loadBalancedEnvironmentId: null, - branch: null, - worktreePath: null, - }); - }; - const onAutoEnvironmentStable = useStableCallback(onAutoEnvironment); - const autoEnvironmentLabel = automaticEnvironment - ? draftThread?.loadBalancedEnvironmentId - ? "Auto balance" - : loadBalancing.pending - ? "Checking machines…" - : loadBalancing.failed - ? "Auto balance unavailable" - : "Auto balance" - : undefined; - - // A change in flight belongs to the draft and project it started on. - const environmentChangeScope = `${draftId ?? ""}:${activeProjectKey ?? ""}`; - const environmentChangeRef = useRef<{ - readonly environmentId: EnvironmentId; - readonly scope: string; - } | null>(null); - const environmentChangeScopeRef = useRef(""); - useLayoutEffect(() => { - environmentChangeScopeRef.current = environmentChangeScope; }); - // Leaving the scope, or unmounting, abandons a change still in flight. - useLayoutEffect( - () => () => { - if (environmentChangeRef.current?.scope === environmentChangeScope) { - environmentChangeRef.current = null; - } - }, - [environmentChangeScope], - ); - const readPendingEnvironmentChange = () => { - const pending = environmentChangeRef.current; - return pending !== null && pending.scope === environmentChangeScopeRef.current ? pending : null; - }; - // The busy state belongs to the request that set it, so an older request settling late - // (abandoned, or superseded by a newer switch) can never clear a newer one's. - const [busyEnvironmentChange, setBusyEnvironmentChange] = useState<{ - readonly environmentId: EnvironmentId; - readonly scope: string; - } | null>(null); - const isEnvironmentChanging = busyEnvironmentChange?.scope === environmentChangeScope; - const onEnvironmentChange = (nextEnvironmentId: EnvironmentId) => { - if (envLocked || !draftId || sendInFlightRef.current) return; - const originalDraft = getDraftSession(draftId); - if (!originalDraft || originalDraft.promotedTo) return; - const target = logicalProjectEnvironments.find( - (env) => env.environmentId === nextEnvironmentId, - ); - if (!target) return; - const request = { environmentId: target.environmentId, scope: environmentChangeScope }; - environmentChangeRef.current = request; - setBusyEnvironmentChange(null); - const retarget = (project: (typeof allProjects)[number]) => { - const currentDraft = getDraftSession(draftId); - if ( - environmentChangeRef.current !== request || - environmentChangeScopeRef.current !== request.scope || - sendInFlightRef.current || - !currentDraft || - currentDraft.promotedTo || - currentDraft.environmentId !== originalDraft.environmentId || - currentDraft.projectId !== originalDraft.projectId - ) - return; - const projectRef = scopeProjectRef(target.environmentId, project.id); - if (activeProjectIsScratch) { - setLogicalProjectDraftThreadId( - deriveLogicalProjectKeyFromSettings(project, projectGroupingSettings), - projectRef, - draftId, - { environmentSelection: "manual", loadBalancedEnvironmentId: null }, - ); - } else { - setDraftThreadContext(draftId, { - projectRef, - environmentSelection: "manual", - loadBalancedEnvironmentId: null, - }); - } - }; - const finish = () => { - if (environmentChangeRef.current === request) environmentChangeRef.current = null; - setBusyEnvironmentChange((busy) => (busy === request ? null : busy)); - }; - if (target.projectId !== null) { - const project = allProjects.find( - (project) => - project.environmentId === target.environmentId && project.id === target.projectId, - ); - if (project) retarget(project); - finish(); - return; - } - setBusyEnvironmentChange(request); - void openScratchProject(target.environmentId, "Could not switch machine") - .then((project) => { - if (project) retarget(project); - }) - .finally(finish); - }; - const onEnvironmentChangeStable = useStableCallback(onEnvironmentChange); - const activeTerminalGroup = terminalUiState.terminalGroups.find( (group) => group.id === terminalUiState.activeTerminalGroupId, ``` ## apps/web/src/components/chat/useDraftEnvironmentRouting.ts Status: added; +268; −0 ```diff @@ -1,0 +1,268 @@ +import { useLoadBalancedEnvironment } from "../../hooks/useLoadBalancedEnvironment"; +import { useLogicalProjectEnvironments } from "../../hooks/useLogicalProjectEnvironments"; +import { useScratchProject } from "../../hooks/useScratchProject"; +import { useStableCallback } from "../../hooks/useStableCallback"; +import { + type EnvironmentId, + type ProviderDriverKind, + ProviderInstanceId, + resolveProjectProviderInstanceEnabled, + type ThreadContextRecord, +} from "@t3tools/contracts"; +import { scopeProjectRef } from "@t3tools/client-runtime/environment"; +import { useEffect, useLayoutEffect, useRef, useState } from "react"; +import { toastManager } from "../ui/toast"; +import { + deriveLogicalProjectKeyFromSettings, + selectProjectGroupingSettings, +} from "../../logicalProject"; +import { useComposerDraftStore, DraftId } from "../../composerDraftStore"; +import { type EnvironmentPresentation, useEnvironmentProviders } from "../../state/environments"; +import { useProjects } from "../../state/entities"; +import type { DraftSessionState } from "../../composerDraftStore"; + +interface DraftEnvironmentRoutingInput { + readonly draftId: DraftId | null; + readonly draftThread: DraftSessionState | null; + readonly envLocked: boolean; + readonly automaticEnvironment: boolean; + readonly logicalProjectEnvironments: ReturnType; + readonly environmentById: ReadonlyMap; + readonly providersByEnvironment: ReturnType; + readonly loadBalancingSettings: { + readonly loadBalancingWeights: Readonly>; + }; + readonly referencedThreadContexts: ReadonlyArray; + readonly activeProviderInstanceId: ProviderInstanceId | null; + readonly selectedProvider: ProviderDriverKind; + readonly composerHasAttachments: boolean; + readonly activeProjectKey: string | null; + readonly activeProjectIsScratch: boolean; + readonly projectGroupingSettings: ReturnType; + readonly sendInFlightRef: { readonly current: boolean }; +} + +/** + * Which machine an unsent draft runs on: automatic load balancing across the + * project's machines, or a manual switch, which may first open a scratch + * project on the target machine. + */ +export function useDraftEnvironmentRouting(input: DraftEnvironmentRoutingInput) { + const { + draftId, + draftThread, + envLocked, + automaticEnvironment, + logicalProjectEnvironments, + environmentById, + providersByEnvironment, + loadBalancingSettings, + referencedThreadContexts, + activeProviderInstanceId, + selectedProvider, + composerHasAttachments, + activeProjectKey, + activeProjectIsScratch, + projectGroupingSettings, + sendInFlightRef, + } = input; + const setDraftThreadContext = useComposerDraftStore((store) => store.setDraftThreadContext); + const getDraftSession = useComposerDraftStore((store) => store.getDraftSession); + const setLogicalProjectDraftThreadId = useComposerDraftStore( + (store) => store.setLogicalProjectDraftThreadId, + ); + const allProjects = useProjects(); + const { openScratchProject } = useScratchProject(); + const needsLoadBalancing = automaticEnvironment && !draftThread?.loadBalancedEnvironmentId; + const loadBalancingCandidates = needsLoadBalancing + ? logicalProjectEnvironments + .filter((candidate) => { + const environment = environmentById.get(candidate.environmentId); + return ( + environment?.connection.phase === "connected" && + (loadBalancingSettings.loadBalancingWeights[candidate.environmentId] ?? 50) > 0 && + referencedThreadContexts.every( + (record) => record.environmentId === candidate.environmentId, + ) && + providersByEnvironment + .get(candidate.environmentId) + ?.some( + (provider) => + (activeProviderInstanceId === null || + provider.instanceId === activeProviderInstanceId) && + provider.driver === selectedProvider && + (environment.serverConfig?.settings + ? resolveProjectProviderInstanceEnabled( + environment.serverConfig.settings, + candidate.projectId, + provider.instanceId, + ) + : provider.enabled) && + provider.installed && + provider.status !== "error" && + provider.auth.status !== "unauthenticated" && + provider.availability !== "unavailable", + ) + ); + }) + .map((candidate) => candidate.environmentId) + : []; + const loadBalancing = useLoadBalancedEnvironment( + loadBalancingCandidates, + loadBalancingSettings.loadBalancingWeights, + ); + useEffect(() => { + if (!needsLoadBalancing || loadBalancing.pending || !draftId || sendInFlightRef.current) return; + const target = logicalProjectEnvironments.find( + (environment) => environment.environmentId === loadBalancing.environmentId, + ); + if (!target?.projectId) return; + setDraftThreadContext(draftId, { + projectRef: scopeProjectRef(target.environmentId, target.projectId), + environmentSelection: "auto", + loadBalancedEnvironmentId: target.environmentId, + }); + }, [ + needsLoadBalancing, + loadBalancing.pending, + loadBalancing.environmentId, + draftId, + logicalProjectEnvironments, + sendInFlightRef, + setDraftThreadContext, + ]); + const onAutoEnvironment = () => { + if (envLocked || !draftId) return; + if (composerHasAttachments) { + toastManager.add({ + type: "warning", + id: "load-balancing-attachments", + title: "Keep attachments on this machine", + description: + "Remove attachments before choosing automatic routing, then attach them on the selected machine.", + }); + return; + } + loadBalancing.refresh( + logicalProjectEnvironments.map((environment) => environment.environmentId), + ); + setDraftThreadContext(draftId, { + environmentSelection: "auto", + loadBalancedEnvironmentId: null, + branch: null, + worktreePath: null, + }); + }; + const onAutoEnvironmentStable = useStableCallback(onAutoEnvironment); + const autoEnvironmentLabel = automaticEnvironment + ? draftThread?.loadBalancedEnvironmentId + ? "Auto balance" + : loadBalancing.pending + ? "Checking machines…" + : loadBalancing.failed + ? "Auto balance unavailable" + : "Auto balance" + : undefined; + + // A change in flight belongs to the draft and project it started on. + const environmentChangeScope = `${draftId ?? ""}:${activeProjectKey ?? ""}`; + const environmentChangeRef = useRef<{ + readonly environmentId: EnvironmentId; + readonly scope: string; + } | null>(null); + const environmentChangeScopeRef = useRef(""); + useLayoutEffect(() => { + environmentChangeScopeRef.current = environmentChangeScope; + }); + // Leaving the scope, or unmounting, abandons a change still in flight. + useLayoutEffect( + () => () => { + if (environmentChangeRef.current?.scope === environmentChangeScope) { + environmentChangeRef.current = null; + } + }, + [environmentChangeScope], + ); + const readPendingEnvironmentChange = () => { + const pending = environmentChangeRef.current; + return pending !== null && pending.scope === environmentChangeScopeRef.current ? pending : null; + }; + // The busy state belongs to the request that set it, so an older request settling late + // (abandoned, or superseded by a newer switch) can never clear a newer one's. + const [busyEnvironmentChange, setBusyEnvironmentChange] = useState<{ + readonly environmentId: EnvironmentId; + readonly scope: string; + } | null>(null); + const isEnvironmentChanging = busyEnvironmentChange?.scope === environmentChangeScope; + + const onEnvironmentChange = (nextEnvironmentId: EnvironmentId) => { + if (envLocked || !draftId || sendInFlightRef.current) return; + const originalDraft = getDraftSession(draftId); + if (!originalDraft || originalDraft.promotedTo) return; + const target = logicalProjectEnvironments.find( + (env) => env.environmentId === nextEnvironmentId, + ); + if (!target) return; + const request = { environmentId: target.environmentId, scope: environmentChangeScope }; + environmentChangeRef.current = request; + setBusyEnvironmentChange(null); + const retarget = (project: (typeof allProjects)[number]) => { + const currentDraft = getDraftSession(draftId); + if ( + environmentChangeRef.current !== request || + environmentChangeScopeRef.current !== request.scope || + sendInFlightRef.current || + !currentDraft || + currentDraft.promotedTo || + currentDraft.environmentId !== originalDraft.environmentId || + currentDraft.projectId !== originalDraft.projectId + ) + return; + const projectRef = scopeProjectRef(target.environmentId, project.id); + if (activeProjectIsScratch) { + setLogicalProjectDraftThreadId( + deriveLogicalProjectKeyFromSettings(project, projectGroupingSettings), + projectRef, + draftId, + { environmentSelection: "manual", loadBalancedEnvironmentId: null }, + ); + } else { + setDraftThreadContext(draftId, { + projectRef, + environmentSelection: "manual", + loadBalancedEnvironmentId: null, + }); + } + }; + const finish = () => { + if (environmentChangeRef.current === request) environmentChangeRef.current = null; + setBusyEnvironmentChange((busy) => (busy === request ? null : busy)); + }; + if (target.projectId !== null) { + const project = allProjects.find( + (project) => + project.environmentId === target.environmentId && project.id === target.projectId, + ); + if (project) retarget(project); + finish(); + return; + } + setBusyEnvironmentChange(request); + void openScratchProject(target.environmentId, "Could not switch machine") + .then((project) => { + if (project) retarget(project); + }) + .finally(finish); + }; + const onEnvironmentChangeStable = useStableCallback(onEnvironmentChange); + + return { + needsLoadBalancing, + loadBalancing, + onAutoEnvironmentStable, + autoEnvironmentLabel, + isEnvironmentChanging, + readPendingEnvironmentChange, + onEnvironmentChangeStable, + }; +} ```