From edcee32ab92d0e5e81f45522c93386799eb86038 Mon Sep 17 00:00:00 2001
From: Jake Howell <jacob@coder.com>
Date: Fri, 6 Feb 2026 21:10:27 +1100
Subject: [PATCH] fix: always show `View Task` for Tasks workspaces (#21970)

Closes [`internal#1292`](https://github.com/coder/internal/issues/1292)

This pull-request reduces our nesting of the `View Task` button. Its
easier to jump to tasks now as we don't have to wait for the app status
to exist.
---
 site/src/modules/resources/AgentRow.tsx      | 25 ++++++++++++++------
 site/src/pages/WorkspacePage/AppStatuses.tsx | 13 ----------
 2 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/site/src/modules/resources/AgentRow.tsx b/site/src/modules/resources/AgentRow.tsx
index 9838e7ca83..7ba64fa485 100644
--- a/site/src/modules/resources/AgentRow.tsx
+++ b/site/src/modules/resources/AgentRow.tsx
@@ -10,8 +10,8 @@ import type {
 } from "api/typesGenerated";
 import { Button } from "components/Button/Button";
 import { DropdownArrow } from "components/DropdownArrow/DropdownArrow";
-import { Stack } from "components/Stack/Stack";
 import { useProxy } from "contexts/ProxyContext";
+import { SquareCheckBigIcon } from "lucide-react";
 import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility";
 import { AppStatuses } from "pages/WorkspacePage/AppStatuses";
 import {
@@ -22,6 +22,7 @@ import {
 	useRef,
 	useState,
 } from "react";
+import { Link as RouterLink } from "react-router";
 import AutoSizer from "react-virtualized-auto-sizer";
 import type { FixedSizeList as List, ListOnScrollProps } from "react-window";
 import { AgentApps, organizeAgentApps } from "./AgentApps/AgentApps";
@@ -144,10 +145,9 @@ export const AgentRow: FC<AgentRowProps> = ({
 		hasSubdomainApps && !proxy.proxy?.wildcard_hostname;
 
 	return (
-		<Stack
+		<div
 			key={agent.id}
-			direction="column"
-			spacing={0}
+			className="flex flex-col max-w-full"
 			css={[
 				styles.agentRow,
 				styles[`agentRow-${agent.status}`],
@@ -215,6 +215,17 @@ export const AgentRow: FC<AgentRowProps> = ({
 					</section>
 				)}
 
+				{workspace.task_id && (
+					<Button asChild size="sm" variant="outline" className="w-fit">
+						<RouterLink
+							to={`/tasks/${workspace.owner_name}/${workspace.task_id}`}
+						>
+							<SquareCheckBigIcon />
+							View task
+						</RouterLink>
+					</Button>
+				)}
+
 				{shouldShowWildcardWarning && <WildcardHostnameWarning />}
 
 				{shouldDisplayAppsSection && (
@@ -325,7 +336,7 @@ export const AgentRow: FC<AgentRowProps> = ({
 						</AutoSizer>
 					</Collapse>
 
-					<Stack css={{ padding: "12px 16px" }} direction="row" spacing={1}>
+					<div className="flex flex-row gap-2 px-4 py-3">
 						<Button
 							size="sm"
 							variant="subtle"
@@ -336,10 +347,10 @@ export const AgentRow: FC<AgentRowProps> = ({
 						</Button>
 						<Divider orientation="vertical" variant="middle" flexItem />
 						<DownloadAgentLogsButton agent={agent} />
-					</Stack>
+					</div>
 				</section>
 			)}
-		</Stack>
+		</div>
 	);
 };
 
diff --git a/site/src/pages/WorkspacePage/AppStatuses.tsx b/site/src/pages/WorkspacePage/AppStatuses.tsx
index 7c415ac241..c57ea16731 100644
--- a/site/src/pages/WorkspacePage/AppStatuses.tsx
+++ b/site/src/pages/WorkspacePage/AppStatuses.tsx
@@ -19,12 +19,10 @@ import {
 	ExternalLinkIcon,
 	FileIcon,
 	LayoutGridIcon,
-	SquareCheckBigIcon,
 } from "lucide-react";
 import { AppStatusStateIcon } from "modules/apps/AppStatusStateIcon";
 import { useAppLink } from "modules/apps/useAppLink";
 import { type FC, useState } from "react";
-import { Link as RouterLink } from "react-router";
 import { timeFrom } from "utils/time";
 import { truncateURI } from "utils/uri";
 
@@ -114,17 +112,6 @@ export const AppStatuses: FC<AppStatusesProps> = ({
 							</Button>
 						))}
 
-					{workspace.task_id && (
-						<Button asChild size="sm" variant="outline">
-							<RouterLink
-								to={`/tasks/${workspace.owner_name}/${workspace.task_id}`}
-							>
-								<SquareCheckBigIcon />
-								View task
-							</RouterLink>
-						</Button>
-					)}
-
 					<Tooltip>
 						<TooltipTrigger asChild>
 							<Button