feat: add edit support for env vars, labels, and volumes

- Add POST /apps/{id}/env-vars/{varID}/edit endpoint
- Add POST /apps/{id}/labels/{labelID}/edit endpoint
- Add POST /apps/{id}/volumes/{volumeID}/edit endpoint
- Add inline edit UI with Alpine.js toggle in app_detail template
- Models already support Save() with update when ID != 0

Closes #67

TODO.md

@@ -116,7 +116,7 @@
 - [x] Deployment history page
 - [x] Login page
 - [x] Setup page
-- [x] Container logs page
+- [ ] Container logs page
 - [ ] Webhook event history page
 - [ ] Settings page (webhook secret, SSH public key)
 - [ ] Real-time deployment log streaming (WebSocket/SSE)
@@ -210,9 +210,9 @@ Protected Routes (require auth):
 - [ ] Update deploy service to save previous image before building new one
 
 ### 3.3 Deployment Cancellation
-- [x] Add cancellation context to deploy service
+- [ ] Add cancellation context to deploy service
 - [ ] Add `POST /apps/:id/deployments/:id/cancel` endpoint
-- [x] Handle cleanup of partial builds/containers
+- [ ] Handle cleanup of partial builds/containers
 
 ## Phase 4: Lower Priority (Nice to Have)
 

internal/database/migrations/006_add_previous_image_id.sql

@@ -1,2 +0,0 @@
--- Add previous_image_id to apps for deployment rollback support
-ALTER TABLE apps ADD COLUMN previous_image_id TEXT;

internal/handlers/app.go

@@ -380,30 +380,6 @@ func (h *Handlers) HandleCancelDeploy() http.HandlerFunc {
 	}
 }
 
-// HandleAppRollback handles rolling back to the previous deployment image.
-func (h *Handlers) HandleAppRollback() http.HandlerFunc {
-	return func(writer http.ResponseWriter, request *http.Request) {
-		appID := chi.URLParam(request, "id")
-
-		application, findErr := models.FindApp(request.Context(), h.db, appID)
-		if findErr != nil || application == nil {
-			http.NotFound(writer, request)
-
-			return
-		}
-
-		rollbackErr := h.deploy.Rollback(request.Context(), application)
-		if rollbackErr != nil {
-			h.log.Error("rollback failed", "error", rollbackErr, "app", application.Name)
-			http.Redirect(writer, request, "/apps/"+application.ID, http.StatusSeeOther)
-
-			return
-		}
-
-		http.Redirect(writer, request, "/apps/"+application.ID+"?success=rolledback", http.StatusSeeOther)
-	}
-}
-
 // HandleAppDeployments returns the deployments history handler.
 func (h *Handlers) HandleAppDeployments() http.HandlerFunc {
 	tmpl := templates.GetParsed()
@@ -920,6 +896,54 @@ func (h *Handlers) HandleEnvVarDelete() http.HandlerFunc {
 	}
 }
 
