feat: add ComponentGrid and ComponentTable components for displaying components in grid and table formats

feat: implement HealthBadge and RoleBadge components for displaying health status and roles

feat: create LogViewer component for streaming logs of services

feat: develop SecretsEditor for managing secrets with CRUD operations

feat: introduce ToolCard component for displaying tool information

style: add global CSS variables and styles for consistent theming

feat: set up API client for handling requests to the backend

feat: implement hooks for fetching components, statuses, and tools

feat: create routes for dashboard, component details, and tools

feat: add service management endpoints for starting, stopping, and restarting services

feat: implement event bus for handling real-time updates via SSE

feat: create health check and logs endpoints for monitoring services

feat: add tests for health and tools endpoints to ensure functionality

chore: update project configuration files and dependencies for better development experience

app/src/lib/labels.ts

@@ -0,0 +1,22 @@
+export const RUNNER_LABELS: Record<string, string> = {
+  python_uv_tool: "Python (uv)",
+  command: "Command",
+  python_module: "Python module",
+  container: "Container",
+  node: "Node.js",
+  remote: "Remote",
+}
+
+export const ROLE_DESCRIPTIONS: Record<string, string> = {
+  service: "Exposes HTTP endpoints",
+  tool: "CLI utility installed to PATH",
+  worker: "Background process (no HTTP)",
+  job: "Runs on a schedule",
+  frontend: "Built static assets",
+  remote: "Hosted externally",
+  containerized: "Runs in a container",
+}
+
+export function runnerLabel(runner: string): string {
+  return RUNNER_LABELS[runner] ?? runner
+}

app/src/lib/queryClient.ts

@@ -0,0 +1,11 @@
+import { QueryClient } from "@tanstack/react-query"
+
+export const queryClient = new QueryClient({
+  defaultOptions: {
+    queries: {
+      staleTime: 30 * 1000,
+      gcTime: 5 * 60 * 1000,
+      retry: 1,
+    },
+  },
+})

app/src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}