Add visitor bot visibility toggle

public/admin.css

@@ -369,13 +369,26 @@ label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
 .visitor-panel header {
   padding: 14px;
   border-bottom: 1px solid var(--line);
-  display: flex;
+  display: grid;
-  justify-content: space-between;
+  grid-template-columns: minmax(0, 1fr) auto auto;
   gap: 10px;
   align-items: center;
 }
 .visitor-panel h2 { margin: 0; font-size: 18px; }
 .visitor-panel header span { color: var(--muted); font-size: 12px; }
+.visitor-filter-toggle {
+  height: 30px;
+  padding: 0 9px;
+  border: 1px solid var(--line);
+  background: #f8fbf9;
+  color: var(--muted);
+  font-size: 12px;
+}
+.visitor-filter-toggle.active {
+  background: #eaf6f1;
+  color: var(--brand);
+  border-color: #c7e8dc;
+}
 .visitor-list {
   min-height: 0;
   overflow: auto;
@@ -385,6 +398,7 @@ label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
   border-bottom: 1px solid var(--line);
   background: white;
 }
+.visitor-card.bot { opacity: .68; }
 .visitor-card.clickable { cursor: pointer; }
 .visitor-card.clickable:hover { background: #f8fbf9; }
 .visitor-card-head {

public/admin.html

@@ -77,6 +77,7 @@
         <aside class="visitor-panel">
           <header>
             <h2>Navstevnici</h2>
+            <button id="hideBotsToggle" class="visitor-filter-toggle" type="button">Skryt boty</button>
             <span id="visitorCount">0 online</span>
           </header>
           <div id="visitorList" class="visitor-list">

public/admin.js

@@ -7,6 +7,7 @@ const state = {
   active: null,
   events: null,
   statusFilter: "active",
+  hideBots: localStorage.getItem("mf_admin_hide_bots") !== "0",
   replyFiles: [],
   attentionTimer: null,
   attentionOn: false,
@@ -167,6 +168,12 @@ $("#conversationFilter").addEventListener("change", () => {
   renderConversations();
 });
 
+$("#hideBotsToggle").addEventListener("click", () => {
+  state.hideBots = !state.hideBots;
+  localStorage.setItem("mf_admin_hide_bots", state.hideBots ? "1" : "0");
+  renderVisitors();
+});
+
 $("#conversationList").addEventListener("click", async (event) => {
   const photoButton = event.target.closest("[data-photo-url]");
   const openButton = event.target.closest("[data-open]");
@@ -326,14 +333,18 @@ function renderConversations() {
 }
 
 function renderVisitors() {
-  $("#visitorCount").textContent = `${state.visitors.length} online`;
+  const visitors = state.hideBots ? state.visitors.filter((visitor) => !visitor.isBot) : state.visitors;
-  $("#visitorList").innerHTML = state.visitors.length ? state.visitors.map((visitor) => `
+  const botCount = state.visitors.filter((visitor) => visitor.isBot).length;
-    <article class="visitor-card ${visitor.lastConversationId ? "clickable" : ""}" data-visitor-conversation="${escapeHtml(visitor.lastConversationId || "")}">
+  $("#hideBotsToggle").classList.toggle("active", state.hideBots);
+  $("#hideBotsToggle").textContent = state.hideBots ? "Skryt boty" : "Boty videt";
+  $("#visitorCount").textContent = `${visitors.length} online${state.hideBots && botCount ? ` · ${botCount} bot` : ""}`;
+  $("#visitorList").innerHTML = visitors.length ? visitors.map((visitor) => `
+    <article class="visitor-card ${visitor.lastConversationId ? "clickable" : ""} ${visitor.isBot ? "bot" : ""}" data-visitor-conversation="${escapeHtml(visitor.lastConversationId || "")}">
       <div class="visitor-card-head">
         <span class="visitor-avatar">${escapeHtml(visitor.initials || "??")}</span>
         <div>
           <strong>${escapeHtml(visitor.label || "Navstevnik")}</strong>
-          <small>${escapeHtml(browserLabel(visitor.device))}</small>
+          <small>${escapeHtml(visitor.isBot ? `bot: ${visitor.botReason || "crawler"}` : browserLabel(visitor.device))}</small>
         </div>
         <span class="online-dot" title="Online"></span>
       </div>

server.js

@@ -639,6 +639,7 @@ function currentVisitors() {
 function formatVisitorSession(row) {
   const history = parseJson(row.browsing_history_json, []);
   const device = parseJson(row.device_json, {});
+  const bot = botInfo(device.userAgent);
   const countryCode = row.country_code || countryFromTimezone(row.timezone) || countryFromLanguage(row.language);
   return {
     id: row.visitor_token,
@@ -652,6 +653,8 @@ function formatVisitorSession(row) {
     visitCount: Math.max(1, history.length),
     conversationCount: row.visitor_conversation_count || 0,
     lastConversationId: row.last_conversation_id,
+    isBot: bot.isBot,
+    botReason: bot.reason,
     device,
     language: row.language,
     timezone: row.timezone,
@@ -915,6 +918,22 @@ function countryFromLanguage(language) {
   return match ? match[1].toUpperCase() : null;
 }
 
+function botInfo(userAgent) {
+  const ua = String(userAgent || "");
+  const patterns = [
+    "googlebot", "bingbot", "slurp", "duckduckbot", "baiduspider", "yandexbot",
+    "ahrefsbot", "semrushbot", "mj12bot", "dotbot", "petalbot", "bytespider",
+    "facebookexternalhit", "twitterbot", "linkedinbot", "slackbot", "discordbot",
+    "whatsapp", "telegrambot", "preview", "crawler", "spider", "headlesschrome",
+    "pingdom", "uptimerobot", "curl", "wget", "python-requests", "axios", "httpclient"
+  ];
+  const lower = ua.toLowerCase();
+  const match = patterns.find((pattern) => lower.includes(pattern));
+  if (match) return { isBot: true, reason: match };
+  if (/\bbot\b/i.test(ua)) return { isBot: true, reason: "bot" };
+  return { isBot: false, reason: "" };
+}
+
 function visitorInitials(visitorToken) {
   const hash = crypto.createHash("sha1").update(String(visitorToken || "")).digest("hex").toUpperCase();
   return hash.slice(0, 2);