jbrueckner/GhostGrid
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(logbook): system filter as proper type button, default hides system entries

Browse Source
This commit is contained in:
Brückner
2026-06-05 09:20:52 +02:00
parent ea9e6c1d46
commit 11eb06c5ad
1 changed files with 18 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/components/Logbook.tsx
View File

@ -20,8 +20,7 @@ interface LogbookProps {
export default function Logbook({ logs, devices, users, currentUser, onAddLog }: LogbookProps) { export default function Logbook({ logs, devices, users, currentUser, onAddLog }: LogbookProps) {
const [searchTerm, setSearchTerm] = useState(''); const [searchTerm, setSearchTerm] = useState('');
const [typeFilter, setTypeFilter] = useState<string>('all'); const [typeFilter, setTypeFilter] = useState<string>('non-system');
const [showSystem, setShowSystem] = useState(false);
// Custom Maintenance Log state // Custom Maintenance Log state
const [showAddLog, setShowAddLog] = useState(false); const [showAddLog, setShowAddLog] = useState(false);
@ -33,9 +32,11 @@ export default function Logbook({ logs, devices, users, currentUser, onAddLog }:
// Filter logs // Filter logs
const filteredLogs = sortedLogs.filter(log => { const filteredLogs = sortedLogs.filter(log => {
if (!showSystem && log.type === 'system') return false;
const matchesSearch = log.message.toLowerCase().includes(searchTerm.toLowerCase()); 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; return matchesSearch && matchesType;
}); });
@ -124,30 +125,26 @@ export default function Logbook({ logs, devices, users, currentUser, onAddLog }:
/> />
</div> </div>
<div className="flex gap-1 shrink-0 text-xs font-medium flex-wrap"> <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 <button
key={type} key={key}
onClick={() => setTypeFilter(type)} onClick={() => setTypeFilter(key)}
className={`px-3 py-1.5 rounded-lg text-xs font-medium capitalize transition-all ${ className={`px-3 py-1.5 rounded-lg text-xs font-medium transition-all ${
typeFilter === type typeFilter === key
? 'bg-emerald-500/15 border border-emerald-500 text-emerald-400' ? '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' : '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>
))} ))}
<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>
</div> </div>