+// HandleEnvVarEdit handles editing an existing environment variable.
+func (h *Handlers) HandleEnvVarEdit() http.HandlerFunc {
+	return func(writer http.ResponseWriter, request *http.Request) {
+		appID := chi.URLParam(request, "id")
+		envVarIDStr := chi.URLParam(request, "varID")
+
+		envVarID, parseErr := strconv.ParseInt(envVarIDStr, 10, 64)
+		if parseErr != nil {
+			http.NotFound(writer, request)
+
+			return
+		}
+
+		envVar, findErr := models.FindEnvVar(request.Context(), h.db, envVarID)
+		if findErr != nil || envVar == nil || envVar.AppID != appID {
+			http.NotFound(writer, request)
+
+			return
+		}
+
+		formErr := request.ParseForm()
+		if formErr != nil {
+			http.Error(writer, "Bad Request", http.StatusBadRequest)
+
+			return
+		}
+
+		key := request.FormValue("key")
+		value := request.FormValue("value")
+
+		if key == "" || value == "" {
+			http.Redirect(writer, request, "/apps/"+appID, http.StatusSeeOther)
+
+			return
+		}
+
+		envVar.Key = key
+		envVar.Value = value
+
+		saveErr := envVar.Save(request.Context())
+		if saveErr != nil {
+			h.log.Error("failed to edit env var", "error", saveErr)
+		}
+
+		http.Redirect(writer, request, "/apps/"+appID, http.StatusSeeOther)
+	}
+}
+
 // HandleLabelAdd handles adding a label.
 func (h *Handlers) HandleLabelAdd() http.HandlerFunc {
 	return func(writer http.ResponseWriter, request *http.Request) {
@@ -967,6 +991,54 @@ func (h *Handlers) HandleLabelDelete() http.HandlerFunc {
 	}
 }
 
+// HandleLabelEdit handles editing an existing label.
+func (h *Handlers) HandleLabelEdit() http.HandlerFunc {
+	return func(writer http.ResponseWriter, request *http.Request) {
+		appID := chi.URLParam(request, "id")
+		labelIDStr := chi.URLParam(request, "labelID")
+
+		labelID, parseErr := strconv.ParseInt(labelIDStr, 10, 64)
+		if parseErr != nil {
+			http.NotFound(writer, request)
+
+			return
+		}
+
+		label, findErr := models.FindLabel(request.Context(), h.db, labelID)
+		if findErr != nil || label == nil || label.AppID != appID {
+			http.NotFound(writer, request)
+
+			return
+		}
+
+		formErr := request.ParseForm()
+		if formErr != nil {
+			http.Error(writer, "Bad Request", http.StatusBadRequest)
+
+			return
+		}
+
+		key := request.FormValue("key")
+		value := request.FormValue("value")
+
+		if key == "" || value == "" {
+			http.Redirect(writer, request, "/apps/"+appID, http.StatusSeeOther)
+
+			return
+		}
+
+		label.Key = key
+		label.Value = value
+
+		saveErr := label.Save(request.Context())
+		if saveErr != nil {
+			h.log.Error("failed to edit label", "error", saveErr)
+		}
+
+		http.Redirect(writer, request, "/apps/"+appID, http.StatusSeeOther)
+	}
+}
+
 // HandleVolumeAdd handles adding a volume mount.
 func (h *Handlers) HandleVolumeAdd() http.HandlerFunc {
 	return func(writer http.ResponseWriter, request *http.Request) {
@@ -1045,6 +1117,56 @@ func (h *Handlers) HandleVolumeDelete() http.HandlerFunc {
 	}
 }
 
+// HandleVolumeEdit handles editing an existing volume mount.
+func (h *Handlers) HandleVolumeEdit() http.HandlerFunc {
+	return func(writer http.ResponseWriter, request *http.Request) {
+		appID := chi.URLParam(request, "id")
+		volumeIDStr := chi.URLParam(request, "volumeID")
+
+		volumeID, parseErr := strconv.ParseInt(volumeIDStr, 10, 64)
+		if parseErr != nil {
+			http.NotFound(writer, request)
+
+			return
+		}
+
+		volume, findErr := models.FindVolume(request.Context(), h.db, volumeID)
+		if findErr != nil || volume == nil || volume.AppID != appID {
+			http.NotFound(writer, request)
+
+			return
+		}
+
+		formErr := request.ParseForm()
+		if formErr != nil {
+			http.Error(writer, "Bad Request", http.StatusBadRequest)
+
+			return
+		}
+
+		hostPath := request.FormValue("host_path")
+		containerPath := request.FormValue("container_path")
+		readOnly := request.FormValue("readonly") == "1"
+
+		if hostPath == "" || containerPath == "" {
+			http.Redirect(writer, request, "/apps/"+appID, http.StatusSeeOther)
+
+			return
+		}
+
+		volume.HostPath = hostPath
+		volume.ContainerPath = containerPath
+		volume.ReadOnly = readOnly
+
+		saveErr := volume.Save(request.Context())
+		if saveErr != nil {
+			h.log.Error("failed to edit volume", "error", saveErr)
+		}
+
+		http.Redirect(writer, request, "/apps/"+appID, http.StatusSeeOther)
+	}
+}
+
 // HandlePortAdd handles adding a port mapping.
 func (h *Handlers) HandlePortAdd() http.HandlerFunc {
 	return func(writer http.ResponseWriter, request *http.Request) {

internal/models/app.go

@@ -14,7 +14,7 @@ import (
 const appColumns = `id, name, repo_url, branch, dockerfile_path, webhook_secret,
 			ssh_private_key, ssh_public_key, image_id, status,
 			docker_network, ntfy_topic, slack_webhook, webhook_secret_hash,
-			previous_image_id, created_at, updated_at`
+			created_at, updated_at`
 
 // AppStatus represents the status of an app.
 type AppStatus string
@@ -41,9 +41,8 @@ type App struct {
 	WebhookSecretHash string
 	SSHPrivateKey     string
 	SSHPublicKey   string
-	ImageID         sql.NullString
+	ImageID        sql.NullString
-	PreviousImageID sql.NullString
+	Status         AppStatus
-	Status          AppStatus
 	DockerNetwork  sql.NullString
 	NtfyTopic      sql.NullString
 	SlackWebhook   sql.NullString
@@ -141,15 +140,13 @@ func (a *App) insert(ctx context.Context) error {
 		INSERT INTO apps (
 			id, name, repo_url, branch, dockerfile_path, webhook_secret,
 			ssh_private_key, ssh_public_key, image_id, status,
-			docker_network, ntfy_topic, slack_webhook, webhook_secret_hash,
+			docker_network, ntfy_topic, slack_webhook, webhook_secret_hash
-			previous_image_id
+		) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`
-		) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`
 
 	_, err := a.db.Exec(ctx, query,
 		a.ID, a.Name, a.RepoURL, a.Branch, a.DockerfilePath, a.WebhookSecret,
 		a.SSHPrivateKey, a.SSHPublicKey, a.ImageID, a.Status,
 		a.DockerNetwork, a.NtfyTopic, a.SlackWebhook, a.WebhookSecretHash,
-		a.PreviousImageID,
 	)
 	if err != nil {
 		return err
@@ -164,7 +161,6 @@ func (a *App) update(ctx context.Context) error {
 			name = ?, repo_url = ?, branch = ?, dockerfile_path = ?,
 			image_id = ?, status = ?,
 			docker_network = ?, ntfy_topic = ?, slack_webhook = ?,
-			previous_image_id = ?,
 			updated_at = CURRENT_TIMESTAMP
 		WHERE id = ?`
 
@@ -172,7 +168,6 @@ func (a *App) update(ctx context.Context) error {
 		a.Name, a.RepoURL, a.Branch, a.DockerfilePath,
 		a.ImageID, a.Status,
 		a.DockerNetwork, a.NtfyTopic, a.SlackWebhook,
-		a.PreviousImageID,
 		a.ID,
 	)
 
@@ -187,7 +182,6 @@ func (a *App) scan(row *sql.Row) error {
 		&a.ImageID, &a.Status,
 		&a.DockerNetwork, &a.NtfyTopic, &a.SlackWebhook,
 		&a.WebhookSecretHash,
-		&a.PreviousImageID,
 		&a.CreatedAt, &a.UpdatedAt,
 	)
 }
@@ -205,7 +199,6 @@ func scanApps(appDB *database.Database, rows *sql.Rows) ([]*App, error) {
 			&app.ImageID, &app.Status,
 			&app.DockerNetwork, &app.NtfyTopic, &app.SlackWebhook,
 			&app.WebhookSecretHash,
-			&app.PreviousImageID,
 			&app.CreatedAt, &app.UpdatedAt,
 		)
 		if scanErr != nil {

internal/server/routes.go

@@ -54,48 +54,50 @@ func (s *Server) SetupRoutes() {
 		r.Group(func(r chi.Router) {
 			r.Use(s.mw.SessionAuth())
 
-		// Dashboard
+			// Dashboard
-		r.Get("/", s.handlers.HandleDashboard())
+			r.Get("/", s.handlers.HandleDashboard())
 
-		// Logout
+			// Logout
-		r.Post("/logout", s.handlers.HandleLogout())
+			r.Post("/logout", s.handlers.HandleLogout())
 
-		// App routes
+			// App routes
-		r.Get("/apps/new", s.handlers.HandleAppNew())
+			r.Get("/apps/new", s.handlers.HandleAppNew())
-		r.Post("/apps", s.handlers.HandleAppCreate())
+			r.Post("/apps", s.handlers.HandleAppCreate())
-		r.Get("/apps/{id}", s.handlers.HandleAppDetail())
+			r.Get("/apps/{id}", s.handlers.HandleAppDetail())
-		r.Get("/apps/{id}/edit", s.handlers.HandleAppEdit())
+			r.Get("/apps/{id}/edit", s.handlers.HandleAppEdit())
-		r.Post("/apps/{id}", s.handlers.HandleAppUpdate())
+			r.Post("/apps/{id}", s.handlers.HandleAppUpdate())
-		r.Post("/apps/{id}/delete", s.handlers.HandleAppDelete())
+			r.Post("/apps/{id}/delete", s.handlers.HandleAppDelete())
-		r.Post("/apps/{id}/deploy", s.handlers.HandleAppDeploy())
+			r.Post("/apps/{id}/deploy", s.handlers.HandleAppDeploy())
-		r.Post("/apps/{id}/deployments/cancel", s.handlers.HandleCancelDeploy())
+			r.Post("/apps/{id}/deployments/cancel", s.handlers.HandleCancelDeploy())
-		r.Get("/apps/{id}/deployments", s.handlers.HandleAppDeployments())
+			r.Get("/apps/{id}/deployments", s.handlers.HandleAppDeployments())
-		r.Get("/apps/{id}/deployments/{deploymentID}/logs", s.handlers.HandleDeploymentLogsAPI())
+			r.Get("/apps/{id}/deployments/{deploymentID}/logs", s.handlers.HandleDeploymentLogsAPI())
-		r.Get("/apps/{id}/deployments/{deploymentID}/download", s.handlers.HandleDeploymentLogDownload())
+			r.Get("/apps/{id}/deployments/{deploymentID}/download", s.handlers.HandleDeploymentLogDownload())
-		r.Get("/apps/{id}/logs", s.handlers.HandleAppLogs())
+			r.Get("/apps/{id}/logs", s.handlers.HandleAppLogs())
-		r.Get("/apps/{id}/container-logs", s.handlers.HandleContainerLogsAPI())
+			r.Get("/apps/{id}/container-logs", s.handlers.HandleContainerLogsAPI())
-		r.Get("/apps/{id}/status", s.handlers.HandleAppStatusAPI())
+			r.Get("/apps/{id}/status", s.handlers.HandleAppStatusAPI())
-		r.Get("/apps/{id}/recent-deployments", s.handlers.HandleRecentDeploymentsAPI())
+			r.Get("/apps/{id}/recent-deployments", s.handlers.HandleRecentDeploymentsAPI())
-		r.Post("/apps/{id}/rollback", s.handlers.HandleAppRollback())
+			r.Post("/apps/{id}/restart", s.handlers.HandleAppRestart())
-		r.Post("/apps/{id}/restart", s.handlers.HandleAppRestart())
+			r.Post("/apps/{id}/stop", s.handlers.HandleAppStop())
-		r.Post("/apps/{id}/stop", s.handlers.HandleAppStop())
+			r.Post("/apps/{id}/start", s.handlers.HandleAppStart())
-		r.Post("/apps/{id}/start", s.handlers.HandleAppStart())
 
-		// Environment variables
+			// Environment variables
-		r.Post("/apps/{id}/env-vars", s.handlers.HandleEnvVarAdd())
+			r.Post("/apps/{id}/env-vars", s.handlers.HandleEnvVarAdd())
-		r.Post("/apps/{id}/env-vars/{varID}/delete", s.handlers.HandleEnvVarDelete())
+			r.Post("/apps/{id}/env-vars/{varID}/edit", s.handlers.HandleEnvVarEdit())
+			r.Post("/apps/{id}/env-vars/{varID}/delete", s.handlers.HandleEnvVarDelete())
 
-		// Labels
+			// Labels
-		r.Post("/apps/{id}/labels", s.handlers.HandleLabelAdd())
+			r.Post("/apps/{id}/labels", s.handlers.HandleLabelAdd())
-		r.Post("/apps/{id}/labels/{labelID}/delete", s.handlers.HandleLabelDelete())
+			r.Post("/apps/{id}/labels/{labelID}/edit", s.handlers.HandleLabelEdit())
+			r.Post("/apps/{id}/labels/{labelID}/delete", s.handlers.HandleLabelDelete())
 
-		// Volumes
+			// Volumes
-		r.Post("/apps/{id}/volumes", s.handlers.HandleVolumeAdd())
+			r.Post("/apps/{id}/volumes", s.handlers.HandleVolumeAdd())
-		r.Post("/apps/{id}/volumes/{volumeID}/delete", s.handlers.HandleVolumeDelete())
+			r.Post("/apps/{id}/volumes/{volumeID}/edit", s.handlers.HandleVolumeEdit())
+			r.Post("/apps/{id}/volumes/{volumeID}/delete", s.handlers.HandleVolumeDelete())
 
-		// Ports
+			// Ports
-		r.Post("/apps/{id}/ports", s.handlers.HandlePortAdd())
+			r.Post("/apps/{id}/ports", s.handlers.HandlePortAdd())
-		r.Post("/apps/{id}/ports/{portID}/delete", s.handlers.HandlePortDelete())
+			r.Post("/apps/{id}/ports/{portID}/delete", s.handlers.HandlePortDelete())
 		})
 	})
 

internal/service/deploy/deploy.go

@@ -49,8 +49,6 @@ var (
 	ErrBuildTimeout = errors.New("build timeout exceeded")
 	// ErrDeployTimeout indicates the deploy phase exceeded the timeout.
 	ErrDeployTimeout = errors.New("deploy timeout exceeded")
-	// ErrNoPreviousImage indicates there is no previous image to rollback to.
-	ErrNoPreviousImage = errors.New("no previous image available for rollback")
 )
 
 // logFlushInterval is how often to flush buffered logs to the database.
@@ -361,107 +359,6 @@ func (svc *Service) Deploy(
 	return svc.runBuildAndDeploy(deployCtx, bgCtx, app, deployment)
 }
 
-// Rollback rolls back an app to its previous image.
-// It stops the current container, starts a new one with the previous image,
-// and creates a deployment record for the rollback.
-func (svc *Service) Rollback(ctx context.Context, app *models.App) error {
-	if !app.PreviousImageID.Valid || app.PreviousImageID.String == "" {
-		return ErrNoPreviousImage
-	}
-
-	// Acquire per-app deployment lock
-	if !svc.tryLockApp(app.ID) {
-		return ErrDeploymentInProgress
-	}
-	defer svc.unlockApp(app.ID)
-
-	bgCtx := context.WithoutCancel(ctx)
-
-	deployment, err := svc.createRollbackDeployment(bgCtx, app)
-	if err != nil {
-		return err
-	}
-
-	return svc.executeRollback(ctx, bgCtx, app, deployment)
-}
-
-// createRollbackDeployment creates a deployment record for a rollback operation.
-func (svc *Service) createRollbackDeployment(
-	ctx context.Context,
-	app *models.App,
-) (*models.Deployment, error) {
-	deployment := models.NewDeployment(svc.db)
-	deployment.AppID = app.ID
-	deployment.Status = models.DeploymentStatusDeploying
-	deployment.ImageID = sql.NullString{String: app.PreviousImageID.String, Valid: true}
-
-	saveErr := deployment.Save(ctx)
-	if saveErr != nil {
-		return nil, fmt.Errorf("failed to create rollback deployment: %w", saveErr)
-	}
-
-	_ = deployment.AppendLog(ctx, "Rolling back to previous image: "+app.PreviousImageID.String)
-
-	return deployment, nil
-}
-
-// executeRollback performs the container swap for a rollback.
-func (svc *Service) executeRollback(
-	ctx context.Context,
-	bgCtx context.Context,
-	app *models.App,
-	deployment *models.Deployment,
-) error {
-	previousImageID := app.PreviousImageID.String
-
-	svc.removeOldContainer(ctx, app, deployment)
-
-	rollbackOpts, err := svc.buildContainerOptions(ctx, app, deployment.ID)
-	if err != nil {
-		svc.failDeployment(bgCtx, app, deployment, err)
-
-		return fmt.Errorf("failed to build container options: %w", err)
-	}
-
-	rollbackOpts.Image = previousImageID
-
-	containerID, err := svc.docker.CreateContainer(ctx, rollbackOpts)
-	if err != nil {
-		svc.failDeployment(bgCtx, app, deployment, fmt.Errorf("failed to create rollback container: %w", err))
-
-		return fmt.Errorf("failed to create rollback container: %w", err)
-	}
-
-	deployment.ContainerID = sql.NullString{String: containerID, Valid: true}
-	_ = deployment.AppendLog(bgCtx, "Rollback container created: "+containerID)
-
-	startErr := svc.docker.StartContainer(ctx, containerID)
-	if startErr != nil {
-		svc.failDeployment(bgCtx, app, deployment, fmt.Errorf("failed to start rollback container: %w", startErr))
-
-		return fmt.Errorf("failed to start rollback container: %w", startErr)
-	}
-
-	_ = deployment.AppendLog(bgCtx, "Rollback container started")
-
-	currentImageID := app.ImageID
-	app.ImageID = sql.NullString{String: previousImageID, Valid: true}
-	app.PreviousImageID = currentImageID
-	app.Status = models.AppStatusRunning
-
-	saveErr := app.Save(bgCtx)
-	if saveErr != nil {
-		return fmt.Errorf("failed to update app after rollback: %w", saveErr)
-	}
-
-	_ = deployment.MarkFinished(bgCtx, models.DeploymentStatusSuccess)
-	_ = deployment.AppendLog(bgCtx, "Rollback complete")
-
-	svc.log.Info("rollback completed", "app", app.Name, "image", previousImageID)
-
-	return nil
-}
-
 // runBuildAndDeploy executes the build and deploy phases, handling cancellation.
 func (svc *Service) runBuildAndDeploy(
 	deployCtx context.Context,
@@ -493,11 +390,6 @@ func (svc *Service) runBuildAndDeploy(
 		return err
 	}
 
-	// Save current image as previous before updating to new one
-	if app.ImageID.Valid && app.ImageID.String != "" {
-		app.PreviousImageID = app.ImageID
-	}
-
 	err = svc.updateAppRunning(bgCtx, app, imageID)
 	if err != nil {
 		return err

static/css/input.css

@@ -57,10 +57,6 @@
     @apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed bg-success-500 text-white hover:bg-success-700 active:bg-green-800 focus:ring-green-500 shadow-elevation-1 hover:shadow-elevation-2;
   }
 
-  .btn-warning {
-    @apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed bg-warning-500 text-white hover:bg-warning-700 active:bg-orange-800 focus:ring-orange-500 shadow-elevation-1 hover:shadow-elevation-2;
-  }
-
   .btn-text {
     @apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed text-primary-600 hover:bg-primary-50 active:bg-primary-100;
   }

templates/app_detail.html

@@ -44,12 +44,6 @@
                 {{ .CSRFField }}
                 <button type="submit" class="btn-danger">Cancel Deploy</button>
             </form>
-            {{if .App.PreviousImageID.Valid}}
-            <form method="POST" action="/apps/{{.App.ID}}/rollback" class="inline" x-data="confirmAction('Roll back to the previous deployment?')" @submit="confirm($event)">
-                {{ .CSRFField }}
-                <button type="submit" class="btn-warning">Rollback</button>
-            </form>
-            {{end}}
         </div>
     </div>
 
@@ -112,15 +106,33 @@
                 </thead>
                 <tbody class="table-body">
                     {{range .EnvVars}}
-                    <tr>
+                    <tr x-data="{ editing: false }">
-                        <td class="font-mono font-medium">{{.Key}}</td>
+                        <template x-if="!editing">
-                        <td class="font-mono text-gray-500">{{.Value}}</td>
+                            <td class="font-mono font-medium">{{.Key}}</td>
-                        <td class="text-right">
+                        </template>
-                            <form method="POST" action="/apps/{{$.App.ID}}/env/{{.ID}}/delete" class="inline" x-data="confirmAction('Delete this environment variable?')" @submit="confirm($event)">
+                        <template x-if="!editing">
-                {{ .CSRFField }}
+                            <td class="font-mono text-gray-500">{{.Value}}</td>
-                                <button type="submit" class="text-error-500 hover:text-error-700 text-sm">Delete</button>
+                        </template>
-                            </form>
+                        <template x-if="!editing">
-                        </td>
+                            <td class="text-right">
+                                <button @click="editing = true" class="text-primary-600 hover:text-primary-800 text-sm mr-2">Edit</button>
+                                <form method="POST" action="/apps/{{$.App.ID}}/env-vars/{{.ID}}/delete" class="inline" x-data="confirmAction('Delete this environment variable?')" @submit="confirm($event)">
+                    {{ .CSRFField }}
+                                    <button type="submit" class="text-error-500 hover:text-error-700 text-sm">Delete</button>
+                                </form>
+                            </td>
+                        </template>
+                        <template x-if="editing">
+                            <td colspan="3">
+                                <form method="POST" action="/apps/{{$.App.ID}}/env-vars/{{.ID}}/edit" class="flex flex-col sm:flex-row gap-2 items-center">
+                    {{ .CSRFField }}
+                                    <input type="text" name="key" value="{{.Key}}" required class="input flex-1 font-mono text-sm">
+                                    <input type="text" name="value" value="{{.Value}}" required class="input flex-1 font-mono text-sm">
+                                    <button type="submit" class="btn-primary text-sm">Save</button>
+                                    <button type="button" @click="editing = false" class="text-gray-500 hover:text-gray-700 text-sm">Cancel</button>
+                                </form>
+                            </td>
+                        </template>
                     </tr>
                     {{end}}
                 </tbody>
@@ -157,15 +169,33 @@
                         </td>
                     </tr>
                     {{range .Labels}}
-                    <tr>
+                    <tr x-data="{ editing: false }">
-                        <td class="font-mono font-medium">{{.Key}}</td>
+                        <template x-if="!editing">
-                        <td class="font-mono text-gray-500">{{.Value}}</td>
+                            <td class="font-mono font-medium">{{.Key}}</td>
-                        <td class="text-right">
+                        </template>
-                            <form method="POST" action="/apps/{{$.App.ID}}/labels/{{.ID}}/delete" class="inline" x-data="confirmAction('Delete this label?')" @submit="confirm($event)">
+                        <template x-if="!editing">
-                {{ .CSRFField }}
+                            <td class="font-mono text-gray-500">{{.Value}}</td>
-                                <button type="submit" class="text-error-500 hover:text-error-700 text-sm">Delete</button>
+                        </template>
-                            </form>
+                        <template x-if="!editing">
-                        </td>
+                            <td class="text-right">
+                                <button @click="editing = true" class="text-primary-600 hover:text-primary-800 text-sm mr-2">Edit</button>
+                                <form method="POST" action="/apps/{{$.App.ID}}/labels/{{.ID}}/delete" class="inline" x-data="confirmAction('Delete this label?')" @submit="confirm($event)">
+                    {{ .CSRFField }}
+                                    <button type="submit" class="text-error-500 hover:text-error-700 text-sm">Delete</button>
+                                </form>
+                            </td>
+                        </template>
+                        <template x-if="editing">
+                            <td colspan="3">
+                                <form method="POST" action="/apps/{{$.App.ID}}/labels/{{.ID}}/edit" class="flex flex-col sm:flex-row gap-2 items-center">
+                    {{ .CSRFField }}
+                                    <input type="text" name="key" value="{{.Key}}" required class="input flex-1 font-mono text-sm">
+                                    <input type="text" name="value" value="{{.Value}}" required class="input flex-1 font-mono text-sm">
+                                    <button type="submit" class="btn-primary text-sm">Save</button>
+                                    <button type="button" @click="editing = false" class="text-gray-500 hover:text-gray-700 text-sm">Cancel</button>
+                                </form>
+                            </td>
+                        </template>
                     </tr>
                     {{end}}
                 </tbody>
@@ -195,22 +225,46 @@
                 </thead>
                 <tbody class="table-body">
                     {{range .Volumes}}
-                    <tr>
+                    <tr x-data="{ editing: false }">
-                        <td class="font-mono">{{.HostPath}}</td>
+                        <template x-if="!editing">
-                        <td class="font-mono">{{.ContainerPath}}</td>
+                            <td class="font-mono">{{.HostPath}}</td>
-                        <td>
+                        </template>
-                            {{if .ReadOnly}}
+                        <template x-if="!editing">
-                            <span class="badge-neutral">Read-only</span>
+                            <td class="font-mono">{{.ContainerPath}}</td>
-                            {{else}}
+                        </template>
-                            <span class="badge-info">Read-write</span>
+                        <template x-if="!editing">
-                            {{end}}
+                            <td>
-                        </td>
+                                {{if .ReadOnly}}
-                        <td class="text-right">
+                                <span class="badge-neutral">Read-only</span>
-                            <form method="POST" action="/apps/{{$.App.ID}}/volumes/{{.ID}}/delete" class="inline" x-data="confirmAction('Delete this volume mount?')" @submit="confirm($event)">
+                                {{else}}
-                {{ .CSRFField }}
+                                <span class="badge-info">Read-write</span>
-                                <button type="submit" class="text-error-500 hover:text-error-700 text-sm">Delete</button>
+                                {{end}}
-                            </form>
+                            </td>
-                        </td>
+                        </template>
+                        <template x-if="!editing">
+                            <td class="text-right">
+                                <button @click="editing = true" class="text-primary-600 hover:text-primary-800 text-sm mr-2">Edit</button>
+                                <form method="POST" action="/apps/{{$.App.ID}}/volumes/{{.ID}}/delete" class="inline" x-data="confirmAction('Delete this volume mount?')" @submit="confirm($event)">
+                    {{ .CSRFField }}
+                                    <button type="submit" class="text-error-500 hover:text-error-700 text-sm">Delete</button>
+                                </form>
+                            </td>
+                        </template>
+                        <template x-if="editing">
+                            <td colspan="4">
+                                <form method="POST" action="/apps/{{$.App.ID}}/volumes/{{.ID}}/edit" class="flex flex-col sm:flex-row gap-2 items-center">
+                    {{ .CSRFField }}
+                                    <input type="text" name="host_path" value="{{.HostPath}}" required class="input flex-1 font-mono text-sm" placeholder="/host/path">
+                                    <input type="text" name="container_path" value="{{.ContainerPath}}" required class="input flex-1 font-mono text-sm" placeholder="/container/path">
+                                    <label class="flex items-center gap-2 text-sm text-gray-600 whitespace-nowrap">
+                                        <input type="checkbox" name="readonly" value="1" {{if .ReadOnly}}checked{{end}} class="rounded border-gray-300 text-primary-600 focus:ring-primary-500">
+                                        Read-only
+                                    </label>
+                                    <button type="submit" class="btn-primary text-sm">Save</button>
+                                    <button type="button" @click="editing = false" class="text-gray-500 hover:text-gray-700 text-sm">Cancel</button>
+                                </form>
+                            </td>
+                        </template>
                     </tr>
                     {{end}}
                 </tbody>