add want create page

databuild/http_server.rs

@@ -3,8 +3,8 @@ use crate::build_state::BuildState;
 use crate::commands::Command;
 use crate::web::templates::{
     BaseContext, HomePage, JobRunDetailPage, JobRunDetailView, JobRunsListPage,
-    PartitionDetailPage, PartitionDetailView, PartitionsListPage, WantDetailPage, WantDetailView,
+    PartitionDetailPage, PartitionDetailView, PartitionsListPage, WantCreatePage, WantDetailPage,
-    WantsListPage,
+    WantDetailView, WantsListPage,
 };
 use crate::{
     CancelWantRequest, CreateWantRequest, CreateWantResponse, GetWantRequest, GetWantResponse,
@@ -99,6 +99,7 @@ pub fn create_router(state: AppState) -> Router {
         // HTML pages
         .route("/", get(home_page))
         .route("/wants", get(wants_list_page))
+        .route("/wants/create", get(want_create_page))
         .route("/wants/:id", get(want_detail_page))
         .route("/partitions", get(partitions_list_page))
         .route("/partitions/*id", get(partition_detail_page))
@@ -276,6 +277,18 @@ async fn want_detail_page(
     }
 }
 
+/// Want create page
+async fn want_create_page() -> impl IntoResponse {
+    let template = WantCreatePage {
+        base: BaseContext::default(),
+    };
+
+    match template.render() {
+        Ok(html) => Html(html).into_response(),
+        Err(e) => Html(format!("<h1>Template error: {}</h1>", e)).into_response(),
+    }
+}
+
 /// Partitions list page
 async fn partitions_list_page(
     State(state): State<AppState>,

databuild/web/templates.rs

@@ -351,3 +351,13 @@ pub struct JobRunDetailPage {
     pub base: BaseContext,
     pub job_run: JobRunDetailView,
 }
+
+// =============================================================================
+// Want Create Page
+// =============================================================================
+
+#[derive(Template)]
+#[template(ext = "html", path = "wants/create.html")]
+pub struct WantCreatePage {
+    pub base: BaseContext,
+}

databuild/web/templates/base.html

@@ -165,6 +165,54 @@
         .partition-list li { padding: .25rem 0 }
         .partition-list a { color: var(--color-brand); text-decoration: none }
         .partition-list a:hover { text-decoration: underline }
+
+        /* Forms */
+        .form-section {
+            background: var(--color-surface);
+            border: 1px solid var(--color-border);
+            border-radius: .5rem;
+            padding: 1rem;
+            margin-bottom: 1rem;
+        }
+        .form-section h2 { font-size: .875rem; font-weight: 500; color: var(--color-text-muted); margin-bottom: .75rem }
+        .form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 1rem }
+        .form-field { margin-bottom: .75rem }
+        .form-field:last-child { margin-bottom: 0 }
+        .form-field label { display: block; font-size: .75rem; color: var(--color-text-muted); margin-bottom: .25rem }
+        .form-field input, .form-field textarea {
+            width: 100%;
+            padding: .5rem .75rem;
+            border: 1px solid var(--color-border);
+            border-radius: .25rem;
+            font-size: .875rem;
+            font-family: inherit;
+        }
+        .form-field input:focus, .form-field textarea:focus {
+            outline: none;
+            border-color: var(--color-brand);
+        }
+        .form-field small { display: block; font-size: .75rem; color: var(--color-text-muted); margin-top: .25rem }
+        .btn-primary {
+            display: inline-block;
+            padding: .5rem 1rem;
+            background: var(--color-brand);
+            color: #fff;
+            border: none;
+            border-radius: .25rem;
+            font-size: .875rem;
+            font-weight: 500;
+            cursor: pointer;
+            text-decoration: none;
+        }
+        .btn-primary:hover { background: #e07b2a }
+        .error-message {
+            background: #fee2e2;
+            color: #991b1b;
+            padding: .75rem 1rem;
+            border-radius: .25rem;
+            margin-bottom: 1rem;
+            font-size: .875rem;
+        }
     </style>
 </head>
 <body>

databuild/web/templates/wants/list.html

@@ -3,7 +3,10 @@
 {% call base::head("Wants - DataBuild") %}
 {% call base::nav("wants", base.graph_label) %}
 
-<h1>Wants</h1>
+<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem">
+    <h1 style="margin-bottom:0">Wants</h1>
+    <a href="/wants/create" class="btn-primary">Create Want</a>
+</div>
 
 <table>
     <thead>