feat: Better modal form using dialog, some forms still need updated to use it effectively.

Sources/ViewController/Views/Project/ProjectDetail.swift

@@ -18,9 +18,7 @@ struct ProjectDetail: HTML, Sendable {
         h1(.class("text-2xl font-bold")) { "Project" }
         EditButton()
           .attributes(
-            .hx.get(route: .project(.form(id: project.id, dismiss: false))),
-            .hx.target("#projectForm"),
-            .hx.swap(.outerHTML)
+            .on(.click, "projectForm.showModal()")
           )
       }
 
@@ -54,6 +52,6 @@ struct ProjectDetail: HTML, Sendable {
       }
     }
 
-    ProjectForm(dismiss: true)
+    ProjectForm(dismiss: true, project: project)
   }
 }

Sources/ViewController/Views/Project/ProjectForm.swift

@@ -34,7 +34,7 @@ struct ProjectForm: HTML, Sendable {
         div {
           label(.for("name")) { "Name" }
           Input(id: "name", placeholder: "Name")
-            .attributes(.type(.text), .required, .autofocus)
+            .attributes(.type(.text), .required, .autofocus, .value(project?.name))
         }
         div {
           label(.for("streetAddress")) { "Address" }
@@ -57,14 +57,9 @@ struct ProjectForm: HTML, Sendable {
             .attributes(.type(.text), .required, .value(project?.zipCode))
         }
 
-        div(.class("flex justify-end space-x-6")) {
-          CancelButton()
-            .attributes(
-              .hx.get(route: .project(.form(dismiss: true))),
-              .hx.target("#projectForm"),
-              .hx.swap(.outerHTML)
-            )
+        div(.class("flex mt-6")) {
           SubmitButton()
+            .attributes(.class("btn-block"))
         }
       }
     }

Sources/ViewController/Views/Project/ProjectsTable.swift

@@ -67,8 +67,7 @@ extension ProjectsTable {
           td { "\(project.name)" }
           td { "\(project.streetAddress)" }
           td {
-            Row {
-              div {}
+            div(.class("flex justify-end space-x-6")) {
               TrashButton()
                 .attributes(
                   .hx.delete(route: .project(.delete(id: project.id))),