diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesHeader/V2WorkspacesHeader.tsx b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesHeader/V2WorkspacesHeader.tsx
index 1acf3e0c45f..9417d6eea6f 100644
--- a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesHeader/V2WorkspacesHeader.tsx
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesHeader/V2WorkspacesHeader.tsx
@@ -58,52 +58,48 @@ export function V2WorkspacesHeader({ counts }: V2WorkspacesHeaderProps) {
 	};
 
 	return (
-		<div className="flex flex-col gap-3 border-b border-border px-6 pt-5 pb-4">
-			<div className="flex flex-col gap-0.5">
-				<h1 className="text-lg font-semibold tracking-tight">Workspaces</h1>
-				<p className="text-sm text-muted-foreground">
-					Every workspace you can access across your devices. Open one to jump
-					in, or add it to your sidebar.
-				</p>
-			</div>
+		<div className="border-b border-border">
+			<div className="flex w-full flex-wrap items-center justify-between gap-3 px-6 py-4">
+				<h1 className="text-sm font-semibold tracking-tight">Workspaces</h1>
 
-			<div className="flex flex-wrap items-center gap-3">
-				<InputGroup className="w-full max-w-sm">
-					<InputGroupAddon align="inline-start">
-						<LuSearch className="size-4" />
-					</InputGroupAddon>
-					<InputGroupInput
-						type="search"
-						placeholder="Search workspace, project, branch, or device..."
-						value={searchQuery}
-						onChange={(event) => setSearchQuery(event.target.value)}
-					/>
-				</InputGroup>
+				<div className="flex flex-wrap items-center gap-2">
+					<InputGroup className="w-72">
+						<InputGroupAddon align="inline-start">
+							<LuSearch className="size-4" />
+						</InputGroupAddon>
+						<InputGroupInput
+							type="search"
+							placeholder="Search workspaces…"
+							value={searchQuery}
+							onChange={(event) => setSearchQuery(event.target.value)}
+						/>
+					</InputGroup>
 
-				<ToggleGroup
-					type="single"
-					variant="outline"
-					size="sm"
-					value={deviceFilter}
-					onValueChange={(value) => {
-						if (value) setDeviceFilter(value as V2WorkspacesDeviceFilter);
-					}}
-				>
-					{DEVICE_FILTER_OPTIONS.map(({ value, label, Icon }) => (
-						<ToggleGroupItem
-							key={value}
-							value={value}
-							aria-label={label}
-							className="gap-1.5"
-						>
-							{Icon ? <Icon className="size-3.5" /> : null}
-							<span>{label}</span>
-							<span className="tabular-nums text-muted-foreground">
-								{countForFilter(value)}
-							</span>
-						</ToggleGroupItem>
-					))}
-				</ToggleGroup>
+					<ToggleGroup
+						type="single"
+						variant="outline"
+						size="sm"
+						value={deviceFilter}
+						onValueChange={(value) => {
+							if (value) setDeviceFilter(value as V2WorkspacesDeviceFilter);
+						}}
+					>
+						{DEVICE_FILTER_OPTIONS.map(({ value, label, Icon }) => (
+							<ToggleGroupItem
+								key={value}
+								value={value}
+								aria-label={label}
+								className="gap-1.5"
+							>
+								{Icon ? <Icon className="size-3.5" /> : null}
+								<span>{label}</span>
+								<span className="tabular-nums text-muted-foreground">
+									{countForFilter(value)}
+								</span>
+							</ToggleGroupItem>
+						))}
+					</ToggleGroup>
+				</div>
 			</div>
 		</div>
 	);
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/V2WorkspacesList.tsx b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/V2WorkspacesList.tsx
index 6bbb0d5e46d..c237c351b1b 100644
--- a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/V2WorkspacesList.tsx
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/V2WorkspacesList.tsx
@@ -7,10 +7,10 @@ import {
 	EmptyMedia,
 	EmptyTitle,
 } from "@superset/ui/empty";
-import { ItemGroup } from "@superset/ui/item";
 import { ScrollArea } from "@superset/ui/scroll-area";
+import { cn } from "@superset/ui/utils";
 import { useMatchRoute } from "@tanstack/react-router";
