feat: add edit page route handlers, template structs, and edit templates

Add edit page handlers for all 7 entities (roaster, roast, bag, brew,
cafe, cup, gear) with authentication, data pre-loading, and image URL
resolution. Register edit routes in app router. Add corresponding
template structs and HTML templates with pre-populated forms.

src/application/routes/app/bags.rs

@@ -3,12 +3,14 @@ use axum::http::StatusCode;
 use axum::response::{IntoResponse, Response};
 use tower_cookies::Cookies;
 
+use crate::application::auth::AuthenticatedUser;
 use crate::application::errors::map_app_error;
 use crate::application::routes::api::images::resolve_image_url;
 use crate::application::routes::render_html;
+use crate::application::routes::support::load_roast_options;
 use crate::application::state::AppState;
 use crate::domain::ids::BagId;
-use crate::presentation::web::templates::BagDetailTemplate;
+use crate::presentation::web::templates::{BagDetailTemplate, BagEditTemplate};
 use crate::presentation::web::views::BagDetailView;
 
 #[tracing::instrument(skip(state, cookies))]
@@ -55,3 +57,36 @@ pub(crate) async fn bag_detail_page(
 
     render_html(template).map(IntoResponse::into_response)
 }
+
+#[tracing::instrument(skip(state, _auth_user))]
+pub(crate) async fn bag_edit_page(
+    State(state): State<AppState>,
+    _auth_user: AuthenticatedUser,
+    Path(id): Path<BagId>,
+) -> Result<Response, StatusCode> {
+    let bag = state
+        .bag_repo
+        .get_with_roast(id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let roast_options = load_roast_options(&state).await.map_err(map_app_error)?;
+
+    let template = BagEditTemplate {
+        nav_active: "",
+        is_authenticated: true,
+        version_info: &crate::VERSION_INFO,
+        id: bag.bag.id.to_string(),
+        roast_id: bag.bag.roast_id.to_string(),
+        roast_label: format!("{} ({})", bag.roast_name, bag.roaster_name),
+        roast_date: bag
+            .bag
+            .roast_date
+            .map(|d| d.to_string())
+            .unwrap_or_default(),
+        amount: bag.bag.amount,
+        roast_options,
+    };
+
+    render_html(template).map(IntoResponse::into_response)
+}

src/application/routes/app/brews.rs

@@ -3,12 +3,14 @@ use axum::http::StatusCode;
 use axum::response::{IntoResponse, Response};
 use tower_cookies::Cookies;
 
+use crate::application::auth::AuthenticatedUser;
 use crate::application::errors::map_app_error;
+use crate::application::routes::api::brews::load_brew_form_data;
 use crate::application::routes::api::images::resolve_image_url;
 use crate::application::routes::render_html;
 use crate::application::state::AppState;
 use crate::domain::ids::BrewId;
-use crate::presentation::web::templates::BrewDetailTemplate;
+use crate::presentation::web::templates::{BrewDetailTemplate, BrewEditTemplate};
 use crate::presentation::web::views::BrewDetailView;
 
 #[tracing::instrument(skip(state, cookies))]
@@ -63,3 +65,56 @@ pub(crate) async fn brew_detail_page(
 
     render_html(template).map(IntoResponse::into_response)
 }
+
+#[tracing::instrument(skip(state, _auth_user))]
+pub(crate) async fn brew_edit_page(
+    State(state): State<AppState>,
+    _auth_user: AuthenticatedUser,
+    Path(id): Path<BrewId>,
+) -> Result<Response, StatusCode> {
+    let brew = state
+        .brew_repo
+        .get_with_details(id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let form_data = load_brew_form_data(&state).await.map_err(map_app_error)?;
+
+    let image_url = resolve_image_url(&state, "brew", i64::from(id)).await;
+
+    let template = BrewEditTemplate {
+        nav_active: "",
+        is_authenticated: true,
+        version_info: &crate::VERSION_INFO,
+        id: brew.brew.id.to_string(),
+        bag_id: brew.brew.bag_id.to_string(),
+        bag_label: format!("{} ({})", brew.roast_name, brew.roaster_name),
+        coffee_weight: brew.brew.coffee_weight,
+        grinder_id: brew.brew.grinder_id.to_string(),
+        grind_setting: brew.brew.grind_setting,
+        brewer_id: brew.brew.brewer_id.to_string(),
+        filter_paper_id: brew
+            .brew
+            .filter_paper_id
+            .map(|id| id.to_string())
+            .unwrap_or_default(),
+        water_volume: brew.brew.water_volume,
+        water_temp: brew.brew.water_temp,
+        brew_time: brew.brew.brew_time.unwrap_or(0),
+        quick_notes: brew
+            .brew
+            .quick_notes
+            .iter()
+            .map(|n| n.form_value())
+            .collect::<Vec<_>>()
+            .join(","),
+        bag_options: form_data.bag_options,
+        grinder_options: form_data.grinder_options,
+        brewer_options: form_data.brewer_options,
+        filter_paper_options: form_data.filter_paper_options,
+        quick_note_options: form_data.quick_note_options,
+        image_url,
+    };
+
+    render_html(template).map(IntoResponse::into_response)
+}

src/application/routes/app/cafes.rs

@@ -3,11 +3,13 @@ use axum::http::StatusCode;
 use axum::response::{IntoResponse, Response};
 use tower_cookies::Cookies;
 
+use crate::application::auth::AuthenticatedUser;
 use crate::application::errors::map_app_error;
 use crate::application::routes::api::images::resolve_image_url;
 use crate::application::routes::render_html;
 use crate::application::state::AppState;
-use crate::presentation::web::templates::CafeDetailTemplate;
+use crate::domain::ids::CafeId;
+use crate::presentation::web::templates::{CafeDetailTemplate, CafeEditTemplate};
 use crate::presentation::web::views::CafeDetailView;
 
 #[tracing::instrument(skip(state, cookies))]
@@ -41,3 +43,34 @@ pub(crate) async fn cafe_detail_page(
 
     render_html(template).map(IntoResponse::into_response)
 }
+
+#[tracing::instrument(skip(state, _auth_user))]
+pub(crate) async fn cafe_edit_page(
+    State(state): State<AppState>,
+    _auth_user: AuthenticatedUser,
+    Path(id): Path<CafeId>,
+) -> Result<Response, StatusCode> {
+    let cafe = state
+        .cafe_repo
+        .get(id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let image_url = resolve_image_url(&state, "cafe", i64::from(id)).await;
+
+    let template = CafeEditTemplate {
+        nav_active: "",
+        is_authenticated: true,
+        version_info: &crate::VERSION_INFO,
+        id: cafe.id.to_string(),
+        name: cafe.name,
+        city: cafe.city,
+        country: cafe.country,
+        latitude: cafe.latitude,
+        longitude: cafe.longitude,
+        website: cafe.website.unwrap_or_default(),
+        image_url,
+    };
+
+    render_html(template).map(IntoResponse::into_response)
+}

src/application/routes/app/cups.rs

@@ -3,12 +3,14 @@ use axum::http::StatusCode;
 use axum::response::{IntoResponse, Response};
 use tower_cookies::Cookies;
 
+use crate::application::auth::AuthenticatedUser;
 use crate::application::errors::map_app_error;
 use crate::application::routes::api::images::resolve_image_url;
 use crate::application::routes::render_html;
+use crate::application::routes::support::{load_cafe_options, load_roast_options};
 use crate::application::state::AppState;
 use crate::domain::ids::CupId;
-use crate::presentation::web::templates::CupDetailTemplate;
+use crate::presentation::web::templates::{CupDetailTemplate, CupEditTemplate};
 use crate::presentation::web::views::CupDetailView;
 
 #[tracing::instrument(skip(state, cookies))]
@@ -70,3 +72,40 @@ pub(crate) async fn cup_detail_page(
 
     render_html(template).map(IntoResponse::into_response)
 }
+
+#[tracing::instrument(skip(state, _auth_user))]
+pub(crate) async fn cup_edit_page(
+    State(state): State<AppState>,
+    _auth_user: AuthenticatedUser,
+    Path(id): Path<CupId>,
+) -> Result<Response, StatusCode> {
+    let cup = state
+        .cup_repo
+        .get_with_details(id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let (roast_options, cafe_options) =
+        tokio::try_join!(async { load_roast_options(&state).await }, async {
+            load_cafe_options(&state).await
+        },)
+        .map_err(map_app_error)?;
+
+    let image_url = resolve_image_url(&state, "cup", i64::from(id)).await;
+
+    let template = CupEditTemplate {
+        nav_active: "",
+        is_authenticated: true,
+        version_info: &crate::VERSION_INFO,
+        id: cup.cup.id.to_string(),
+        roast_id: cup.cup.roast_id.to_string(),
+        roast_label: format!("{} ({})", cup.roast_name, cup.roaster_name),
+        cafe_id: cup.cup.cafe_id.to_string(),
+        cafe_label: format!("{}, {}", cup.cafe_name, cup.cafe_city),
+        roast_options,
+        cafe_options,
+        image_url,
+    };
+
+    render_html(template).map(IntoResponse::into_response)
+}

src/application/routes/app/gear.rs

@@ -3,12 +3,13 @@ use axum::http::StatusCode;
 use axum::response::{IntoResponse, Response};
 use tower_cookies::Cookies;
 
+use crate::application::auth::AuthenticatedUser;
 use crate::application::errors::map_app_error;
 use crate::application::routes::api::images::resolve_image_url;
 use crate::application::routes::render_html;
 use crate::application::state::AppState;
 use crate::domain::ids::GearId;
-use crate::presentation::web::templates::GearDetailTemplate;
+use crate::presentation::web::templates::{GearDetailTemplate, GearEditTemplate};
 use crate::presentation::web::views::GearDetailView;
 
 #[tracing::instrument(skip(state, cookies))]
@@ -41,3 +42,31 @@ pub(crate) async fn gear_detail_page(
 
     render_html(template).map(IntoResponse::into_response)
 }
+
+#[tracing::instrument(skip(state, _auth_user))]
+pub(crate) async fn gear_edit_page(
+    State(state): State<AppState>,
+    _auth_user: AuthenticatedUser,
+    Path(id): Path<GearId>,
+) -> Result<Response, StatusCode> {
+    let gear = state
+        .gear_repo
+        .get(id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let image_url = resolve_image_url(&state, "gear", i64::from(id)).await;
+
+    let template = GearEditTemplate {
+        nav_active: "",
+        is_authenticated: true,
+        version_info: &crate::VERSION_INFO,
+        id: gear.id.to_string(),
+        category: gear.category.display_label().to_string(),
+        make: gear.make,
+        model: gear.model,
+        image_url,
+    };
+
+    render_html(template).map(IntoResponse::into_response)
+}

src/application/routes/app/mod.rs

@@ -35,15 +35,22 @@ pub(super) fn router() -> axum::Router<AppState> {
         .route("/timeline", get(timeline::timeline_page))
         .route("/stats", get(stats::stats_page))
         .route("/bags/{id}", get(bags::bag_detail_page))
+        .route("/bags/{id}/edit", get(bags::bag_edit_page))
         .route("/brews/{id}", get(brews::brew_detail_page))
+        .route("/brews/{id}/edit", get(brews::brew_edit_page))
         .route("/cafes/{slug}", get(cafes::cafe_detail_page))
+        .route("/cafes/{id}/edit", get(cafes::cafe_edit_page))
         .route("/cups/{id}", get(cups::cup_detail_page))
+        .route("/cups/{id}/edit", get(cups::cup_edit_page))
         .route("/gear/{id}", get(gear::gear_detail_page))
+        .route("/gear/{id}/edit", get(gear::gear_edit_page))
         .route("/roasters/{slug}", get(roasters::roaster_detail_page))
+        .route("/roasters/{id}/edit", get(roasters::roaster_edit_page))
         .route(
             "/roasters/{roaster_slug}/roasts/{roast_slug}",
             get(roasts::roast_detail_page),
         )
+        .route("/roasts/{id}/edit", get(roasts::roast_edit_page))
         .route("/static/css/styles.css", get(styles))
         .route("/static/js/webauthn.js", get(webauthn_js))
         .route(

src/application/routes/app/roasters.rs

@@ -3,11 +3,13 @@ use axum::http::StatusCode;
 use axum::response::{IntoResponse, Response};
 use tower_cookies::Cookies;
 
+use crate::application::auth::AuthenticatedUser;
 use crate::application::errors::map_app_error;
 use crate::application::routes::api::images::resolve_image_url;
 use crate::application::routes::render_html;
 use crate::application::state::AppState;
-use crate::presentation::web::templates::RoasterDetailTemplate;
+use crate::domain::ids::RoasterId;
+use crate::presentation::web::templates::{RoasterDetailTemplate, RoasterEditTemplate};
 use crate::presentation::web::views::RoasterDetailView;
 
 #[tracing::instrument(skip(state, cookies))]
@@ -41,3 +43,32 @@ pub(crate) async fn roaster_detail_page(
 
     render_html(template).map(IntoResponse::into_response)
 }
+
+#[tracing::instrument(skip(state, _auth_user))]
+pub(crate) async fn roaster_edit_page(
+    State(state): State<AppState>,
+    _auth_user: AuthenticatedUser,
+    Path(id): Path<RoasterId>,
+) -> Result<Response, StatusCode> {
+    let roaster = state
+        .roaster_repo
+        .get(id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let image_url = resolve_image_url(&state, "roaster", i64::from(id)).await;
+
+    let template = RoasterEditTemplate {
+        nav_active: "",
+        is_authenticated: true,
+        version_info: &crate::VERSION_INFO,
+        id: roaster.id.to_string(),
+        name: roaster.name,
+        country: roaster.country,
+        city: roaster.city.unwrap_or_default(),
+        homepage: roaster.homepage.unwrap_or_default(),
+        image_url,
+    };
+
+    render_html(template).map(IntoResponse::into_response)
+}

src/application/routes/app/roasts.rs

@@ -3,11 +3,14 @@ use axum::http::StatusCode;
 use axum::response::{IntoResponse, Response};
 use tower_cookies::Cookies;
 
+use crate::application::auth::AuthenticatedUser;
 use crate::application::errors::map_app_error;
 use crate::application::routes::api::images::resolve_image_url;
 use crate::application::routes::render_html;
+use crate::application::routes::support::load_roaster_options;
 use crate::application::state::AppState;
-use crate::presentation::web::templates::RoastDetailTemplate;
+use crate::domain::ids::RoastId;
+use crate::presentation::web::templates::{RoastDetailTemplate, RoastEditTemplate};
 use crate::presentation::web::views::RoastDetailView;
 
 #[tracing::instrument(skip(state, cookies))]
@@ -48,3 +51,45 @@ pub(crate) async fn roast_detail_page(
 
     render_html(template).map(IntoResponse::into_response)
 }
+
+#[tracing::instrument(skip(state, _auth_user))]
+pub(crate) async fn roast_edit_page(
+    State(state): State<AppState>,
+    _auth_user: AuthenticatedUser,
+    Path(id): Path<RoastId>,
+) -> Result<Response, StatusCode> {
+    let roast = state
+        .roast_repo
+        .get(id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let roaster = state
+        .roaster_repo
+        .get(roast.roaster_id)
+        .await
+        .map_err(|e| map_app_error(e.into()))?;
+
+    let roaster_options = load_roaster_options(&state).await.map_err(map_app_error)?;
+
+    let image_url = resolve_image_url(&state, "roast", i64::from(id)).await;
+
+    let template = RoastEditTemplate {
+        nav_active: "",
+        is_authenticated: true,
+        version_info: &crate::VERSION_INFO,
+        id: roast.id.to_string(),
+        roaster_id: roast.roaster_id.to_string(),
+        roaster_name: roaster.name,
+        name: roast.name,
+        origin: roast.origin.unwrap_or_default(),
+        region: roast.region.unwrap_or_default(),
+        producer: roast.producer.unwrap_or_default(),
+        process: roast.process.unwrap_or_default(),
+        tasting_notes: roast.tasting_notes.join(", "),
+        roaster_options,
+        image_url,
+    };
+
+    render_html(template).map(IntoResponse::into_response)
+}

src/presentation/web/templates.rs

@@ -303,6 +303,126 @@ pub struct GearDetailTemplate {
     pub edit_url: String,
 }
 
+// ── Edit page templates ──
+
+#[derive(Template)]
+#[template(path = "pages/edit_roaster.html")]
+pub struct RoasterEditTemplate {
+    pub nav_active: &'static str,
+    pub is_authenticated: bool,
+    pub version_info: &'static crate::VersionInfo,
+    pub id: String,
+    pub name: String,
+    pub country: String,
+    pub city: String,
+    pub homepage: String,
+    pub image_url: Option<String>,
+}
+
+#[derive(Template)]
+#[template(path = "pages/edit_roast.html")]
+pub struct RoastEditTemplate {
+    pub nav_active: &'static str,
+    pub is_authenticated: bool,
+    pub version_info: &'static crate::VersionInfo,
+    pub id: String,
+    pub roaster_id: String,
+    pub roaster_name: String,
+    pub name: String,
+    pub origin: String,
+    pub region: String,
+    pub producer: String,
+    pub process: String,
+    pub tasting_notes: String,
+    pub roaster_options: Vec<RoasterOptionView>,
+    pub image_url: Option<String>,
+}
+
+#[derive(Template)]
+#[template(path = "pages/edit_bag.html")]
+pub struct BagEditTemplate {
+    pub nav_active: &'static str,
+    pub is_authenticated: bool,
+    pub version_info: &'static crate::VersionInfo,
+    pub id: String,
+    pub roast_id: String,
+    pub roast_label: String,
+    pub roast_date: String,
+    pub amount: f64,
+    pub roast_options: Vec<RoastOptionView>,
+}
+
+#[derive(Template)]
+#[template(path = "pages/edit_brew.html")]
+pub struct BrewEditTemplate {
+    pub nav_active: &'static str,
+    pub is_authenticated: bool,
+    pub version_info: &'static crate::VersionInfo,
+    pub id: String,
+    pub bag_id: String,
+    pub bag_label: String,
+    pub coffee_weight: f64,
+    pub grinder_id: String,
+    pub grind_setting: f64,
+    pub brewer_id: String,
+    pub filter_paper_id: String,
+    pub water_volume: i32,
+    pub water_temp: f64,
+    pub brew_time: i32,
+    pub quick_notes: String,
+    pub bag_options: Vec<BagOptionView>,
+    pub grinder_options: Vec<GearOptionView>,
+    pub brewer_options: Vec<GearOptionView>,
+    pub filter_paper_options: Vec<GearOptionView>,
+    pub quick_note_options: Vec<QuickNoteView>,
+    pub image_url: Option<String>,
+}
+
+#[derive(Template)]
+#[template(path = "pages/edit_cafe.html")]
+pub struct CafeEditTemplate {
+    pub nav_active: &'static str,
+    pub is_authenticated: bool,
+    pub version_info: &'static crate::VersionInfo,
+    pub id: String,
+    pub name: String,
+    pub city: String,
+    pub country: String,
+    pub latitude: f64,
+    pub longitude: f64,
+    pub website: String,
+    pub image_url: Option<String>,
+}
+
+#[derive(Template)]
+#[template(path = "pages/edit_cup.html")]
+pub struct CupEditTemplate {
+    pub nav_active: &'static str,
+    pub is_authenticated: bool,
+    pub version_info: &'static crate::VersionInfo,
+    pub id: String,
+    pub roast_id: String,
+    pub roast_label: String,
+    pub cafe_id: String,
+    pub cafe_label: String,
+    pub roast_options: Vec<RoastOptionView>,
+    pub cafe_options: Vec<CafeOptionView>,
+    pub image_url: Option<String>,
+}
+
+#[derive(Template)]
+#[template(path = "pages/edit_gear.html")]
+pub struct GearEditTemplate {
+    pub nav_active: &'static str,
+    pub is_authenticated: bool,
+    pub version_info: &'static crate::VersionInfo,
+    pub id: String,
+    pub category: String,
+    pub make: String,
+    pub model: String,
+    pub image_url: Option<String>,
+}
+
 #[derive(Template)]
 #[template(path = "partials/image_upload.html")]
 pub struct ImageUploadTemplate<'a> {

templates/pages/edit_bag.html

@@ -0,0 +1,99 @@
+{% extends "base.html" %}
+{% import "partials/icons.html" as icons %}
+{% block title %}Brewlog · Edit Bag{% endblock %}
+
+{% block content %}
+  <header class="flex flex-col gap-2">
+    <h1 class="text-3xl font-semibold">Edit Bag</h1>
+    <p class="max-w-2xl text-sm text-text-secondary">Update bag details.</p>
+  </header>
+
+  <section class="rounded-lg border bg-surface p-5">
+    <form
+      class="flex flex-col gap-4"
+      data-signals:_submitting="false"
+      data-signals:_submit-error="''"
+      data-signals:_roast-date="'{{ roast_date }}'"
+      data-signals:_amount="{{ amount }}"
+      data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/bags/{{ id }}')"
+      data-on:datastar-fetch="if (!$_submitting) return;
+        if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Bag updated'); window.location.href = evt.detail.response.headers.get('location') || '/bags/{{ id }}' }
+        else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
+    >
+      <div class="flex flex-col gap-1 text-sm">
+        <span
+          class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+          >Roast*</span
+        >
+        <searchable-select
+          name="roast_id"
+          placeholder="Type to search roasts&hellip;"
+          initial-value="{{ roast_id }}"
+        >
+          {% for roast in roast_options %}
+            <button
+              type="button"
+              value="{{ roast.id }}"
+              data-display="{{ roast.label }}"
+              class="w-full px-3 py-2 text-left text-sm hover:bg-surface-alt transition"
+            >
+              <span class="font-medium text-text">{{ roast.name }}</span>
+              <span class="ml-2 text-xs text-text-muted"
+                >{{ roast.roaster_name }}</span
+              >
+            </button>
+          {% endfor %}
+        </searchable-select>
+      </div>
+      <div class="grid gap-4 sm:grid-cols-2">
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Roast Date</span
+          >
+          <input
+            type="date"
+            name="roast_date"
+            class="input-field"
+            data-bind:_roast-date
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Amount (g)*</span
+          >
+          <input
+            type="number"
+            name="amount"
+            step="0.1"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="250"
+            data-bind:_amount
+          />
+        </label>
+      </div>
+      <p
+        data-show="$_submitError"
+        data-text="$_submitError"
+        style="display:none"
+        class="text-sm text-error"
+        role="alert"
+      ></p>
+      <div class="flex items-center justify-end">
+        <button
+          type="submit"
+          class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
+          data-attr:disabled="$_submitting"
+        >
+          <span data-show="$_submitting" style="display:none"
+            >{{ icons::spinner("h-4 w-4") }}</span
+          >
+          Save Changes
+        </button>
+      </div>
+    </form>
+  </section>
+{% endblock %}

templates/pages/edit_brew.html

@@ -0,0 +1,341 @@
+{% extends "base.html" %}
+{% import "partials/icons.html" as icons %}
+{% import "partials/image_section.html" as img %}
+{% block title %}Brewlog · Edit Brew{% endblock %}
+
+{% block content %}
+  <header class="flex flex-col gap-2">
+    <h1 class="text-3xl font-semibold">Edit Brew</h1>
+    <p class="max-w-2xl text-sm text-text-secondary">Update brew details.</p>
+  </header>
+
+  <section class="rounded-lg border bg-surface p-5">
+    <form
+      class="flex flex-col gap-6"
+      data-signals:_submitting="false"
+      data-signals:_submit-error="''"
+      data-signals:_coffee-weight="{{ coffee_weight }}"
+      data-signals:_grind-setting="{{ grind_setting }}"
+      data-signals:_water-volume="{{ water_volume }}"
+      data-signals:_water-temp="{{ water_temp }}"
+      data-signals:_brew-time="{{ brew_time }}"
+      data-signals:_quick-notes="'{{ quick_notes }}'"
+      data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/brews/{{ id }}')"
+      data-on:datastar-fetch="if (!$_submitting) return;
+        if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Brew updated'); window.location.href = evt.detail.response.headers.get('location') || '/brews/{{ id }}' }
+        else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
+    >
+      <!-- Coffee -->
+      <div>
+        <h4 class="text-sm font-semibold text-text mb-3">Coffee</h4>
+        <div class="grid gap-4 sm:grid-cols-2">
+          <div class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Bag*</span
+            >
+            <searchable-select
+              name="bag_id"
+              placeholder="Type to search bags&hellip;"
+              initial-value="{{ bag_id }}"
+            >
+              {% for bag in bag_options %}
+                <button
+                  type="button"
+                  value="{{ bag.id }}"
+                  data-display="{{ bag.roast_name }}"
+                  class="w-full px-3 py-2 text-left text-sm hover:bg-surface-alt transition"
+                >
+                  <span class="font-medium text-text"
+                    >{{ bag.roast_name }}</span
+                  >
+                  <span class="ml-2 text-xs text-text-muted"
+                    >{{ bag.roaster_name }} &middot; {{ bag.remaining }}</span
+                  >
+                </button>
+              {% endfor %}
+            </searchable-select>
+          </div>
+          <div class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Weight (g)*</span
+            >
+            <div class="flex items-center gap-2">
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_coffeeWeight = Math.max(1, Number($_coffeeWeight) - 0.5)"
+              >
+                -
+              </button>
+              <input
+                type="number"
+                name="coffee_weight"
+                step="any"
+                min="1"
+                required
+                aria-required="true"
+                class="input-field flex-1 text-center"
+                data-bind:_coffee-weight
+              />
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_coffeeWeight = Number($_coffeeWeight) + 0.5"
+              >
+                +
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Grinder -->
+      <div>
+        <h4 class="text-sm font-semibold text-text mb-3">Grinder</h4>
+        <div class="grid gap-4 sm:grid-cols-2">
+          <label class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Grinder*</span
+            >
+            <select
+              name="grinder_id"
+              required
+              aria-required="true"
+              class="input-field"
+            >
+              {% for grinder in grinder_options %}
+                <option
+                  value="{{ grinder.id }}"
+                  {% if grinder.id == grinder_id %}selected{% endif %}
+                >
+                  {{ grinder.label }}
+                </option>
+              {% endfor %}
+            </select>
+          </label>
+          <div class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Grind Setting*</span
+            >
+            <div class="flex items-center gap-2">
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_grindSetting = Math.max(0, Number($_grindSetting) - 0.5)"
+              >
+                -
+              </button>
+              <input
+                type="number"
+                name="grind_setting"
+                step="any"
+                min="0"
+                required
+                aria-required="true"
+                class="input-field flex-1 text-center"
+                data-bind:_grind-setting
+              />
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_grindSetting = Number($_grindSetting) + 0.5"
+              >
+                +
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Brewer -->
+      <div>
+        <h4 class="text-sm font-semibold text-text mb-3">Brewer</h4>
+        <div class="grid gap-4 sm:grid-cols-2">
+          <label class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Brewer*</span
+            >
+            <select
+              name="brewer_id"
+              required
+              aria-required="true"
+              class="input-field"
+            >
+              {% for brewer in brewer_options %}
+                <option
+                  value="{{ brewer.id }}"
+                  {% if brewer.id == brewer_id %}selected{% endif %}
+                >
+                  {{ brewer.label }}
+                </option>
+              {% endfor %}
+            </select>
+          </label>
+          <label class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Filter Paper</span
+            >
+            <select name="filter_paper_id" class="input-field">
+              <option value="">None</option>
+              {% for fp in filter_paper_options %}
+                <option
+                  value="{{ fp.id }}"
+                  {% if fp.id == filter_paper_id %}selected{% endif %}
+                >
+                  {{ fp.label }}
+                </option>
+              {% endfor %}
+            </select>
+          </label>
+        </div>
+      </div>
+
+      <!-- Recipe -->
+      <div>
+        <h4 class="text-sm font-semibold text-text mb-3">Recipe</h4>
+        <div class="grid gap-4 sm:grid-cols-3">
+          <div class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Volume (ml)*</span
+            >
+            <div class="flex items-center gap-2">
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_waterVolume = Math.max(10, Number($_waterVolume) - 10)"
+              >
+                -
+              </button>
+              <input
+                type="number"
+                name="water_volume"
+                step="any"
+                min="10"
+                required
+                aria-required="true"
+                class="input-field flex-1 text-center"
+                data-bind:_water-volume
+              />
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_waterVolume = Number($_waterVolume) + 10"
+              >
+                +
+              </button>
+            </div>
+          </div>
+          <div class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Temp (&deg;C)*</span
+            >
+            <div class="flex items-center gap-2">
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_waterTemp = Math.max(0, Number($_waterTemp) - 0.5)"
+              >
+                -
+              </button>
+              <input
+                type="number"
+                name="water_temp"
+                step="any"
+                min="0"
+                max="100"
+                required
+                aria-required="true"
+                class="input-field flex-1 text-center"
+                data-bind:_water-temp
+              />
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_waterTemp = Math.min(100, Number($_waterTemp) + 0.5)"
+              >
+                +
+              </button>
+            </div>
+          </div>
+          <div class="flex flex-col gap-1 text-sm">
+            <span
+              class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+              >Time (s)</span
+            >
+            <div class="flex items-center gap-2">
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_brewTime = Math.max(5, Number($_brewTime) - 5)"
+              >
+                -
+              </button>
+              <input
+                type="number"
+                name="brew_time"
+                step="1"
+                min="0"
+                class="input-field flex-1 text-center"
+                data-bind:_brew-time
+              />
+              <button
+                type="button"
+                class="btn-adjust"
+                data-on:click="$_brewTime = Number($_brewTime) + 5"
+              >
+                +
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Quick Notes -->
+      <div>
+        <h4 class="text-sm font-semibold text-text mb-3">Quick Notes</h4>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Notes (comma separated)</span
+          >
+          <input
+            type="text"
+            name="quick_notes"
+            class="input-field"
+            placeholder="good, too-fast, under-extracted"
+            data-bind:_quick-notes
+          />
+        </label>
+      </div>
+
+      {{ img::deferred_upload("edit-brew-image", "Brew Image") }}
+      <p
+        data-show="$_submitError"
+        data-text="$_submitError"
+        style="display:none"
+        class="text-sm text-error"
+        role="alert"
+      ></p>
+      <div class="flex items-center justify-end">
+        <button
+          type="submit"
+          class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
+          data-attr:disabled="$_submitting"
+        >
+          <span data-show="$_submitting" style="display:none"
+            >{{ icons::spinner("h-4 w-4") }}</span
+          >
+          Save Changes
+        </button>
+      </div>
+    </form>
+  </section>
+{% endblock %}

templates/pages/edit_cafe.html

@@ -0,0 +1,142 @@
+{% extends "base.html" %}
+{% import "partials/icons.html" as icons %}
+{% import "partials/image_section.html" as img %}
+{% block title %}Brewlog · Edit Cafe{% endblock %}
+
+{% block content %}
+  <header class="flex flex-col gap-2">
+    <h1 class="text-3xl font-semibold">Edit Cafe</h1>
+    <p class="max-w-2xl text-sm text-text-secondary">Update cafe details.</p>
+  </header>
+
+  <section class="rounded-lg border bg-surface p-5">
+    <form
+      class="flex flex-col gap-4"
+      data-signals:_submitting="false"
+      data-signals:_submit-error="''"
+      data-signals:_name="'{{ name }}'"
+      data-signals:_city="'{{ city }}'"
+      data-signals:_country="'{{ country }}'"
+      data-signals:_latitude="{{ latitude }}"
+      data-signals:_longitude="{{ longitude }}"
+      data-signals:_website="'{{ website }}'"
+      data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/cafes/{{ id }}')"
+      data-on:datastar-fetch="if (!$_submitting) return;
+        if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Cafe updated'); window.location.href = evt.detail.response.headers.get('location') || '/cafes/{{ id }}' }
+        else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
+    >
+      <div class="grid gap-4 sm:grid-cols-2">
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Name*</span
+          >
+          <input
+            type="text"
+            name="name"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Blue Bottle Coffee"
+            data-bind:_name
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >City*</span
+          >
+          <input
+            type="text"
+            name="city"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="San Francisco"
+            data-bind:_city
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Country*</span
+          >
+          <input
+            type="text"
+            name="country"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="United States"
+            data-bind:_country
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Website</span
+          >
+          <input
+            type="url"
+            name="website"
+            class="input-field"
+            placeholder="https://bluebottlecoffee.com"
+            data-bind:_website
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Latitude*</span
+          >
+          <input
+            type="number"
+            name="latitude"
+            step="any"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="37.7749"
+            data-bind:_latitude
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Longitude*</span
+          >
+          <input
+            type="number"
+            name="longitude"
+            step="any"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="-122.4194"
+            data-bind:_longitude
+          />
+        </label>
+      </div>
+      {{ img::deferred_upload("edit-cafe-image", "Cafe Image") }}
+      <p
+        data-show="$_submitError"
+        data-text="$_submitError"
+        style="display:none"
+        class="text-sm text-error"
+        role="alert"
+      ></p>
+      <div class="flex items-center justify-end">
+        <button
+          type="submit"
+          class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
+          data-attr:disabled="$_submitting"
+        >
+          <span data-show="$_submitting" style="display:none"
+            >{{ icons::spinner("h-4 w-4") }}</span
+          >
+          Save Changes
+        </button>
+      </div>
+    </form>
+  </section>
+{% endblock %}

templates/pages/edit_cup.html

@@ -0,0 +1,96 @@
+{% extends "base.html" %}
+{% import "partials/icons.html" as icons %}
+{% import "partials/image_section.html" as img %}
+{% block title %}Brewlog · Edit Cup{% endblock %}
+
+{% block content %}
+  <header class="flex flex-col gap-2">
+    <h1 class="text-3xl font-semibold">Edit Cup</h1>
+    <p class="max-w-2xl text-sm text-text-secondary">Update cup details.</p>
+  </header>
+
+  <section class="rounded-lg border bg-surface p-5">
+    <form
+      class="flex flex-col gap-4"
+      data-signals:_submitting="false"
+      data-signals:_submit-error="''"
+      data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/cups/{{ id }}')"
+      data-on:datastar-fetch="if (!$_submitting) return;
+        if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Cup updated'); window.location.href = evt.detail.response.headers.get('location') || '/cups/{{ id }}' }
+        else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
+    >
+      <div class="grid gap-4 sm:grid-cols-2">
+        <div class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Coffee*</span
+          >
+          <searchable-select
+            name="roast_id"
+            placeholder="Type to search roasts&hellip;"
+            initial-value="{{ roast_id }}"
+          >
+            {% for roast in roast_options %}
+              <button
+                type="button"
+                value="{{ roast.id }}"
+                data-display="{{ roast.name }}"
+                class="w-full px-3 py-2 text-left text-sm hover:bg-surface-alt transition"
+              >
+                <span class="font-medium text-text">{{ roast.name }}</span>
+                <span class="ml-2 text-xs text-text-muted"
+                  >{{ roast.roaster_name }}</span
+                >
+              </button>
+            {% endfor %}
+          </searchable-select>
+        </div>
+        <div class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Cafe*</span
+          >
+          <searchable-select
+            name="cafe_id"
+            placeholder="Type to search cafes&hellip;"
+            initial-value="{{ cafe_id }}"
+          >
+            {% for cafe in cafe_options %}
+              <button
+                type="button"
+                value="{{ cafe.id }}"
+                data-display="{{ cafe.name }}"
+                class="w-full px-3 py-2 text-left text-sm hover:bg-surface-alt transition"
+              >
+                <span class="font-medium text-text">{{ cafe.name }}</span>
+                <span class="ml-2 text-xs text-text-muted"
+                  >{{ cafe.city }}</span
+                >
+              </button>
+            {% endfor %}
+          </searchable-select>
+        </div>
+      </div>
+      {{ img::deferred_upload("edit-cup-image", "Cup Image") }}
+      <p
+        data-show="$_submitError"
+        data-text="$_submitError"
+        style="display:none"
+        class="text-sm text-error"
+        role="alert"
+      ></p>
+      <div class="flex items-center justify-end">
+        <button
+          type="submit"
+          class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
+          data-attr:disabled="$_submitting"
+        >
+          <span data-show="$_submitting" style="display:none"
+            >{{ icons::spinner("h-4 w-4") }}</span
+          >
+          Save Changes
+        </button>
+      </div>
+    </form>
+  </section>
+{% endblock %}

templates/pages/edit_gear.html

@@ -0,0 +1,88 @@
+{% extends "base.html" %}
+{% import "partials/icons.html" as icons %}
+{% import "partials/image_section.html" as img %}
+{% block title %}Brewlog · Edit Gear{% endblock %}
+
+{% block content %}
+  <header class="flex flex-col gap-2">
+    <h1 class="text-3xl font-semibold">Edit Gear</h1>
+    <p class="max-w-2xl text-sm text-text-secondary">Update gear details.</p>
+  </header>
+
+  <section class="rounded-lg border bg-surface p-5">
+    <form
+      class="flex flex-col gap-4"
+      data-signals:_submitting="false"
+      data-signals:_submit-error="''"
+      data-signals:_make="'{{ make }}'"
+      data-signals:_model="'{{ model }}'"
+      data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/gear/{{ id }}')"
+      data-on:datastar-fetch="if (!$_submitting) return;
+        if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Gear updated'); window.location.href = evt.detail.response.headers.get('location') || '/gear/{{ id }}' }
+        else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
+    >
+      <div class="grid gap-4 sm:grid-cols-3">
+        <div class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Category</span
+          >
+          <span
+            class="input-field bg-surface-alt text-text-secondary cursor-not-allowed"
+            >{{ category }}</span
+          >
+        </div>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Make*</span
+          >
+          <input
+            type="text"
+            name="make"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Baratza"
+            data-bind:_make
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Model*</span
+          >
+          <input
+            type="text"
+            name="model"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Encore"
+            data-bind:_model
+          />
+        </label>
+      </div>
+      {{ img::deferred_upload("edit-gear-image", "Gear Image") }}
+      <p
+        data-show="$_submitError"
+        data-text="$_submitError"
+        style="display:none"
+        class="text-sm text-error"
+        role="alert"
+      ></p>
+      <div class="flex items-center justify-end">
+        <button
+          type="submit"
+          class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
+          data-attr:disabled="$_submitting"
+        >
+          <span data-show="$_submitting" style="display:none"
+            >{{ icons::spinner("h-4 w-4") }}</span
+          >
+          Save Changes
+        </button>
+      </div>
+    </form>
+  </section>
+{% endblock %}

templates/pages/edit_roast.html

@@ -0,0 +1,164 @@
+{% extends "base.html" %}
+{% import "partials/icons.html" as icons %}
+{% import "partials/image_section.html" as img %}
+{% block title %}Brewlog · Edit Roast{% endblock %}
+
+{% block content %}
+  <header class="flex flex-col gap-2">
+    <h1 class="text-3xl font-semibold">Edit Roast</h1>
+    <p class="max-w-2xl text-sm text-text-secondary">Update roast details.</p>
+  </header>
+
+  <section class="rounded-lg border bg-surface p-5">
+    <form
+      class="flex flex-col gap-4"
+      data-signals:_submitting="false"
+      data-signals:_submit-error="''"
+      data-signals:_name="'{{ name }}'"
+      data-signals:_origin="'{{ origin }}'"
+      data-signals:_region="'{{ region }}'"
+      data-signals:_producer="'{{ producer }}'"
+      data-signals:_process="'{{ process }}'"
+      data-signals:_tasting-notes="'{{ tasting_notes }}'"
+      data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/roasts/{{ id }}')"
+      data-on:datastar-fetch="if (!$_submitting) return;
+        if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Roast updated'); window.location.href = evt.detail.response.headers.get('location') || '/roasts/{{ id }}' }
+        else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
+    >
+      <div class="flex flex-col gap-1 text-sm">
+        <span
+          class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+          >Roaster*</span
+        >
+        <searchable-select
+          name="roaster_id"
+          placeholder="Type to search roasters&hellip;"
+          initial-value="{{ roaster_id }}"
+        >
+          {% for roaster in roaster_options %}
+            <button
+              type="button"
+              value="{{ roaster.id }}"
+              data-display="{{ roaster.name }}"
+              class="w-full px-3 py-2 text-left text-sm hover:bg-surface-alt transition"
+            >
+              <span class="font-medium text-text">{{ roaster.name }}</span>
+            </button>
+          {% endfor %}
+        </searchable-select>
+      </div>
+      <div class="grid gap-4 sm:grid-cols-2">
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Roast Name*</span
+          >
+          <input
+            type="text"
+            name="name"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Ethiopia Yirgacheffe"
+            data-bind:_name
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Origin*</span
+          >
+          <input
+            type="text"
+            name="origin"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Ethiopia"
+            data-bind:_origin
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Region*</span
+          >
+          <input
+            type="text"
+            name="region"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Guji"
+            data-bind:_region
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Producer*</span
+          >
+          <input
+            type="text"
+            name="producer"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Chelbesa Cooperative"
+            data-bind:_producer
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Process*</span
+          >
+          <input
+            type="text"
+            name="process"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Washed"
+            data-bind:_process
+          />
+        </label>
+        <label class="sm:col-span-2 flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Tasting Notes* (comma or newline separated)</span
+          >
+          <textarea
+            name="tasting_notes"
+            rows="2"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Blueberry, Jasmine"
+            data-bind:_tasting-notes
+          ></textarea>
+        </label>
+      </div>
+      {{ img::deferred_upload("edit-roast-image", "Roast Image") }}
+      <p
+        data-show="$_submitError"
+        data-text="$_submitError"
+        style="display:none"
+        class="text-sm text-error"
+        role="alert"
+      ></p>
+      <div class="flex items-center justify-end">
+        <button
+          type="submit"
+          class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
+          data-attr:disabled="$_submitting"
+        >
+          <span data-show="$_submitting" style="display:none"
+            >{{ icons::spinner("h-4 w-4") }}</span
+          >
+          Save Changes
+        </button>
+      </div>
+    </form>
+  </section>
+{% endblock %}

templates/pages/edit_roaster.html

@@ -0,0 +1,106 @@
+{% extends "base.html" %}
+{% import "partials/icons.html" as icons %}
+{% import "partials/image_section.html" as img %}
+{% block title %}Brewlog · Edit Roaster{% endblock %}
+
+{% block content %}
+  <header class="flex flex-col gap-2">
+    <h1 class="text-3xl font-semibold">Edit Roaster</h1>
+    <p class="max-w-2xl text-sm text-text-secondary">Update roaster details.</p>
+  </header>
+
+  <section class="rounded-lg border bg-surface p-5">
+    <form
+      class="flex flex-col gap-4"
+      data-signals:_submitting="false"
+      data-signals:_submit-error="''"
+      data-signals:_name="'{{ name }}'"
+      data-signals:_country="'{{ country }}'"
+      data-signals:_city="'{{ city }}'"
+      data-signals:_homepage="'{{ homepage }}'"
+      data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/roasters/{{ id }}')"
+      data-on:datastar-fetch="if (!$_submitting) return;
+        if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Roaster updated'); window.location.href = evt.detail.response.headers.get('location') || '/roasters/{{ id }}' }
+        else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
+    >
+      <div class="grid gap-4 sm:grid-cols-2">
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Name*</span
+          >
+          <input
+            type="text"
+            name="name"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="Example Coffee Roasters"
+            data-bind:_name
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Country*</span
+          >
+          <input
+            type="text"
+            name="country"
+            required
+            aria-required="true"
+            class="input-field"
+            placeholder="United States"
+            data-bind:_country
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >City</span
+          >
+          <input
+            type="text"
+            name="city"
+            class="input-field"
+            placeholder="Portland"
+            data-bind:_city
+          />
+        </label>
+        <label class="flex flex-col gap-1 text-sm">
+          <span
+            class="text-xs font-semibold text-text-muted uppercase tracking-wide"
+            >Homepage</span
+          >
+          <input
+            type="url"
+            name="homepage"
+            class="input-field"
+            placeholder="https://example.coffee"
+            data-bind:_homepage
+          />
+        </label>
+      </div>
+      {{ img::deferred_upload("edit-roaster-image", "Roaster Image") }}
+      <p
+        data-show="$_submitError"
+        data-text="$_submitError"
+        style="display:none"
+        class="text-sm text-error"
+        role="alert"
+      ></p>
+      <div class="flex items-center justify-end">
+        <button
+          type="submit"
+          class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
+          data-attr:disabled="$_submitting"
+        >
+          <span data-show="$_submitting" style="display:none"
+            >{{ icons::spinner("h-4 w-4") }}</span
+          >
+          Save Changes
+        </button>
+      </div>
+    </form>
+  </section>
+{% endblock %}