api/rooms.go

@@ -92,3 +92,28 @@ func handlePartialVoteArea(w http.ResponseWriter, r *http.Request) {
 	}
 	renderTemplate(w, "vote-area", data)
 }
+
+func handleDeleteRoom(w http.ResponseWriter, r *http.Request) {
+	roomID := getRoomID(r)
+	user := r.Context().Value(userKey).(*lib.User)
+	
+	room, err := lib.GetRoomByID(roomID)
+	if err != nil {
+		http.Error(w, "room not found", http.StatusNotFound)
+		return
+	}
+	
+	if room.OwnerID != user.ID {
+		http.Error(w, "unauthorized", http.StatusUnauthorized)
+		return
+	}
+	
+	err = lib.DeleteRoom(roomID)
+	if err != nil {
+		log.Printf("delete room error: %v", err)
+		http.Error(w, "failed to delete room", http.StatusInternalServerError)
+		return
+	}
+	
+	w.WriteHeader(http.StatusOK)
+}

api/routes.go

@@ -12,6 +12,7 @@ func SetupRoutes(mux *http.ServeMux) {
 	mux.HandleFunc("/rooms/create", requireAuth(handleCreateRoom))
 	mux.HandleFunc("/rooms/join", requireAuth(handleJoinRoom))
 	mux.HandleFunc("/rooms/{id}", requireAuth(handleRoom))
+	mux.HandleFunc("/rooms/{id}/delete", requireAuth(handleDeleteRoom))
 
 	mux.HandleFunc("/rooms/{id}/partial/stories", requireAuth(handlePartialStories))
 	mux.HandleFunc("/rooms/{id}/partial/members", requireAuth(handlePartialMembers))

lib/room.go

@@ -129,3 +129,9 @@ func GetRoomMembers(roomID int) ([]User, error) {
 	}
 	return members, nil
 }
+
+// delete room by id
+func DeleteRoom(id int) error {
+	_, err := DB.Exec("DELETE FROM rooms WHERE id = ?", id)
+	return err
+}

templates/index.html

@@ -50,14 +50,16 @@
                     {{if .Rooms}}
                     <div class="rooms-grid">
                         {{range .Rooms}}
-                        <a href="/rooms/{{.ID}}" class="room-card">
+                        <div class="room-card">
-                            <div class="room-header">
+                            <a href="/rooms/{{.ID}}" style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1;"></a>
+                            <div class="room-header" style="position: relative; z-index: 2; pointer-events: none;">
                                 <span class="room-name">{{.Name}}</span>
                                 <div
                                     style="
                                         display: flex;
                                         gap: 0.5rem;
                                         align-items: center;
+                                        pointer-events: auto;
                                     "
                                 >
                                     {{if .IsOwner}}
@@ -73,15 +75,35 @@
                                     </span>
                                     {{end}}
                                     <span class="room-code">{{.Code}}</span>
+                                    {{if .IsOwner}}
+                                    <button
+                                        type="button"
+                                        class="story-action-btn story-action-delete"
+                                        hx-post="/rooms/{{.ID}}/delete"
+                                        hx-target="closest .room-card"
+                                        hx-swap="outerHTML"
+                                        hx-confirm="Delete this room?"
+                                        title="Delete Room"
+                                        aria-label="Delete Room"
+                                    >
+                                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                            <path d="M3 6h18" />
+                                            <path d="M8 6V4h8v2" />
+                                            <path d="M19 6l-1 14H6L5 6" />
+                                            <path d="M10 11v6" />
+                                            <path d="M14 11v6" />
+                                        </svg>
+                                    </button>
+                                    {{end}}
                                 </div>
                             </div>
-                            <div class="room-meta">
+                            <div class="room-meta" style="position: relative; z-index: 2; pointer-events: none;">
                                 <span class="room-scale">{{.Scale}}</span>
                                 <span class="room-members"
                                     >{{.MemberCount}} members</span
                                 >
                             </div>
-                        </a>
+                        </div>
                         {{end}}
                     </div>
                     {{else}}