:)

templates/story_edit.html

@@ -2,14 +2,33 @@
     <div class="modal" onclick="event.stopPropagation()">
         <div class="modal-header">
             <h2>Rename Story</h2>
-            <button class="modal-close" onclick="this.closest('.modal-overlay').remove()">&times;</button>
+            <button
+                class="modal-close"
+                onclick="this.closest('.modal-overlay').remove()"
+            >
+                ×
+            </button>
         </div>
-        <form method="POST" action="/rooms/{{.RoomID}}/stories/{{.Story.ID}}/rename" class="auth-form">
+        <form
+            method="POST"
+            action="/rooms/{{.RoomID}}/stories/{{.Story.ID}}/rename"
+            hx-post="/rooms/{{.RoomID}}/stories/{{.Story.ID}}/rename"
+            hx-target="#stories-panel"
+            hx-swap="outerHTML"
+            hx-on::after-request="if (event.detail.successful) document.getElementById('modal-container').innerHTML = ''"
+            class="auth-form"
+        >
             <div class="form-group">
                 <label class="form-label">Story Title</label>
-                <input class="form-input" type="text" name="title" value="{{.Story.Title}}" required />
+                <input
+                    class="form-input"
+                    type="text"
+                    name="title"
+                    value="{{.Story.Title}}"
+                    required
+                />
             </div>
-            <button class="btn-primary" type="submit">Save</button>
+            <button class="btn-primary" type="submit">Save Changes</button>
         </form>
     </div>
 </div>