fix: remove stray whitespace in agents UI (#23110)

site/src/components/ai-elements/response.tsx

@@ -170,7 +170,7 @@ const createComponents = (
 		// Inline code only — fenced blocks are handled by the pre override.
 		code: ({ children }: MarkdownComponentProps) => (
 			<code className="rounded bg-surface-quaternary/25 px-1 py-0.5 font-mono text-content-primary">
-				{children}{" "}
+				{children}
 			</code>
 		),
 		// Fenced code blocks: extract language and content from the HAST

site/src/pages/AgentsPage/AgentChatInput.tsx

@@ -650,7 +650,7 @@ export const AgentChatInput = memo<AgentChatInputProps>(
 						disabled={isDisabled || isLoading}
 						rows={4}
 						autoFocus
-					/>{" "}
+					/>
 					<div className="flex items-center justify-between gap-2 px-2.5 pb-1.5">
 						<div className="flex min-w-0 items-center gap-2">
 							<ModelSelector
@@ -727,7 +727,7 @@ export const AgentChatInput = memo<AgentChatInputProps>(
 							)}
 							{contextUsage !== undefined && (
 								<ContextUsageIndicator usage={contextUsage} />
-							)}{" "}
+							)}
 							{isStreaming && onInterrupt && (
 								<Button
 									size="icon"

site/src/pages/AgentsPage/AgentDetail/ConversationTimeline.tsx

@@ -194,7 +194,6 @@ function renderBlockList({
 							key={`${keyPrefix}-file-reference-${index}`}
 							className="my-1 flex items-start gap-2 rounded-md border border-content-link/20 bg-content-link/5 px-2.5 py-1.5"
 						>
-							{" "}
 							<span className="shrink-0 text-xs font-medium text-content-link">
 								{block.fileName}:
 								{block.startLine === block.endLine

site/src/pages/AgentsPage/AgentDetailView.tsx

@@ -333,7 +333,7 @@ export const AgentDetailView: FC<AgentDetailViewProps> = ({
 					chatTitle={chatTitle}
 					desktopChatId={desktopChatId}
 				/>
-			</RightPanel>{" "}
+			</RightPanel>
 		</div>
 	);
 };
@@ -473,7 +473,7 @@ export const AgentDetailNotFoundView: FC<AgentDetailNotFoundViewProps> = ({
 			/>
 			<div className="flex flex-1 items-center justify-center text-content-secondary">
 				Chat not found
-			</div>{" "}
+			</div>
 		</div>
 	);
 };

site/src/pages/AgentsPage/AgentsSidebar.tsx

@@ -461,9 +461,9 @@ const ChatTreeNode = memo<ChatTreeNodeProps>(({ chat, isChildNode }) => {
 											</span>
 											<span className="text-git-deleted-bright">
 												&minus;{deletions}
-											</span>{" "}
+											</span>
 										</span>
-									)}{" "}
+									)}
 									<div
 										className={cn(
 											"min-w-0 overflow-hidden text-[13px] leading-4",
@@ -500,7 +500,6 @@ const ChatTreeNode = memo<ChatTreeNodeProps>(({ chat, isChildNode }) => {
 									</Button>
 								</DropdownMenuTrigger>
 								<DropdownMenuContent align="end">
-									{" "}
 									{chat.archived ? (
 										<DropdownMenuItem
 											disabled={isArchiving}
@@ -729,7 +728,7 @@ export const AgentsSidebar: FC<AgentsSidebarProps> = (props) => {
 							</Button>
 						)}
 					</div>
-				</div>{" "}
+				</div>
 				<Button
 					size="sm"
 					variant="subtle"
@@ -841,13 +840,12 @@ export const AgentsSidebar: FC<AgentsSidebarProps> = (props) => {
 								type="button"
 								className="flex min-w-0 flex-1 items-center gap-2 bg-transparent border-0 cursor-pointer px-3 py-3 text-left hover:bg-surface-tertiary/50 transition-colors"
 							>
-								{" "}
 								<Avatar
 									fallback={user.username}
 									src={user.avatar_url}
 									size="sm"
 									className="rounded-full"
-								/>{" "}
+								/>
 								<span className="truncate text-sm text-content-secondary">
 									{user.name || user.username}
 								</span>

site/src/pages/AgentsPage/ChatModelAdminPanel/ModelForm.tsx

@@ -244,7 +244,7 @@ export const ModelForm: FC<ModelFormProps> = ({
 				>
 					<ChevronLeftIcon className="h-4 w-4" />
 					Back
-				</button>{" "}
+				</button>
 				<h2 className="m-0 text-lg font-medium text-content-primary">
 					{isEditing ? "Edit Model" : "Add Model"}
 				</h2>
@@ -268,7 +268,7 @@ export const ModelForm: FC<ModelFormProps> = ({
 				</button>
 				<h2 className="m-0 text-lg font-medium text-content-primary">
 					Add Model
-				</h2>{" "}
+				</h2>
 				<hr className="my-4 border-0 border-t border-solid border-border" />
 				<div className="space-y-3">
 					{providerSelect}
@@ -318,7 +318,7 @@ export const ModelForm: FC<ModelFormProps> = ({
 							isEditing ? (editingModel?.model ?? "Model name") : "Model name"
 						}
 					/>
-				</div>{" "}
+				</div>
 			</div>
 			<hr className="my-4 border-0 border-t border-solid border-border" />
 
@@ -423,7 +423,7 @@ export const ModelForm: FC<ModelFormProps> = ({
 									<ChevronRightIcon className="h-4 w-4" />
 								)}
 								Pricing
-							</button>{" "}
+							</button>
 							{showPricing && (
 								<div className="mt-4 space-y-3">
 									<div>
@@ -458,7 +458,7 @@ export const ModelForm: FC<ModelFormProps> = ({
 									<ChevronRightIcon className="h-4 w-4" />
 								)}
 								Advanced
-							</button>{" "}
+							</button>
 							{showAdvanced && (
 								<div className="mt-4 space-y-5">
 									<div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
@@ -531,7 +531,7 @@ export const ModelForm: FC<ModelFormProps> = ({
 									onClick={() => void onDeleteModel(editingModel.id)}
 								>
 									{isDeleting && <Spinner className="h-4 w-4" loading />}
-									Delete model{" "}
+									Delete model
 								</Button>
 							</div>
 						</div>
@@ -557,14 +557,14 @@ export const ModelForm: FC<ModelFormProps> = ({
 								>
 									Cancel
 								</Button>
-							)}{" "}
+							)}
 							<Button
 								size="lg"
 								type="submit"
 								disabled={isSaving || !form.isValid || hasFieldErrors}
 							>
 								{isSaving && <Spinner className="h-4 w-4" loading />}{" "}
-								{isEditing ? "Save" : "Add model"}{" "}
+								{isEditing ? "Save" : "Add model"}
 							</Button>
 						</div>
 					)}

site/src/pages/AgentsPage/ChatModelAdminPanel/ModelsSection.tsx

@@ -136,7 +136,6 @@ export const ModelsSection: FC<ModelsSectionProps> = ({
 		<DropdownMenu>
 			<DropdownMenuTrigger asChild>
 				<Button size="sm" className="gap-1.5" aria-label="Add model">
-					{" "}
 					<PlusIcon className="h-4 w-4" />
 					Add
 					<ChevronDownIcon className="h-3.5 w-3.5 text-content-secondary" />
@@ -202,7 +201,6 @@ export const ModelsSection: FC<ModelsSectionProps> = ({
 								key={modelConfig.id}
 								className="flex items-center gap-3.5 px-3 py-3"
 							>
-								{" "}
 								{/* Star for default */}
 								<Tooltip>
 									<TooltipTrigger asChild>
@@ -273,7 +271,7 @@ export const ModelsSection: FC<ModelsSectionProps> = ({
 										</Badge>
 									)}
 									<ChevronRightIcon className="h-5 w-5 shrink-0 text-content-secondary" />
-								</button>{" "}
+								</button>
 							</div>
 						);
 					})}

site/src/pages/AgentsPage/ChatModelAdminPanel/ProviderForm.tsx

@@ -278,7 +278,7 @@ export const ProviderForm: FC<ProviderFormProps> = ({
 										{isProviderMutationPending && (
 											<Spinner className="h-4 w-4" loading />
 										)}
-										Delete provider{" "}
+										Delete provider
 									</Button>
 								</div>
 							</div>
@@ -302,9 +302,7 @@ export const ProviderForm: FC<ProviderFormProps> = ({
 									{isProviderMutationPending && (
 										<Spinner className="h-4 w-4" loading />
 									)}
-									{providerConfig
-										? "Save changes"
-										: "Create provider config"}{" "}
+									{providerConfig ? "Save changes" : "Create provider config"}
 								</Button>
 							</div>
 						)}

site/src/pages/AgentsPage/ChatModelAdminPanel/ProvidersSection.tsx

@@ -122,7 +122,7 @@ export const ProvidersSection: FC<ProvidersSectionProps> = ({
 						)}
 						<ChevronRightIcon className="h-5 w-5 shrink-0 text-content-secondary" />
 					</button>
-				))}{" "}
+				))}
 			</div>
 		</>
 	);

site/src/pages/AgentsPage/ConfigureAgentsDialog.tsx

@@ -533,11 +533,11 @@ export const ConfigureAgentsDialog: FC<ConfigureAgentsDialogProps> = ({
 								onSubmit={(event) => void handleSaveUserPrompt(event)}
 							>
 								<h3 className="m-0 text-[13px] font-semibold text-content-primary">
-									Personal Instructions{" "}
+									Personal Instructions
 								</h3>
 								<p className="!mt-0.5 m-0 text-xs text-content-secondary">
 									Applied to all your chats. Only visible to you.
-								</p>{" "}
+								</p>
 								<TextareaAutosize
 									className={textareaClassName}
 									placeholder="Additional behavior, style, and tone preferences"
@@ -555,7 +555,7 @@ export const ConfigureAgentsDialog: FC<ConfigureAgentsDialogProps> = ({
 										disabled={isDisabled || !userPromptDraft}
 									>
 										Clear
-									</Button>{" "}
+									</Button>
 									<Button
 										size="sm"
 										type="submit"
@@ -588,7 +588,7 @@ export const ConfigureAgentsDialog: FC<ConfigureAgentsDialogProps> = ({
 										<p className="!mt-0.5 m-0 text-xs text-content-secondary">
 											Applied to all chats for every user. When empty, the
 											built-in default is used.
-										</p>{" "}
+										</p>
 										<TextareaAutosize
 											className={textareaClassName}
 											placeholder="Additional behavior, style, and tone preferences for all users"
@@ -606,7 +606,7 @@ export const ConfigureAgentsDialog: FC<ConfigureAgentsDialogProps> = ({
 												disabled={isDisabled || !systemPromptDraft}
 											>
 												Clear
-											</Button>{" "}
+											</Button>
 											<Button
 												size="sm"
 												type="submit"

site/src/pages/AgentsPage/DiffViewer.tsx

@@ -679,7 +679,7 @@ export const DiffViewer: FC<DiffViewerProps> = ({
 			ref={containerRef}
 			className="flex h-full min-w-0 flex-col overflow-hidden"
 		>
-			{/* Diff contents */}{" "}
+			{/* Diff contents */}
 			{sortedFiles.length === 0 ? (
 				<div className="flex flex-1 items-center justify-center p-6 text-center text-xs text-content-secondary">
 					{emptyMessage}

site/src/pages/AgentsPage/RemoteDiffPanel.tsx

@@ -449,9 +449,7 @@ export const RemoteDiffPanel: FC<RemoteDiffPanelProps> = ({
 								{headBranch && baseBranch && (
 									<ArrowLeftIcon className="size-3 shrink-0 opacity-50" />
 								)}
-								{headBranch && (
-									<span className="truncate"> {headBranch}</span>
-								)}{" "}
+								{headBranch && <span className="truncate"> {headBranch}</span>}
 							</>
 						) : parsedPr ? (
 							<span className="truncate">
@@ -460,7 +458,7 @@ export const RemoteDiffPanel: FC<RemoteDiffPanelProps> = ({
 						) : (
 							<span className="truncate">{pullRequestUrl}</span>
 						)}
-					</div>{" "}
+					</div>
 					<div className="ml-auto flex shrink-0 items-center gap-1.5">
 						<PullRequestStateBadge state={prState} draft={prDraft} />
 						{diffStatusQuery.data?.additions ||
@@ -481,7 +479,7 @@ export const RemoteDiffPanel: FC<RemoteDiffPanelProps> = ({
 						</a>
 					</div>
 				</div>
-			)}{" "}
+			)}
 			<DiffViewer
 				parsedFiles={parsedFiles}
 				isExpanded={isExpanded}