spellcheck, and refreshing cake list

templates/cake.html

@@ -1,8 +0,0 @@
-<div id="cake_preview">
-    <ul>
-        <li>ID: {{.ID}}</li>
-        <li>Name: {{.Name}}</li>
-        <li>Price: {{.Price}}</li>
-    </ul>
-    <button type="button" onClick="document.getElementById('cake_preview').remove()">close</button>
-</div>

templates/cake_editor.html

@@ -1,3 +1,4 @@
+<h3>Edit cakes</h3>
 <form hx-post="new_cake" hx-swap="outerHTML">
     <div>
         <label for="name">Name</label>
@@ -9,5 +10,5 @@
     </div>
     <input value="{{.ID}}" name="id" hidden></input>
     <button type="submit">Submit</button>
-    <button type="button" onclick="document.getElementById('cake_editor').innerText=''">Cancel</button>
+    <button hx-get="edit_cakes" hx-swap="innerHTML" hx-target="closest div">back</button>
 </form>

templates/edit_cakes.html

@@ -1,10 +1,9 @@
 <h3>Edit cakes</h3>
 <button hx-get="available_cakes" hx-swap="innerHTML" hx-target="closest div">back</button>
-<button hx-get="cake_editor" hx-swap="innerHTML" hx-target="#cake_editor">New</button>
+<button hx-get="cake_editor" hx-swap="innerHTML" hx-target="closest #cake_selector">New</button>
 <div id="cakes">
     {{range $key, $value := .}}
-    <button hx-get="cake_editor/{{$value.ID}}" hx-swap="innerHTML" hx-target="#cake_editor">{{$value.Name}}
+    <button hx-get="cake_editor/{{$value.ID}}" hx-swap="innerHTML" hx-target="closest #cake_selector">{{$value.Name}}
         {{$value.Price}}</button>
     {{end}}
-</div>
-<div id="cake_editor"></div>
+</div>

templates/new_cake.html

@@ -0,0 +1,7 @@
+<h3>Added cake</h3>
+<ul>
+    <li>ID: {{.ID}}</li>
+    <li>Name: {{.Name}}</li>
+    <li>Price: {{.Price}}</li>
+</ul>
+<button hx-get="edit_cakes" hx-swap="innerHTML" hx-target="closest div">back</button>