Index: lan-frontend/src/components/TopBar.jsx
===================================================================
--- lan-frontend/src/components/TopBar.jsx	(revision 505f39ae7b51fc1db15123d66bf06aec0dca2f62)
+++ lan-frontend/src/components/TopBar.jsx	(revision d42aac31fe37e6e42a1b0515b54b86e8706d90a8)
@@ -1,4 +1,4 @@
 import React, { useEffect, useMemo, useState } from "react";
-import logo from "../assets/ChatGPT_Image_Jan_21__2026__01_20_04_PM-removebg-preview (1).png";
+import logo from "../assets/logo_image.png";
 
 export default function TopBar({
@@ -10,4 +10,8 @@
   me,
   onLoggedOut, // optional callback (App loadMe)
+
+  // NEW: process history switch (controlled by App)
+  saveProcHistory = false,
+  onToggleProcHistory, // (enabled:boolean) => void
 }) {
   const [open, setOpen] = useState(false);
@@ -22,4 +26,5 @@
   const [error, setError] = useState("");
 
+  const isAdmin = (me?.role || "").toLowerCase() === "admin";
 
   // keep in sync ако App праќа selectedEnv prop
@@ -146,12 +151,4 @@
         .tb-inner{ max-width: 1200px; margin: 0 auto; padding: 14px 18px;
           display: flex; align-items: center; justify-content: space-between; gap: 14px; }
-        .tb-brand{ display:flex; align-items:center; gap: 12px; min-width: 260px; }
-        .tb-badge{ width: 44px; height: 44px; border-radius: 14px; display:flex; align-items:center; justify-content:center;
-          background: radial-gradient(120px 80px at 30% 20%, rgba(96,165,250,0.55), transparent 60%),
-                      linear-gradient(135deg, rgba(30,64,175,0.75), rgba(15,23,42,0.85));
-          border: 1px solid rgba(96,165,250,0.25); box-shadow: 0 10px 25px rgba(0,0,0,0.25); }
-        .tb-title{ margin:0; font-size: 16px; font-weight: 900; letter-spacing: 0.4px; color: rgba(255,255,255,0.95); line-height: 1.2; }
-        .tb-sub{ margin: 2px 0 0 0; font-size: 12px; color: rgba(191,219,254,0.85); }
-        .tb-sub span{ color: rgba(96,165,250,0.95); font-weight: 800; }
         .tb-actions{ display:flex; align-items:center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
         .tb-pill{ display:inline-flex; align-items:center; gap: 8px; padding: 8px 12px; border-radius: 999px;
@@ -169,4 +166,16 @@
           border-color: rgba(147,197,253,0.35); color: rgba(5,12,24,0.95); }
         .tb-btn.primary:hover{ background: linear-gradient(135deg, rgba(59,130,246,0.95), rgba(34,211,238,0.75)); }
+
+        .tb-switch{ display:flex; align-items:center; gap:10px; padding: 8px 12px; border-radius: 999px;
+          background: rgba(15,23,42,0.55); border: 1px solid rgba(96,165,250,0.22);
+          color: rgba(255,255,255,0.9); font-weight: 800; font-size: 12px; }
+        .tb-switch .label{ color: rgba(191,219,254,0.9); }
+        .tb-toggle{ width: 46px; height: 26px; border-radius: 999px; position: relative; border: 1px solid rgba(96,165,250,0.25);
+          background: rgba(30,41,59,0.65); cursor: pointer; transition: background .12s ease, opacity .12s ease; }
+        .tb-toggle.disabled{ opacity: .55; cursor: not-allowed; }
+        .tb-knob{ width: 22px; height: 22px; border-radius: 999px; position: absolute; top: 1px; left: 1px;
+          background: rgba(226,232,240,0.95); transition: transform .14s ease; box-shadow: 0 6px 14px rgba(0,0,0,0.22); }
+        .tb-toggle.on{ background: rgba(37,99,235,0.85); border-color: rgba(147,197,253,0.45); }
+        .tb-toggle.on .tb-knob{ transform: translateX(20px); }
 
         .tb-backdrop{ position: fixed; inset: 0; background: rgba(2,6,23,0.72); backdrop-filter: blur(6px);
@@ -202,39 +211,61 @@
       <div className="tb-wrap">
         <div className="tb-inner">
-          <div className="tb-brand">
-            <div className="tb-badge">🛡️</div>
-            <div>
-              <h1 className="tb-title">LAN Security Monitor</h1>
-              <p className="tb-sub">
-                Sysmon Edition • <span>{prettyTime}</span>
-              </p>
-              {me?.email && (
-                <p className="tb-sub" style={{ marginTop: 4, opacity: 0.9 }}>
-                  Signed in as <span>{me.email}</span>
-                  {me.role ? ` • ${me.role}` : ""}
-                </p>
-              )}
+          <div>
+            <img
+              src={logo}
+              alt="NETIntel logo"
+              className="netintel-logo"
+              width={150}
+              style={{ marginTop: 10 }}
+            />
+            <div style={{ marginTop: 4, fontSize: 12, color: "rgba(191,219,254,0.8)", fontWeight: 800 }}>
+              <span style={{ color: "rgba(96,165,250,0.95)" }}>{prettyTime}</span>
+              {me?.email ? (
+                <span style={{ marginLeft: 10 }}>
+                  • {me.email}
+                  {me?.role ? ` • ${me.role}` : ""}
+                </span>
+              ) : null}
             </div>
           </div>
-          <div>
-            <img
-                src={logo}
-                alt="NETIntel logo"
-                className="netintel-logo"
-                width={150}
-                style={{marginTop: 10 }}
-            />
-          </div>
-
-
 
           <div className="tb-actions">
-            <span className="tb-pill">
+            <span className="tb-pill" title="Selected environment">
               <span className="dot" />
               Env: {selectedEnv}
             </span>
+
+            {/* NEW: Save process history switch */}
+            <div className="tb-switch" title={isAdmin ? "Toggle saving process history for this environment" : "Only admin can change this"}>
+              <span className="label">Proc history</span>
+              <div
+                className={[
+                  "tb-toggle",
+                  saveProcHistory ? "on" : "",
+                  !isAdmin ? "disabled" : "",
+                ].join(" ")}
+                role="switch"
+                aria-checked={saveProcHistory ? "true" : "false"}
+                tabIndex={0}
+                onClick={() => {
+                  if (!isAdmin) return;
+                  onToggleProcHistory?.(!saveProcHistory);
+                }}
+                onKeyDown={(e) => {
+                  if (!isAdmin) return;
+                  if (e.key === "Enter" || e.key === " ") {
+                    e.preventDefault();
+                    onToggleProcHistory?.(!saveProcHistory);
+                  }
+                }}
+              >
+                <div className="tb-knob" />
+              </div>
+            </div>
+
             <button className="tb-btn" onClick={onRefresh} disabled={busy}>
               Refresh
             </button>
+
             <button
               className="tb-btn"
@@ -252,4 +283,5 @@
               Admin
             </button>
+
             <button className="tb-btn primary" onClick={onOpenAI}>
               AI Assistant
@@ -298,4 +330,6 @@
                   <div className="tb-help">
                     Овој env ќе се користи за dashboard филтрирање + token generation.
+                    <br />
+                    <b>Proc history</b> switch горе важи за тековниот env.
                   </div>
                 </div>