-import { useMemo } from "react";
+import { useMemo, useState } from "react";
 import { LuLayers, LuSearchX } from "react-icons/lu";
 import type {
 	AccessibleV2Workspace,
@@ -20,17 +20,20 @@ import {
 	useV2WorkspacesFilterStore,
 	type V2WorkspacesDeviceFilter,
 } from "renderer/routes/_authenticated/_dashboard/v2-workspaces/stores/v2WorkspacesFilterStore";
+import { SortableHeader } from "./components/SortableHeader";
 import { V2WorkspaceRow } from "./components/V2WorkspaceRow";
+import { V2_WORKSPACES_ROW_GRID } from "./constants";
+import type { SortDirection, SortField } from "./types";
 
 interface V2WorkspacesListProps {
-	pinned: AccessibleV2Workspace[];
-	others: AccessibleV2Workspace[];
+	workspaces: AccessibleV2Workspace[];
 }
 
 interface ProjectGroup {
 	projectId: string;
 	projectName: string;
 	workspaces: AccessibleV2Workspace[];
+	latestCreatedAt: number;
 }
 
 function matchesDeviceFilter(
@@ -49,32 +52,95 @@ function matchesDeviceFilter(
 	}
 }
 
-function groupByProject(workspaces: AccessibleV2Workspace[]): ProjectGroup[] {
-	const groupsById = new Map<string, ProjectGroup>();
+// Host-type rank used as a tiebreaker when sorting by host — keeps local
+// device first, then remote devices, then cloud.
+function hostTypeRank(hostType: V2WorkspaceHostType): number {
+	switch (hostType) {
+		case "local-device":
+			return 0;
+		case "remote-device":
+			return 1;
+		case "cloud":
+			return 2;
+	}
+}
+
+function compareWorkspaces(
+	a: AccessibleV2Workspace,
+	b: AccessibleV2Workspace,
+	field: SortField,
+	direction: SortDirection,
+): number {
+	let cmp = 0;
+	switch (field) {
+		case "sidebar":
+			cmp = Number(a.isInSidebar) - Number(b.isInSidebar);
+			break;
+		case "name":
+			cmp = a.name.localeCompare(b.name);
+			break;
+		case "host":
+			cmp = hostTypeRank(a.hostType) - hostTypeRank(b.hostType);
+			if (cmp === 0) cmp = a.hostName.localeCompare(b.hostName);
+			break;
+		case "branch":
+			cmp = a.branch.localeCompare(b.branch);
+			break;
+		case "created":
+			cmp = a.createdAt.getTime() - b.createdAt.getTime();
+			break;
+	}
+	if (cmp === 0) {
+		cmp = b.createdAt.getTime() - a.createdAt.getTime();
+	}
+	return direction === "asc" ? cmp : -cmp;
+}
+
+function groupByProject(
+	workspaces: AccessibleV2Workspace[],
+	sortField: SortField,
+	sortDirection: SortDirection,
+): ProjectGroup[] {
+	const projectsById = new Map<string, ProjectGroup>();
+
 	for (const workspace of workspaces) {
-		const existing = groupsById.get(workspace.projectId);
-		if (existing) {
-			existing.workspaces.push(workspace);
-		} else {
-			groupsById.set(workspace.projectId, {
+		let project = projectsById.get(workspace.projectId);
+		if (!project) {
+			project = {
 				projectId: workspace.projectId,
 				projectName: workspace.projectName,
-				workspaces: [workspace],
-			});
+				workspaces: [],
+				latestCreatedAt: 0,
+			};
+			projectsById.set(workspace.projectId, project);
+		}
+		project.workspaces.push(workspace);
+		const createdAt = workspace.createdAt.getTime();
+		if (createdAt > project.latestCreatedAt) {
+			project.latestCreatedAt = createdAt;
 		}
 	}
-	return Array.from(groupsById.values()).sort((a, b) => {
-		const aLatest = Math.max(
-			...a.workspaces.map((workspace) => workspace.createdAt.getTime()),
-		);
-		const bLatest = Math.max(
-			...b.workspaces.map((workspace) => workspace.createdAt.getTime()),
+
+	for (const project of projectsById.values()) {
+		project.workspaces.sort((a, b) =>
+			compareWorkspaces(a, b, sortField, sortDirection),
 		);
-		return bLatest - aLatest;
-	});
+	}
+
+	return Array.from(projectsById.values()).sort(
+		(a, b) => b.latestCreatedAt - a.latestCreatedAt,
+	);
 }
 
-export function V2WorkspacesList({ pinned, others }: V2WorkspacesListProps) {
+const DEFAULT_DIRECTION_BY_FIELD: Record<SortField, SortDirection> = {
+	sidebar: "desc",
+	name: "asc",
+	host: "asc",
+	branch: "asc",
+	created: "desc",
+};
+
+export function V2WorkspacesList({ workspaces }: V2WorkspacesListProps) {
 	const matchRoute = useMatchRoute();
 	const currentWorkspaceMatch = matchRoute({
 		to: "/v2-workspace/$workspaceId",
@@ -88,120 +154,150 @@ export function V2WorkspacesList({ pinned, others }: V2WorkspacesListProps) {
 	);
 	const resetFilters = useV2WorkspacesFilterStore((state) => state.reset);
 
-	const filteredPinnedGroups = useMemo(() => {
-		const filtered = pinned.filter((workspace) =>
-			matchesDeviceFilter(workspace.hostType, deviceFilter),
-		);
-		return groupByProject(filtered);
-	}, [pinned, deviceFilter]);
+	const [sortField, setSortField] = useState<SortField>("created");
+	const [sortDirection, setSortDirection] = useState<SortDirection>("desc");
+
+	const handleSort = (field: SortField) => {
+		if (sortField === field) {
+			setSortDirection((prev) => (prev === "asc" ? "desc" : "asc"));
+		} else {
+			setSortField(field);
+			setSortDirection(DEFAULT_DIRECTION_BY_FIELD[field]);
+		}
+	};
 
-	const filteredOtherGroups = useMemo(() => {
-		const filtered = others.filter((workspace) =>
+	const projectGroups = useMemo(() => {
+		const filtered = workspaces.filter((workspace) =>
 			matchesDeviceFilter(workspace.hostType, deviceFilter),
 		);
-		return groupByProject(filtered);
-	}, [others, deviceFilter]);
+		return groupByProject(filtered, sortField, sortDirection);
+	}, [workspaces, deviceFilter, sortField, sortDirection]);
 
-	const pinnedCount = filteredPinnedGroups.reduce(
-		(total, group) => total + group.workspaces.length,
+	const totalCount = projectGroups.reduce(
+		(total, project) => total + project.workspaces.length,
 		0,
 	);
-	const othersCount = filteredOtherGroups.reduce(
-		(total, group) => total + group.workspaces.length,
-		0,
-	);
-	const hasAnyMatches = pinnedCount > 0 || othersCount > 0;
 	const hasActiveFilters = searchQuery.trim() !== "" || deviceFilter !== "all";
 
-	if (!hasAnyMatches) {
+	const columnHeader = (
+		<div
+			className={cn(
+				V2_WORKSPACES_ROW_GRID,
+				"sticky top-0 z-10 border-b border-border bg-background px-6 py-2 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground/80",
+			)}
+		>
+			<SortableHeader
+				field="sidebar"
+				label="In sidebar"
+				align="center"
+				srOnlyLabel
+				sortField={sortField}
+				sortDirection={sortDirection}
+				onSort={handleSort}
+			/>
+			<SortableHeader
+				field="name"
+				label="Name"
+				sortField={sortField}
+				sortDirection={sortDirection}
+				onSort={handleSort}
+			/>
+			<SortableHeader
+				field="host"
+				label="Host"
+				className="hidden md:flex"
+				sortField={sortField}
+				sortDirection={sortDirection}
+				onSort={handleSort}
+			/>
+			<SortableHeader
+				field="branch"
+				label="Branch"
+				className="hidden lg:flex"
+				sortField={sortField}
+				sortDirection={sortDirection}
+				onSort={handleSort}
+			/>
+			<SortableHeader
+				field="created"
+				label="Created"
+				className="hidden xl:flex"
+				sortField={sortField}
+				sortDirection={sortDirection}
+				onSort={handleSort}
+			/>
+			<span />
+		</div>
+	);
+
+	if (totalCount === 0) {
 		return (
-			<Empty className="flex-1 border-0">
-				<EmptyHeader>
-					<EmptyMedia
-						variant="icon"
-						className="size-14 [&_svg:not([class*='size-'])]:size-7"
-					>
-						{hasActiveFilters ? <LuSearchX /> : <LuLayers />}
-					</EmptyMedia>
-					<EmptyTitle>
-						{hasActiveFilters
-							? "No workspaces match your filters"
-							: "No workspaces yet"}
-					</EmptyTitle>
-					<EmptyDescription>
-						{hasActiveFilters
-							? "Try a different search term or clear the device filter."
-							: "Workspaces you have access to across all your devices will show up here."}
-					</EmptyDescription>
-				</EmptyHeader>
-				{hasActiveFilters ? (
-					<EmptyContent>
-						<Button variant="outline" size="sm" onClick={() => resetFilters()}>
-							Clear filters
-						</Button>
-					</EmptyContent>
-				) : null}
-			</Empty>
+			<div className="flex min-h-0 flex-1 flex-col">
+				{columnHeader}
+				<Empty className="flex-1 border-0">
+					<EmptyHeader>
+						<EmptyMedia
+							variant="icon"
+							className="size-14 [&_svg:not([class*='size-'])]:size-7"
+						>
+							{hasActiveFilters ? <LuSearchX /> : <LuLayers />}
+						</EmptyMedia>
+						<EmptyTitle>
+							{hasActiveFilters
+								? "No workspaces match your filters"
+								: "No workspaces yet"}
+						</EmptyTitle>
+						<EmptyDescription>
+							{hasActiveFilters
+								? "Try a different search term or clear the device filter."
+								: "Workspaces you have access to across all your devices will show up here."}
+						</EmptyDescription>
+					</EmptyHeader>
+					{hasActiveFilters ? (
+						<EmptyContent>
+							<Button
+								variant="outline"
+								size="sm"
+								onClick={() => resetFilters()}
+							>
+								Clear filters
+							</Button>
+						</EmptyContent>
+					) : null}
+				</Empty>
+			</div>
 		);
 	}
 
-	const renderProjectGroups = (groups: ProjectGroup[]) => (
-		<div className="flex flex-col gap-5">
-			{groups.map((group) => (
-				<div key={group.projectId} className="flex flex-col gap-2">
-					<div className="flex items-baseline gap-2 px-1">
-						<h3 className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
-							{group.projectName}
-						</h3>
-						<span className="text-xs text-muted-foreground/70">
-							{group.workspaces.length}
-						</span>
-					</div>
-					<ItemGroup className="gap-2">
-						{group.workspaces.map((workspace) => (
-							<V2WorkspaceRow
-								key={workspace.id}
-								workspace={workspace}
-								showProjectName={false}
-								isCurrentRoute={workspace.id === currentWorkspaceId}
-							/>
-						))}
-					</ItemGroup>
-				</div>
-			))}
-		</div>
-	);
-
 	return (
 		<ScrollArea className="min-h-0 flex-1">
-			<div className="flex flex-col gap-8 px-6 py-6">
-				{pinnedCount > 0 ? (
-					<section className="flex flex-col gap-3">
-						<div className="flex items-baseline gap-2">
-							<h2 className="text-sm font-semibold text-foreground">
-								In your sidebar
-							</h2>
-							<span className="text-xs text-muted-foreground">
-								{pinnedCount}
-							</span>
-						</div>
-						{renderProjectGroups(filteredPinnedGroups)}
-					</section>
-				) : null}
-
-				{othersCount > 0 ? (
-					<section className="flex flex-col gap-3">
-						<div className="flex items-baseline gap-2">
-							<h2 className="text-sm font-semibold text-foreground">
-								Other workspaces
-							</h2>
-							<span className="text-xs text-muted-foreground">
-								{othersCount}
+			<div className="flex w-full flex-col">
+				{columnHeader}
+
+				{projectGroups.map((project) => (
+					<div key={project.projectId} className="flex flex-col">
+						<div className="flex items-center gap-2 border-b border-border/60 bg-muted/30 px-6 py-1.5">
+							<h3
+								className="min-w-0 truncate text-xs font-semibold text-foreground/80"
+								title={project.projectName}
+							>
+								{project.projectName}
+							</h3>
+							<span className="shrink-0 text-xs tabular-nums text-muted-foreground/60">
+								{project.workspaces.length}
 							</span>
 						</div>
-						{renderProjectGroups(filteredOtherGroups)}
-					</section>
-				) : null}
+						<ul className="flex flex-col">
+							{project.workspaces.map((workspace) => (
+								<V2WorkspaceRow
+									key={workspace.id}
+									workspace={workspace}
+									isCurrentRoute={workspace.id === currentWorkspaceId}
+								/>
+							))}
+						</ul>
+					</div>
+				))}
 			</div>
 		</ScrollArea>
 	);
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/SortableHeader/SortableHeader.tsx b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/SortableHeader/SortableHeader.tsx
new file mode 100644
index 00000000000..3d5a0cf8de3
--- /dev/null
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/SortableHeader/SortableHeader.tsx
@@ -0,0 +1,60 @@
+import { cn } from "@superset/ui/utils";
+import { LuChevronDown, LuChevronsUpDown, LuChevronUp } from "react-icons/lu";
+import type { SortDirection, SortField } from "../../types";
+
+interface SortableHeaderProps {
+	field: SortField;
+	label: string;
+	align?: "start" | "center";
+	className?: string;
+	sortField: SortField;
+	sortDirection: SortDirection;
+	onSort: (field: SortField) => void;
+	srOnlyLabel?: boolean;
+}
+
+export function SortableHeader({
+	field,
+	label,
+	align = "start",
+	className,
+	sortField,
+	sortDirection,
+	onSort,
+	srOnlyLabel = false,
+}: SortableHeaderProps) {
+	const isActive = sortField === field;
+	const Icon = !isActive
+		? LuChevronsUpDown
+		: sortDirection === "asc"
+			? LuChevronUp
+			: LuChevronDown;
+	const sortLabel = isActive
+		? sortDirection === "asc"
+			? "ascending"
+			: "descending"
+		: "not sorted";
+
+	return (
+		<button
+			type="button"
+			onClick={() => onSort(field)}
+			aria-label={`Sort by ${label}, currently ${sortLabel}`}
+			className={cn(
+				"group flex min-w-0 items-center gap-1 rounded outline-none transition-colors",
+				"hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring/40",
+				align === "center" && "justify-center",
+				isActive && "text-foreground",
+				className,
+			)}
+		>
+			<span className={cn("truncate", srOnlyLabel && "sr-only")}>{label}</span>
+			<Icon
+				className={cn(
+					"size-3 shrink-0 transition-opacity",
+					isActive ? "opacity-100" : "opacity-0 group-hover:opacity-60",
+				)}
+			/>
+		</button>
+	);
+}
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/SortableHeader/index.ts b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/SortableHeader/index.ts
new file mode 100644
index 00000000000..c85413e268f
--- /dev/null
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/SortableHeader/index.ts
@@ -0,0 +1 @@
+export { SortableHeader } from "./SortableHeader";
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/V2WorkspaceRow.tsx b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/V2WorkspaceRow.tsx
index 4cc638df286..566c3bc3709 100644
--- a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/V2WorkspaceRow.tsx
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/V2WorkspaceRow.tsx
@@ -1,13 +1,6 @@
-import { Badge } from "@superset/ui/badge";
 import { Button } from "@superset/ui/button";
-import {
-	Item,
-	ItemActions,
-	ItemContent,
-	ItemDescription,
-	ItemMedia,
-	ItemTitle,
-} from "@superset/ui/item";
+import { Tooltip, TooltipContent, TooltipTrigger } from "@superset/ui/tooltip";
+import { cn } from "@superset/ui/utils";
 import { useNavigate } from "@tanstack/react-router";
 import { useCallback } from "react";
 import {
@@ -19,32 +12,44 @@ import {
 	LuPlus,
 } from "react-icons/lu";
 import { navigateToV2Workspace } from "renderer/routes/_authenticated/_dashboard/utils/workspace-navigation";
-import type { AccessibleV2Workspace } from "renderer/routes/_authenticated/_dashboard/v2-workspaces/hooks/useAccessibleV2Workspaces";
+import type {
+	AccessibleV2Workspace,
+	V2WorkspaceHostType,
+} from "renderer/routes/_authenticated/_dashboard/v2-workspaces/hooks/useAccessibleV2Workspaces";
 import { useDashboardSidebarState } from "renderer/routes/_authenticated/hooks/useDashboardSidebarState";
 import { getRelativeTime } from "renderer/screens/main/components/WorkspacesListView/utils";
-import { V2WorkspaceDeviceBadge } from "./components/V2WorkspaceDeviceBadge";
+import { V2_WORKSPACES_ROW_GRID } from "../../constants";
 
 interface V2WorkspaceRowProps {
 	workspace: AccessibleV2Workspace;
-	showProjectName: boolean;
 	isCurrentRoute: boolean;
 }
 
+function hostIconFor(hostType: V2WorkspaceHostType) {
+	switch (hostType) {
+		case "cloud":
+			return LuCloud;
+		case "local-device":
+			return LuLaptop;
+		case "remote-device":
+			return LuMonitor;
+	}
+}
+
 export function V2WorkspaceRow({
 	workspace,
-	showProjectName,
 	isCurrentRoute,
 }: V2WorkspaceRowProps) {
 	const navigate = useNavigate();
 	const { ensureWorkspaceInSidebar, removeWorkspaceFromSidebar } =
 		useDashboardSidebarState();
 
-	const HostIcon =
-		workspace.hostType === "cloud"
-			? LuCloud
-			: workspace.hostType === "local-device"
-				? LuLaptop
-				: LuMonitor;
+	const HostIcon = hostIconFor(workspace.hostType);
+
+	// The local device is always reachable from here — ignore any stale
+	// isOnline flag on that row.
+	const treatAsOffline =
+		!workspace.hostIsOnline && workspace.hostType !== "local-device";
 
 	const handleOpen = useCallback(() => {
 		navigateToV2Workspace(workspace.id, navigate);
@@ -70,8 +75,16 @@ export function V2WorkspaceRow({
 		? "you"
 		: (workspace.createdByName ?? "unknown");
 
+	const timeLabel = getRelativeTime(workspace.createdAt.getTime(), {
+		format: "compact",
+	});
+
 	const handleRowKeyDown = useCallback(
 		(event: React.KeyboardEvent<HTMLDivElement>) => {
+			// Ignore keystrokes bubbling from focused descendants (e.g. the
+			// Add/Remove icon buttons) — `stopPropagation` on their click handlers
+			// doesn't catch keyboard events.
+			if (event.target !== event.currentTarget) return;
 			if (event.key === "Enter" || event.key === " ") {
 				event.preventDefault();
 				handleOpen();
@@ -80,72 +93,129 @@ export function V2WorkspaceRow({
 		[handleOpen],
 	);
 
+	const hostCell = (
+		<span
+			className={cn(
+				"hidden min-w-0 items-center gap-1.5 text-xs text-muted-foreground md:flex",
+				treatAsOffline && "text-muted-foreground/60",
+			)}
+			title={workspace.hostName}
+		>
+			<HostIcon className="size-3 shrink-0" />
+			<span className="min-w-0 truncate">{workspace.hostName}</span>
+			{treatAsOffline ? (
+				<span
+					aria-hidden
+					className="inline-block size-1.5 shrink-0 rounded-full bg-muted-foreground/40"
+				/>
+			) : null}
+		</span>
+	);
+
 	return (
-		<Item
-			variant="outline"
-			size="sm"
-			role="button"
-			tabIndex={0}
-			onClick={handleOpen}
-			onKeyDown={handleRowKeyDown}
-			className="cursor-pointer border-border/60 outline-none hover:bg-accent/50 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50"
+		<li
+			aria-current={isCurrentRoute ? "page" : undefined}
+			className="border-b border-border/50 last:border-b-0"
 		>
-			<ItemMedia variant="icon">
-				<HostIcon className="size-4" />
-			</ItemMedia>
-
-			<ItemContent>
-				<ItemTitle>
-					<span className="truncate">{workspace.name}</span>
-				</ItemTitle>
-				<ItemDescription className="flex flex-wrap items-center gap-2">
-					{showProjectName ? (
-						<span className="font-medium text-foreground/70">
-							{workspace.projectName}
-						</span>
+			{/* biome-ignore lint/a11y/useSemanticElements: interactive row needs nested buttons, so the outer element is a div with role/tabIndex */}
+			<div
+				role="button"
+				tabIndex={0}
+				onClick={handleOpen}
+				onKeyDown={handleRowKeyDown}
+				className={cn(
+					V2_WORKSPACES_ROW_GRID,
+					"group/row relative min-w-0 px-6 py-2 text-sm outline-none",
+					"cursor-pointer transition-colors hover:bg-accent/50",
+					"focus-visible:bg-accent/50 focus-visible:ring-2 focus-visible:ring-ring/40 focus-visible:ring-inset",
+					isCurrentRoute && "bg-accent/40",
+				)}
+			>
+				<span className="flex items-center justify-center">
+					{workspace.isInSidebar ? (
+						<span
+							role="img"
+							aria-label="In your sidebar"
+							title="In your sidebar"
+							className="size-1.5 rounded-full bg-primary"
+						/>
 					) : null}
-					<Badge variant="secondary" className="gap-1 font-normal">
-						<LuGitBranch className="size-3" />
-						<span className="max-w-[16rem] truncate">{workspace.branch}</span>
-					</Badge>
-					<V2WorkspaceDeviceBadge
-						hostType={workspace.hostType}
-						hostName={workspace.hostName}
-						isOnline={workspace.hostIsOnline}
-					/>
-					<span className="text-xs text-muted-foreground">
-						{getRelativeTime(workspace.createdAt.getTime(), {
-							format: "compact",
-						})}{" "}
-						by {creatorLabel}
-					</span>
-				</ItemDescription>
-			</ItemContent>
-
-			<ItemActions>
-				{workspace.isInSidebar ? (
-					<Button
-						size="sm"
-						variant="outline"
-						onClick={handleRemoveFromSidebar}
-						disabled={isCurrentRoute}
-						className="gap-1.5"
+				</span>
+
+				<span className="flex min-w-0 items-center">
+					<span
+						className="min-w-0 truncate font-medium text-foreground"
+						title={workspace.name}
 					>
-						<LuMinus className="size-3.5" />
-						Remove from sidebar
-					</Button>
+						{workspace.name}
+					</span>
+				</span>
+
+				{treatAsOffline ? (
+					<Tooltip delayDuration={300}>
+						<TooltipTrigger asChild>{hostCell}</TooltipTrigger>
+						<TooltipContent side="top">Host is offline</TooltipContent>
+					</Tooltip>
 				) : (
-					<Button
-						size="sm"
-						variant="default"
-						onClick={handleAddToSidebar}
-						className="gap-1.5"
-					>
-						<LuPlus className="size-3.5" />
-						Add to sidebar
-					</Button>
+					hostCell
 				)}
-			</ItemActions>
-		</Item>
+
+				<span
+					className="hidden min-w-0 items-center gap-1.5 text-xs text-muted-foreground lg:flex"
+					title={workspace.branch}
+				>
+					<LuGitBranch className="size-3 shrink-0" />
+					<span className="min-w-0 truncate font-mono text-[11px]">
+						{workspace.branch}
+					</span>
+				</span>
+
+				<span
+					className="hidden truncate text-xs tabular-nums text-muted-foreground xl:block"
+					title={`Created ${workspace.createdAt.toLocaleString()} by ${creatorLabel}`}
+				>
+					{timeLabel} · {creatorLabel}
+				</span>
+
+				<div className="flex justify-end">
+					{workspace.isInSidebar ? (
+						<Tooltip delayDuration={300}>
+							<TooltipTrigger asChild>
+								<Button
+									size="icon"
+									variant="ghost"
+									onClick={handleRemoveFromSidebar}
+									disabled={isCurrentRoute}
+									aria-label="Remove from sidebar"
+									className="size-7 opacity-0 transition-opacity group-hover/row:opacity-100 focus-visible:opacity-100 data-[state=open]:opacity-100"
+								>
+									<LuMinus className="size-3.5" />
+								</Button>
+							</TooltipTrigger>
+							<TooltipContent side="left">
+								{isCurrentRoute
+									? "Can't remove the current workspace"
+									: "Remove from sidebar"}
+							</TooltipContent>
+						</Tooltip>
+					) : (
+						<Tooltip delayDuration={300}>
+							<TooltipTrigger asChild>
+								<Button
+									size="icon"
+									variant="ghost"
+									onClick={handleAddToSidebar}
+									aria-label="Add to sidebar"
+									className="size-7 opacity-0 transition-opacity group-hover/row:opacity-100 focus-visible:opacity-100"
+								>
+									<LuPlus className="size-3.5" />
+								</Button>
+							</TooltipTrigger>
+							<TooltipContent side="left">Add to sidebar</TooltipContent>
+						</Tooltip>
+					)}
+				</div>
+			</div>
+		</li>
 	);
 }
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/components/V2WorkspaceDeviceBadge/V2WorkspaceDeviceBadge.tsx b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/components/V2WorkspaceDeviceBadge/V2WorkspaceDeviceBadge.tsx
deleted file mode 100644
index 96872d2e490..00000000000
--- a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/components/V2WorkspaceDeviceBadge/V2WorkspaceDeviceBadge.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import { Badge } from "@superset/ui/badge";
-import { Tooltip, TooltipContent, TooltipTrigger } from "@superset/ui/tooltip";
-import { cn } from "@superset/ui/utils";
-import { LuCloud, LuLaptop, LuMonitor } from "react-icons/lu";
-import type { V2WorkspaceHostType } from "renderer/routes/_authenticated/_dashboard/v2-workspaces/hooks/useAccessibleV2Workspaces";
-
-interface V2WorkspaceDeviceBadgeProps {
-	hostType: V2WorkspaceHostType;
-	hostName: string;
-	isOnline: boolean;
-}
-
-export function V2WorkspaceDeviceBadge({
-	hostType,
-	hostName,
-	isOnline,
-}: V2WorkspaceDeviceBadgeProps) {
-	const Icon =
-		hostType === "cloud"
-			? LuCloud
-			: hostType === "local-device"
-				? LuLaptop
-				: LuMonitor;
-
-	// The local device is always reachable from here — ignore any stale
-	// isOnline flag on that row.
-	const treatAsOffline = !isOnline && hostType !== "local-device";
-
-	const badge = (
-		<Badge
-			variant="outline"
-			className={cn(
-				"gap-1 font-normal",
-				treatAsOffline && "text-muted-foreground/70",
-			)}
-		>
-			<Icon className="size-3" />
-			<span className="max-w-[12rem] truncate">{hostName}</span>
-			{treatAsOffline ? (
-				<span
-					aria-hidden
-					className="ml-0.5 inline-block size-1.5 rounded-full bg-muted-foreground/50"
-				/>
-			) : null}
-		</Badge>
-	);
-
-	if (!treatAsOffline) {
-		return badge;
-	}
-
-	return (
-		<Tooltip delayDuration={300}>
-			<TooltipTrigger asChild>{badge}</TooltipTrigger>
-			<TooltipContent side="top">Host is offline</TooltipContent>
-		</Tooltip>
-	);
-}
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/components/V2WorkspaceDeviceBadge/index.ts b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/components/V2WorkspaceDeviceBadge/index.ts
deleted file mode 100644
index ca6ed56dfa0..00000000000
--- a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/components/V2WorkspaceRow/components/V2WorkspaceDeviceBadge/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { V2WorkspaceDeviceBadge } from "./V2WorkspaceDeviceBadge";
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/constants.ts b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/constants.ts
new file mode 100644
index 00000000000..738705ecda4
--- /dev/null
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/constants.ts
@@ -0,0 +1,5 @@
+// Shared grid template used by the column header row and every workspace row
+// so the Sidebar / Name / Host / Branch / Created / Action columns align
+// across the whole view. Columns hide progressively on narrower viewports.
+export const V2_WORKSPACES_ROW_GRID =
+	"grid grid-cols-[1.25rem_minmax(0,1fr)_2.5rem] gap-4 md:grid-cols-[1.25rem_minmax(0,1fr)_12rem_2.5rem] lg:grid-cols-[1.25rem_minmax(0,1fr)_12rem_14rem_2.5rem] xl:grid-cols-[1.25rem_minmax(0,1fr)_12rem_14rem_11rem_2.5rem] items-center";
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/types.ts b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/types.ts
new file mode 100644
index 00000000000..09ae323f499
--- /dev/null
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/components/V2WorkspacesList/types.ts
@@ -0,0 +1,2 @@
+export type SortField = "sidebar" | "name" | "host" | "branch" | "created";
+export type SortDirection = "asc" | "desc";
diff --git a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/page.tsx b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/page.tsx
index fee586a4f3a..ebaa0ba0e7e 100644
--- a/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/page.tsx
+++ b/apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspaces/page.tsx
@@ -22,12 +22,12 @@ function V2WorkspacesPage() {
 		resetFilters();
 	}, [resetFilters]);
 
-	const { pinned, others, counts } = useAccessibleV2Workspaces({ searchQuery });
+	const { all, counts } = useAccessibleV2Workspaces({ searchQuery });
 
 	return (
 		<div className="flex h-full w-full flex-1 flex-col overflow-hidden">
 			<V2WorkspacesHeader counts={counts} />
-			<V2WorkspacesList pinned={pinned} others={others} />
+			<V2WorkspacesList workspaces={all} />
 		</div>
 	);
 }