fix(ui): give the pending devices count a page to land on

openapi/spec/paths/admin@api@stats.yaml

@@ -34,7 +34,9 @@ get:
                 type: integer
                 minimum: 0
               pending_devices:
-                description: Number of pending devices.
+                description: >-
+                  Number of devices awaiting a decision, excluding containers, so the count
+                  matches the device list it is read alongside.
                 type: integer
                 minimum: 0
               rejected_devices:

openapi/spec/paths/api@stats.yaml

@@ -25,7 +25,9 @@ get:
                 type: integer
                 minimum: 0
               pending_devices:
-                description: Number of pending devices
+                description: >-
+                  Number of devices awaiting a decision, excluding containers, so the count
+                  matches the device list this endpoint's consumers page through.
                 type: integer
                 minimum: 0
               rejected_devices:

server/api/store/pg/stats.go

@@ -98,7 +98,8 @@ func buildRegisteredDevicesQuery(db bun.IDB) *bun.SelectQuery {
 func buildPendingDevicesQuery(db bun.IDB) *bun.SelectQuery {
 	return db.NewSelect().
 		Model((*entity.Device)(nil)).
-		Where("status = ?", "pending")
+		Where("status = ?", "pending").
+		Where("platform <> ?", "connector")
 }
 
 func buildRejectedDevicesQuery(db bun.IDB) *bun.SelectQuery {

server/api/store/storetest/helpers.go

@@ -187,6 +187,14 @@ func WithDeviceStatus(status models.DeviceStatus) DeviceOption {
 	}
 }
 
+// WithDevicePlatform sets the device platform, which is what distinguishes a container
+// (platform "connector") from a plain device.
+func WithDevicePlatform(platform string) DeviceOption {
+	return func(d *models.Device) {
+		d.Info.Platform = platform
+	}
+}
+
 // WithDevicePublicKey sets the device public key
 func WithDevicePublicKey(publicKey string) DeviceOption {
 	return func(d *models.Device) {

server/api/store/storetest/stats_tests.go

@@ -37,6 +37,20 @@ func (s *Suite) TestGetStats(t *testing.T) {
 		assert.Equal(t, 1, stats.PendingDevices)
 	})
 
+	t.Run("counts pending devices without pending containers", func(t *testing.T) {
+		require.NoError(t, s.provider.CleanDatabase(t))
+
+		tenant := s.CreateNamespace(t)
+		s.CreateDevice(t, WithTenantID(tenant), WithDeviceStatus("pending"))
+		s.CreateDevice(t, WithTenantID(tenant), WithDeviceStatus("pending"), WithDevicePlatform("connector"))
+
+		stats, err := st.GetStats(ctx, scope.MustBounded(tenant))
+		require.NoError(t, err)
+		require.NotNil(t, stats)
+
+		assert.Equal(t, 1, stats.PendingDevices)
+	})
+
 	t.Run("succeeds with specific tenantID", func(t *testing.T) {
 		require.NoError(t, s.provider.CleanDatabase(t))
 

ui/apps/console/src/App.tsx

@@ -39,6 +39,7 @@ const SSHIdentities = lazy(() => import("./pages/ssh-identities"));
 const DeviceDetails = lazy(() => import("./pages/DeviceDetails"));
 const AddDevice = lazy(() => import("./pages/AddDevice"));
 const Install = lazy(() => import("./pages/install"));
+const PendingDevices = lazy(() => import("./pages/PendingDevices"));
 const SSHApproval = lazy(() => import("./pages/SSHApproval"));
 const Team = lazy(() => import("./pages/team"));
 const InstallKeys = lazy(() => import("./pages/install-keys"));
@@ -235,6 +236,7 @@ export default function App() {
                   />
                   <Route path="/dashboard" element={<Dashboard />} />
                   <Route path="/devices" element={<Devices />} />
+                  <Route path="/pending-devices" element={<PendingDevices />} />
                   <Route path="/devices/add" element={<AddDevice />} />
                   <Route path="/devices/:uid" element={<DeviceDetails />} />
                   <Route path="/containers" element={<Containers />} />

ui/apps/console/src/components/layout/Sidebar.tsx

@@ -8,6 +8,7 @@ import {
   KeyIcon,
   Cog6ToothIcon,
   UsersIcon,
+  ClockIcon,
   CpuChipIcon,
   CommandLineIcon,
   LockClosedIcon,
@@ -44,6 +45,11 @@ function buildSections(isIdentityMode: boolean): NavSection[] {
       label: "Devices",
       icon: <CpuChipIcon className={navIcon} />,
     },
+    {
+      to: "/pending-devices",
+      label: "Pending",
+      icon: <ClockIcon className={navIcon} />,
+    },
     {
       to: "/containers",
       label: "Containers",

ui/apps/console/src/hooks/useContainers.ts

@@ -38,6 +38,7 @@ interface UseContainersParams {
   filterTags?: string[];
   sortBy?: string;
   orderBy?: "asc" | "desc";
+  enabled?: boolean;
 }
 
 /**
@@ -51,6 +52,7 @@ export function useContainers({
   filterTags = [],
   sortBy = "last_seen",
   orderBy = "desc",
+  enabled = true,
 }: UseContainersParams = {}) {
   const query: GetContainersData["query"] = { page, per_page: perPage };
   if (status) query.status = status;
@@ -64,6 +66,7 @@ export function useContainers({
   const result = useQuery<PaginatedResult<Device>>({
     queryKey: getContainersQueryKey(options),
     queryFn: paginatedQueryFn(getContainersSdk, options),
+    enabled,
   });
 
   const containers = useMemo(

ui/apps/console/src/hooks/useEnrollmentSource.ts

@@ -0,0 +1,35 @@
+import { useCallback } from "react";
+import { useInstallKeys } from "@/hooks/useInstallKeys";
+import {
+  resolveEnrollmentSource,
+  type EnrollmentSource,
+} from "@/pages/install-keys/helpers";
+
+const INSTALL_KEYS_PER_PAGE = 100;
+
+/**
+ * A resolver from a device's install key digest to the source that enrolled it, for a caller
+ * resolving more than one device: it subscribes to the namespace's keys once, where calling
+ * useEnrollmentSource per row would subscribe once per row.
+ *
+ * The lookup is client-side over a single page of keys, so a namespace with more than
+ * INSTALL_KEYS_PER_PAGE of them resolves its tail to null rather than to a name.
+ */
+export function useEnrollmentSourceResolver(): (
+  installKeyId: string | undefined,
+) => EnrollmentSource | null {
+  const { installKeys } = useInstallKeys({ perPage: INSTALL_KEYS_PER_PAGE });
+
+  return useCallback(
+    (installKeyId: string | undefined) =>
+      resolveEnrollmentSource(installKeyId, installKeys),
+    [installKeys],
+  );
+}
+
+/** The same resolution for a single device. Returns null when the key is not resolvable. */
+export function useEnrollmentSource(
+  installKeyId: string | undefined,
+): EnrollmentSource | null {
+  return useEnrollmentSourceResolver()(installKeyId);
+}

ui/apps/console/src/pages/AddDevice.tsx

@@ -529,10 +529,10 @@ export default function AddDevice() {
           <div className="text-xs text-text-secondary leading-relaxed">
             After installing, your device will appear in the{" "}
             <Link
-              to="/devices?status=pending"
+              to="/pending-devices"
               className="text-primary font-medium hover:text-primary/80 transition-colors"
             >
-              Pending tab
+              pending list
             </Link>{" "}
             and must be accepted before you can connect to it.
           </div>

ui/apps/console/src/pages/Dashboard.tsx

@@ -1,4 +1,3 @@
-import { useNavigate } from "react-router-dom";
 import {
   ClockIcon,
   Squares2X2Icon,
@@ -8,6 +7,7 @@ import {
 import { useNamespace } from "@/hooks/useNamespaces";
 import { useAuthStore } from "@/stores/authStore";
 import { useStats } from "@/hooks/useStats";
+import { useContainers } from "@/hooks/useContainers";
 import { hasAnyDevices } from "@/utils/stats";
 import PageHeader from "@/components/common/PageHeader";
 import StatCard from "@/components/common/StatCard";
@@ -24,18 +24,17 @@ export default function Dashboard() {
   const tenantId = useAuthStore((s) => s.tenant) ?? "";
   const { namespace: currentNamespace } = useNamespace(tenantId);
   const { stats, isLoading: statsLoading, error: statsError } = useStats();
-  const navigate = useNavigate();
 
-  if (statsLoading) return null;
+  const looksEmpty = !statsError && !!stats && !hasAnyDevices(stats);
+  const { totalCount: containerCount, isLoading: containersLoading } =
+    useContainers({ perPage: 1, enabled: looksEmpty });
 
-  if (!statsError && stats && !hasAnyDevices(stats) && currentNamespace) {
+  if (statsLoading || (looksEmpty && containersLoading)) return null;
+
+  if (looksEmpty && containerCount === 0 && currentNamespace) {
     return <WelcomeScreen namespaceName={currentNamespace.name} />;
   }
 
-  const goToPending = () => {
-    void navigate("/devices?status=pending");
-  };
-
   return (
     <div>
       <PageHeader
@@ -88,8 +87,8 @@ export default function Dashboard() {
             icon={<ClockIcon className="w-7 h-7" />}
             title="Pending Devices"
             value={stats?.pending_devices ?? "--"}
-            linkLabel="View pending"
-            onClick={goToPending}
+            linkLabel="Review pending"
+            linkTo="/pending-devices"
             accent="text-accent-yellow"
           />
         </div>

ui/apps/console/src/pages/DeviceDetails.tsx

@@ -16,8 +16,7 @@ import {
   useRemoveDeviceTag,
 } from "../hooks/useDeviceMutations";
 import { useNamespace } from "../hooks/useNamespaces";
-import { useInstallKeys } from "../hooks/useInstallKeys";
-import { resolveEnrollmentSource } from "@/pages/install-keys/helpers";
+import { useEnrollmentSource } from "@/hooks/useEnrollmentSource";
 import { DeprecatedBadge } from "@/pages/install-keys/StatusChip";
 import { useAuthStore } from "../stores/authStore";
 import { useTerminalStore } from "../stores/terminalStore";
@@ -48,9 +47,9 @@ export default function DeviceDetails() {
   const navigate = useNavigate();
   const [searchParams] = useSearchParams();
   const { device, isLoading, error } = useDevice(uid ?? "");
+  const enrollment = useEnrollmentSource(device?.install_key_id);
   const tenantId = useAuthStore((s) => s.tenant) ?? "";
   const { namespace: currentNamespace } = useNamespace(tenantId);
-  const { installKeys } = useInstallKeys({ perPage: 100 });
   const existingSession = useTerminalStore((s) =>
     s.sessions.find((sess) => sess.deviceUid === uid),
   );
@@ -108,11 +107,6 @@ export default function DeviceDetails() {
   const nsName = currentNamespace?.name ?? "";
   const sshid = nsName ? buildSshid(nsName, device.name) : device.uid;
 
-  const enrollment = resolveEnrollmentSource(
-    device.install_key_id,
-    installKeys,
-  );
-
   const tags: string[] = Array.isArray(device.tags)
     ? device.tags.map((t) =>
         typeof t === "object" && t !== null && "name" in t ? t.name : String(t),