Refine admin photo display and status controls

public/admin.js

@@ -152,10 +152,10 @@ $("#conversationList").addEventListener("click", async (event) => {
   if (openButton) await openConversation(openButton.dataset.open);
 });
 
-$("#conversationList").addEventListener("change", async (event) => {
-  const statusSelect = event.target.closest("[data-status-for]");
-  if (!statusSelect) return;
-  await updateConversationStatus(statusSelect.dataset.statusFor, statusSelect.value);
+$("#conversationList").addEventListener("click", async (event) => {
+  const statusButton = event.target.closest("[data-status-button]");
+  if (!statusButton) return;
+  await updateConversationStatus(statusButton.dataset.statusButton, statusButton.dataset.status);
 });
 
 $("#messages").addEventListener("click", (event) => {
@@ -258,9 +258,7 @@ function renderConversations() {
         </span>
       </button>
       <div class="conversation-actions">
-        <select class="status-select ${item.status}" data-status-for="${item.id}" aria-label="Zmenit stav chatu">
-          ${statusOptions(item.status)}
-        </select>
+        ${statusButtons(item)}
         <button class="delete-chat" type="button" data-delete="${item.id}" aria-label="Smazat chat" title="Smazat chat">
           <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M9 3h6l1 2h4v2H4V5h4l1-2Zm-2 6h10l-.7 11H7.7L7 9Zm3 2 .2 7h1.6l-.2-7H10Zm4 0-.2 7h1.6l.2-7H14Z"></path></svg>
         </button>
@@ -295,13 +293,16 @@ function filteredConversations() {
   return state.conversations.filter((item) => item.status === state.statusFilter);
 }
 
-function statusOptions(currentStatus) {
+function statusButtons(item) {
   return [
     ["new", "nove"],
     ["open", "otevrene"],
-    ["resolved", "vyresene"],
-    ["spam", "spam"]
-  ].map(([value, label]) => `<option value="${value}" ${value === currentStatus ? "selected" : ""}>${label}</option>`).join("");
+    ["resolved", "vyresene"]
+  ].map(([value, label]) => `
+    <button class="status-button ${value} ${item.status === value ? "active" : ""}" type="button" data-status-button="${item.id}" data-status="${value}">
+      ${label}
+    </button>
+  `).join("");
 }
 
 function visitorCountry(item) {