From 11eb06c5ad56127b1e465fd5ec78f351b8dabef7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Br=C3=BCckner?= <j.brueckner@airitsystems.de>
Date: Fri, 5 Jun 2026 09:20:52 +0200
Subject: [PATCH] fix(logbook): system filter as proper type button, default
 hides system entries

---
 src/components/Logbook.tsx | 39 ++++++++++++++++++--------------------
 1 file changed, 18 insertions(+), 21 deletions(-)

diff --git a/src/components/Logbook.tsx b/src/components/Logbook.tsx
index e54be35..3a2a6d6 100644
--- a/src/components/Logbook.tsx
+++ b/src/components/Logbook.tsx
@@ -20,8 +20,7 @@ interface LogbookProps {
 
 export default function Logbook({ logs, devices, users, currentUser, onAddLog }: LogbookProps) {
   const [searchTerm, setSearchTerm] = useState('');
-  const [typeFilter, setTypeFilter] = useState<string>('all');
-  const [showSystem, setShowSystem] = useState(false);
+  const [typeFilter, setTypeFilter] = useState<string>('non-system');
   
   // Custom Maintenance Log state
   const [showAddLog, setShowAddLog] = useState(false);
@@ -33,9 +32,11 @@ export default function Logbook({ logs, devices, users, currentUser, onAddLog }:
 
   // Filter logs
   const filteredLogs = sortedLogs.filter(log => {
-    if (!showSystem && log.type === 'system') return false;
     const matchesSearch = log.message.toLowerCase().includes(searchTerm.toLowerCase());
-    const matchesType = typeFilter === 'all' || log.type === typeFilter;
+    const matchesType =
+      typeFilter === 'all' ? true :
+      typeFilter === 'non-system' ? log.type !== 'system' :
+      log.type === typeFilter;
     return matchesSearch && matchesType;
   });
 
@@ -124,30 +125,26 @@ export default function Logbook({ logs, devices, users, currentUser, onAddLog }:
             />
           </div>
           <div className="flex gap-1 shrink-0 text-xs font-medium flex-wrap">
-            {['all', 'booking', 'maintenance', 'status'].map((type) => (
+            {[
+              { key: 'non-system', label: 'All' },
+              { key: 'booking',    label: 'Booking' },
+              { key: 'maintenance',label: 'Maintenance' },
+              { key: 'status',     label: 'Status' },
+              { key: 'system',     label: 'System' },
+              { key: 'all',        label: 'All incl. System' },
+            ].map(({ key, label }) => (
               <button
-                key={type}
-                onClick={() => setTypeFilter(type)}
-                className={`px-3 py-1.5 rounded-lg text-xs font-medium capitalize transition-all ${
-                  typeFilter === type
+                key={key}
+                onClick={() => setTypeFilter(key)}
+                className={`px-3 py-1.5 rounded-lg text-xs font-medium transition-all ${
+                  typeFilter === key
                     ? 'bg-emerald-500/15 border border-emerald-500 text-emerald-400'
                     : 'bg-slate-950 text-slate-400 border border-slate-850 hover:bg-slate-850 hover:text-white'
                 }`}
               >
-                {type === 'all' ? 'All' : getLogTypeLabel(type)}
+                {label}
               </button>
             ))}
-            <button
-              onClick={() => setShowSystem(v => !v)}
-              className={`px-3 py-1.5 rounded-lg text-xs font-medium transition-all ${
-                showSystem
-                  ? 'bg-slate-700/40 border border-slate-600 text-slate-300'
-                  : 'bg-slate-950 text-slate-600 border border-slate-850 hover:text-slate-400'
-              }`}
-              title="Show/hide automated system & CheckMK entries"
-            >
-              System
-            </button>
           </div>
         </div>