+ {/* Filter bar */}
+
+
+
+ {total()} total events
+
+
+
{err()}
+
+ {/* Table */}
+
+
+
+
+ | Time |
+ Type |
+ Reason |
+ Message excerpt |
+ User ID |
+
+
+
+
+
+ | No guard events found. |
+
+
+
+ {(ev: any) => {
+ const typeInfo = GUARD_TYPE_LABELS[ev.guard_type] ?? { label: ev.guard_type, color: '#6b7280' };
+ return (
+
+ |
+ {new Date(ev.created_at).toLocaleString()}
+ |
+
+
+ {typeInfo.label}
+
+ |
+ {ev.reason} |
+
+ {ev.message_excerpt}
+ |
+
+ {ev.user_id ? ev.user_id.slice(0, 8) + 'β¦' : 'β'}
+ |
+
+ );
+ }}
+
+
+
+
+
+ {/* Pagination */}
+
LIMIT}>
+
+
+
+ {offset() + 1}β{Math.min(offset() + LIMIT, total())} of {total()}
+
+
+
+
);
}