From a2142d5ebc55cbfee399e6815c104091a6d7caf7 Mon Sep 17 00:00:00 2001
From: Techulus Agent <291950465+techulus-agent@users.noreply.github.com>
Date: Wed, 1 Jul 2026 12:52:04 +1000
Subject: [PATCH 1/6] Add metrics chart skeleton loading

Amp-Thread-ID: https://ampcode.com/threads/T-019f1b94-0656-77c9-8427-9831fdf69651
Co-authored-by: Amp <amp@ampcode.com>
---
 .../metrics/metrics-history-charts.tsx        | 40 ++++++++++++-------
 1 file changed, 26 insertions(+), 14 deletions(-)

diff --git a/web/components/metrics/metrics-history-charts.tsx b/web/components/metrics/metrics-history-charts.tsx
index 811a4cd1..837f8028 100644
--- a/web/components/metrics/metrics-history-charts.tsx
+++ b/web/components/metrics/metrics-history-charts.tsx
@@ -25,7 +25,7 @@ import {
 	NativeSelect,
 	NativeSelectOption,
 } from "@/components/ui/native-select";
-import { Spinner } from "@/components/ui/spinner";
+import { Skeleton } from "@/components/ui/skeleton";
 import { fetcher } from "@/lib/fetcher";
 import { METRIC_RANGE_KEYS, type MetricRange } from "@/lib/metric-ranges";
 import type {
@@ -178,12 +178,7 @@ export function MetricsHistoryCharts({
 					description="The metrics API could not be reached. Current health data may still be available."
 				/>
 			) : isLoading ? (
-				<MetricsStateCard
-					icon={Activity}
-					title="Loading metrics"
-					description="Fetching recent infrastructure history."
-					loading
-				/>
+				<MetricsChartsSkeleton />
 			) : !hasData ? (
 				<MetricsStateCard
 					icon={Activity}
@@ -330,26 +325,43 @@ function MetricChartCard({
 	);
 }
 
+function MetricsChartsSkeleton() {
+	return (
+		<div aria-hidden="true" className="grid gap-4">
+			{CHARTS.map((chart) => (
+				<Card key={chart.title}>
+					<CardHeader className="border-b">
+						<div className="flex items-center gap-3">
+							<Skeleton className="size-8 rounded-lg" />
+							<div className="space-y-2">
+								<Skeleton className="h-5 w-24" />
+								<Skeleton className="h-4 w-56 max-w-full" />
+							</div>
+						</div>
+					</CardHeader>
+					<CardContent className="pt-4">
+						<Skeleton className="h-72 rounded-lg lg:h-80" />
+					</CardContent>
+				</Card>
+			))}
+		</div>
+	);
+}
+
 function MetricsStateCard({
 	icon: Icon,
 	title,
 	description,
-	loading = false,
 }: {
 	icon: typeof Activity;
 	title: string;
 	description: string;
-	loading?: boolean;
 }) {
 	return (
 		<Card>
 			<CardContent className="flex items-center gap-3 py-6">
 				<div className="flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted text-muted-foreground">
-					{loading ? (
-						<Spinner className="size-4" />
-					) : (
-						<Icon className="size-4" />
-					)}
+					<Icon className="size-4" />
 				</div>
 				<div>
 					<p className="font-medium">{title}</p>

From 97a6603721805ef7a7d51e95aab9cc72b21cf8e8 Mon Sep 17 00:00:00 2001
From: Techulus Agent <291950465+techulus-agent@users.noreply.github.com>
Date: Wed, 1 Jul 2026 12:53:19 +1000
Subject: [PATCH 2/6] Hide remove action for admin members

Amp-Thread-ID: https://ampcode.com/threads/T-019f1b94-0656-77c9-8427-9831fdf69651
Co-authored-by: Amp <amp@ampcode.com>
---
 web/components/settings/member-settings.tsx | 26 +++++++++++----------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/web/components/settings/member-settings.tsx b/web/components/settings/member-settings.tsx
index f7fc5d1b..90cb0865 100644
--- a/web/components/settings/member-settings.tsx
+++ b/web/components/settings/member-settings.tsx
@@ -244,18 +244,20 @@ export function MemberSettings({ initialMembers, initialInvitations }: Props) {
 									<NativeSelectOption value="reader">Reader</NativeSelectOption>
 								</NativeSelect>
 							)}
-							<div className="flex justify-end">
-								<Button
-									type="button"
-									variant="ghost"
-									size="icon"
-									disabled={member.role === "admin" || busyId === member.id}
-									onClick={() => void handleRemove(member)}
-									title="Remove member"
-								>
-									<Trash2 className="size-4" />
-								</Button>
-							</div>
+							{member.role !== "admin" && (
+								<div className="flex justify-end">
+									<Button
+										type="button"
+										variant="ghost"
+										size="icon"
+										disabled={busyId === member.id}
+										onClick={() => void handleRemove(member)}
+										title="Remove member"
+									>
+										<Trash2 className="size-4" />
+									</Button>
+								</div>
+							)}
 						</div>
 					))}
 				</div>

From c4a6be6c08801a6f9f7d9b41e941ebecf5654298 Mon Sep 17 00:00:00 2001
From: Techulus Agent <291950465+techulus-agent@users.noreply.github.com>
Date: Wed, 1 Jul 2026 12:54:39 +1000
Subject: [PATCH 3/6] Simplify server running services list

Amp-Thread-ID: https://ampcode.com/threads/T-019f1b94-0656-77c9-8427-9831fdf69651
Co-authored-by: Amp <amp@ampcode.com>
---
 web/components/server/server-services.tsx | 90 ++++++++++++++---------
 1 file changed, 57 insertions(+), 33 deletions(-)

diff --git a/web/components/server/server-services.tsx b/web/components/server/server-services.tsx
index c348d9f5..ac75e0bb 100644
--- a/web/components/server/server-services.tsx
+++ b/web/components/server/server-services.tsx
@@ -1,5 +1,5 @@
 import Link from "next/link";
-import { Box, Layers } from "lucide-react";
+import { ArrowUpRight, Layers } from "lucide-react";
 import {
 	Card,
 	CardContent,
@@ -7,14 +7,6 @@ import {
 	CardHeader,
 	CardTitle,
 } from "@/components/ui/card";
-import {
-	Item,
-	ItemContent,
-	ItemDescription,
-	ItemGroup,
-	ItemMedia,
-	ItemTitle,
-} from "@/components/ui/item";
 import { getServerServices } from "@/db/queries";
 
 export async function ServerServices({ serverId }: { serverId: string }) {
@@ -24,6 +16,8 @@ export async function ServerServices({ serverId }: { serverId: string }) {
 		return null;
 	}
 
+	const groups = groupServicesByProjectEnvironment(services);
+
 	return (
 		<Card>
 			<CardHeader>
@@ -37,32 +31,62 @@ export async function ServerServices({ serverId }: { serverId: string }) {
 				</CardDescription>
 			</CardHeader>
 			<CardContent>
-				<ItemGroup className="grid gap-3 md:grid-cols-2">
-					{services.map((service) => (
-						<Item
-							key={service.serviceId}
-							variant="outline"
-							render={
-								<Link
-									href={`/dashboard/projects/${service.projectSlug}/${service.environmentName}?service=${service.serviceId}`}
-								/>
-							}
-						>
-							<ItemMedia variant="icon">
-								<Box className="size-5 text-muted-foreground" />
-							</ItemMedia>
-							<ItemContent>
-								<ItemTitle className="truncate">
-									{service.serviceName}
-								</ItemTitle>
-								<ItemDescription className="truncate">
-									{service.projectName} / {service.environmentName}
-								</ItemDescription>
-							</ItemContent>
-						</Item>
+				<div className="space-y-5">
+					{groups.map((group) => (
+						<div key={group.key} className="space-y-2">
+							<div>
+								<p className="font-medium text-sm">{group.projectName}</p>
+								<p className="text-xs text-muted-foreground">
+									{group.environmentName}
+								</p>
+							</div>
+							<div className="divide-y rounded-lg border">
+								{group.services.map((service) => (
+									<Link
+										key={service.serviceId}
+										href={`/dashboard/projects/${service.projectSlug}/${service.environmentName}/services/${service.serviceId}`}
+										className="flex items-center justify-between gap-3 px-3 py-2.5 text-sm transition-colors hover:bg-muted"
+									>
+										<span className="min-w-0 truncate font-medium">
+											{service.serviceName}
+										</span>
+										<ArrowUpRight className="size-4 shrink-0 text-muted-foreground" />
+									</Link>
+								))}
+							</div>
+						</div>
 					))}
-				</ItemGroup>
+				</div>
 			</CardContent>
 		</Card>
 	);
 }
+
+type ServerService = Awaited<ReturnType<typeof getServerServices>>[number];
+
+function groupServicesByProjectEnvironment(services: ServerService[]) {
+	const groups = new Map<
+		string,
+		{
+			key: string;
+			projectName: string;
+			environmentName: string;
+			services: ServerService[];
+		}
+	>();
+
+	for (const service of services) {
+		const key = `${service.projectId}:${service.environmentName}`;
+		const group = groups.get(key) ?? {
+			key,
+			projectName: service.projectName,
+			environmentName: service.environmentName,
+			services: [],
+		};
+
+		group.services.push(service);
+		groups.set(key, group);
+	}
+
+	return Array.from(groups.values());
+}

From 6e3e7e686de0cfc00d41417a67461dff5ab7b360 Mon Sep 17 00:00:00 2001
From: Techulus Agent <291950465+techulus-agent@users.noreply.github.com>
Date: Wed, 1 Jul 2026 12:55:38 +1000
Subject: [PATCH 4/6] Show user name in account dropdown

Amp-Thread-ID: https://ampcode.com/threads/T-019f1b94-0656-77c9-8427-9831fdf69651
Co-authored-by: Amp <amp@ampcode.com>
---
 web/app/(dashboard)/layout-client.tsx | 20 +++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/web/app/(dashboard)/layout-client.tsx b/web/app/(dashboard)/layout-client.tsx
index 12aa1b62..606c47c7 100644
--- a/web/app/(dashboard)/layout-client.tsx
+++ b/web/app/(dashboard)/layout-client.tsx
@@ -24,7 +24,13 @@ import {
 import { Toaster } from "@/components/ui/sonner";
 import { signOut, useSession } from "@/lib/auth-client";
 
-function DashboardHeader({ email }: { email: string }) {
+function DashboardHeader({
+	email,
+	name,
+}: {
+	email: string;
+	name: string;
+}) {
 	const router = useRouter();
 	const breadcrumbs = useBreadcrumbs();
 	const getBreadcrumbKey = (
@@ -115,7 +121,12 @@ function DashboardHeader({ email }: { email: string }) {
 					</DropdownMenuTrigger>
 					<DropdownMenuContent align="end" sideOffset={8}>
 						<DropdownMenuGroup>
-							<DropdownMenuLabel>{email}</DropdownMenuLabel>
+							<DropdownMenuLabel>
+								<span className="block font-medium">{name}</span>
+								<span className="block truncate text-xs font-normal text-muted-foreground">
+									{email}
+								</span>
+							</DropdownMenuLabel>
 						</DropdownMenuGroup>
 						<DropdownMenuSeparator />
 						<DropdownMenuItem
@@ -166,7 +177,10 @@ export function DashboardLayoutClient({
 	return (
 		<BreadcrumbDataProvider>
 			<div className="min-h-screen">
-				<DashboardHeader email={session.user.email} />
+				<DashboardHeader
+					email={session.user.email}
+					name={session.user.name}
+				/>
 				<OfflineServersBanner />
 				<main>{children}</main>
 				<Toaster />

From 3540d2f1dd00740e03523ed615d8385998cfe022 Mon Sep 17 00:00:00 2001
From: Techulus Agent <291950465+techulus-agent@users.noreply.github.com>
Date: Wed, 1 Jul 2026 16:03:38 +1000
Subject: [PATCH 5/6] Tighten stale server detection cadence

Amp-Thread-ID: https://ampcode.com/threads/T-019f1b94-0656-77c9-8427-9831fdf69651
Co-authored-by: Amp <amp@ampcode.com>
---
 web/lib/inngest/functions/crons.ts | 2 +-
 web/lib/scheduler.ts               | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/lib/inngest/functions/crons.ts b/web/lib/inngest/functions/crons.ts
index 78983e04..92c3a068 100644
--- a/web/lib/inngest/functions/crons.ts
+++ b/web/lib/inngest/functions/crons.ts
@@ -16,7 +16,7 @@ import { inngest } from "../client";
 export const staleServerCheck = inngest.createFunction(
 	{
 		id: "cron-stale-server-check",
-		triggers: [cron("*/5 * * * *")],
+		triggers: [cron("* * * * *")],
 		singleton: { mode: "skip" },
 	},
 	async ({ step }) => {
diff --git a/web/lib/scheduler.ts b/web/lib/scheduler.ts
index ccb5ed3c..c7177135 100644
--- a/web/lib/scheduler.ts
+++ b/web/lib/scheduler.ts
@@ -19,7 +19,7 @@ import {
 	WORK_QUEUE_MAX_ATTEMPTS,
 } from "@/lib/work-queue";
 
-const STALE_THRESHOLD_MS = 120_000; // 2 minutes
+const STALE_THRESHOLD_MS = 75_000; // 75 seconds
 
 async function triggerRecoveryForOfflineServers(
 	offlineServerIds: string[],

From 59b6d170e89a8115336f25d566645aab37f8eaf7 Mon Sep 17 00:00:00 2001
From: Arjun Komath <arjunkomath@gmail.com>
Date: Wed, 1 Jul 2026 19:28:49 +1000
Subject: [PATCH 6/6] Improve server services list layout and profile dropdown
 styling

Show environment inline with project name instead of stacked, and make
the user's name more prominent (and the dropdown wider) in the nav menu.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 web/app/(dashboard)/layout-client.tsx     | 10 ++++++++--
 web/components/server/server-services.tsx |  6 +++---
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/web/app/(dashboard)/layout-client.tsx b/web/app/(dashboard)/layout-client.tsx
index 606c47c7..1bbc205b 100644
--- a/web/app/(dashboard)/layout-client.tsx
+++ b/web/app/(dashboard)/layout-client.tsx
@@ -119,10 +119,16 @@ function DashboardHeader({
 					>
 						<User className="size-4" />
 					</DropdownMenuTrigger>
-					<DropdownMenuContent align="end" sideOffset={8}>
+					<DropdownMenuContent
+						align="end"
+						sideOffset={8}
+						className="w-40"
+					>
 						<DropdownMenuGroup>
 							<DropdownMenuLabel>
-								<span className="block font-medium">{name}</span>
+								<span className="block truncate text-sm font-semibold">
+									{name}
+								</span>
 								<span className="block truncate text-xs font-normal text-muted-foreground">
 									{email}
 								</span>
diff --git a/web/components/server/server-services.tsx b/web/components/server/server-services.tsx
index ac75e0bb..1b1240fb 100644
--- a/web/components/server/server-services.tsx
+++ b/web/components/server/server-services.tsx
@@ -34,11 +34,11 @@ export async function ServerServices({ serverId }: { serverId: string }) {
 				<div className="space-y-5">
 					{groups.map((group) => (
 						<div key={group.key} className="space-y-2">
-							<div>
+							<div className="flex items-center gap-2">
 								<p className="font-medium text-sm">{group.projectName}</p>
-								<p className="text-xs text-muted-foreground">
+								<span className="text-xs text-muted-foreground">
 									{group.environmentName}
-								</p>
+								</span>
 							</div>
 							<div className="divide-y rounded-lg border">
 								{group.services.map((service) => (