roachprod: add web UI for cluster management

This commit introduces a new web-based UI for roachprod, providing an
intuitive interface for managing CockroachDB clusters. Previously, all
roachprod operations required command-line usage, which could be cumbersome
for common workflows like viewing cluster status, creating clusters, and
managing cluster lifecycle.

The new UI is accessible via `roachprod ui` and provides:

**Cluster Management:**
- List all clusters or filter to show only user's clusters
- View cluster details: nodes, lifetime remaining, cloud provider, machine type
- Create new clusters with an interactive modal
- Delete, extend, start, stop, stage, and wipe clusters
- Real-time cluster status with node-level information
- Access to Admin UI and PostgreSQL connection strings

**Interactive Terminals:**
- SSH terminal access to cluster nodes via WebSocket
- SQL console for direct database interaction
- Backend console showing roachprod command output

**Cloud Provider Integration:**
- Dynamic machine type and zone selection based on cloud provider
- Queries GCE, AWS, and Azure APIs for up-to-date options
- Displays machine specifications (vCPUs, RAM) alongside each type
- Intelligent sorting by machine class and size
- Multi-zone selection for geo-distributed clusters

**User Experience:**
- Real-time notifications for operations
- Confetti celebration when clusters are created successfully
- Split-panel layout with cluster list and terminal/console views
- Loading states and error handling throughout

**Technical Implementation:**
Backend (Go):
- Embedded web server with HTTP and WebSocket handlers
- REST API for cluster operations (/api/clusters/*, /api/cloud-providers/*)
- WebSocket endpoints for SSH and SQL console streaming
- Integration with existing roachprod cluster management functions
- UI assets embedded in binary via Bazel

Frontend (React + TypeScript):
- Ant Design component library for consistent UI
- XTerm.js for terminal emulation
- Real-time WebSocket communication for terminals
- Notification system with drawer interface
- Split panel layout

The UI is launched with `roachprod ui [--port 8080]` and opens automatically
in the default browser.

Release note: none

Epic: None

Author: ajstorm

.bazelignore

@@ -11,5 +11,6 @@ pkg/ui/workspaces/db-console/ccl/src/js/node_modules
 pkg/ui/workspaces/e2e-tests/node_modules
 pkg/ui/workspaces/eslint-plugin-crdb/node_modules
 pkg/ui/workspaces/crdb-api-client/node_modules
+pkg/ui/workspaces/roachprod-ui/node_modules
 tmp
 vendor

.gitignore

@@ -66,3 +66,5 @@ pkg/testutils/serverutils/*_generated.go
 .DS_Store
 .idea/
 .vscode/
+/pkg/roachprod/ui/dist/
+/pkg/roachprod/ui/assets.tar.zst

WORKSPACE

@@ -307,6 +307,7 @@ npm_translate_lock(
         "//pkg/ui/workspaces/db-console/src/js:package.json",
         "//pkg/ui/workspaces/e2e-tests:package.json",
         "//pkg/ui/workspaces/eslint-plugin-crdb:package.json",
+        "//pkg/ui/workspaces/roachprod-ui:package.json",
     ],
     npmrc = "//pkg/ui:.npmrc.bazel",
     patch_args = {

pkg/cmd/roachprod/cli/commands.go

@@ -2256,3 +2256,30 @@ If a destination is not provided, the certs will be downloaded to a default %s d
 		}),
 	}
 }
+
+func (cr *commandRegistry) buildUICmd() *cobra.Command {
+	uiCmd := &cobra.Command{
+		Use:   "ui",
+		Short: "start the roachprod web UI",
+		Long: `Start a web-based user interface for managing roachprod clusters.
+
+The UI provides a graphical interface for:
+  - Listing and filtering clusters
+  - Creating new clusters with a wizard
+  - Deleting clusters
+  - Extending cluster lifetimes
+  - SSH access to cluster nodes via an interactive terminal
+
+The UI server will start on the specified port (default 7763) and can be
+accessed via a web browser at http://localhost:<port>.
+
+Press Ctrl+C to stop the server.
+`,
+		Args: cobra.NoArgs,
+		Run: Wrap(func(cmd *cobra.Command, args []string) error {
+			return roachprod.StartUIServer(uiPort)
+		}),
+	}
+	uiCmd.Flags().IntVarP(&uiPort, "port", "p", 7763, "Port for the web UI server")
+	return uiCmd
+}

pkg/cmd/roachprod/cli/flags.go

@@ -98,6 +98,8 @@ var (
 
 	grafanaTags         []string
 	grafanaDashboardUID string
+
+	uiPort int
 	grafanaTimeRange    []int64
 
 	sshKeyUser string

pkg/cmd/roachprod/cli/resgistry.go

@@ -73,5 +73,6 @@ func (cr *commandRegistry) register() {
 		cr.buildFetchLogsCmd(),
 		cr.buildGetLatestPProfCmd(),
 		cr.buildFetchCertsDir(),
+		cr.buildUICmd(),
 	})
 }

pkg/gen/misc.bzl

@@ -13,6 +13,7 @@ MISC_SRCS = [
     "//pkg/kv/kvserver/spanlatch:latch_interval_btree_test.go",
     "//pkg/roachprod/agents/opentelemetry:cockroachdb_metrics.go",
     "//pkg/roachprod/install:types_generated.go",
+    "//pkg/roachprod/ui:assets.tar.zst",
     "//pkg/roachprod/vm/aws:terraform/main.tf",
     "//pkg/spanconfig/spanconfigstore:entry_interval_btree.go",
     "//pkg/spanconfig/spanconfigstore:entry_interval_btree_test.go",

pkg/roachprod/BUILD.bazel

@@ -9,6 +9,8 @@ go_library(
         "node_stability.go",
         "roachprod.go",
         "roachprod_pprof.go",
+        "ui.go",
+        "ui_cluster_manager.go",
     ],
     importpath = "github.com/cockroachdb/cockroach/pkg/roachprod",
     visibility = ["//visibility:public"],
@@ -26,6 +28,7 @@ go_library(
         "//pkg/roachprod/logger",
         "//pkg/roachprod/prometheus",
         "//pkg/roachprod/promhelperclient",
+        "//pkg/roachprod/ui",
         "//pkg/roachprod/vm",
         "//pkg/roachprod/vm/aws",
         "//pkg/roachprod/vm/azure",
@@ -41,6 +44,7 @@ go_library(
         "//pkg/util/timeutil",
         "@com_github_cockroachdb_errors//:errors",
         "@com_github_cockroachdb_errors//oserror",
+        "@com_github_creack_pty//:pty",
         "@org_golang_x_sys//unix",
     ],
 )