HotPlate/discord-rpg-concept
1
0
Fork 0
forked from syntaxbullet/AuroraBot-discord
Code Pull Requests Activity

feat: implement administrative control panel with real-time bot actions

Browse Source
This commit is contained in:
syntaxbullet
2026-01-08 21:19:16 +01:00
parent 3f3a6c88e8
commit 0f6cce9b6e
14 changed files with 499 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
web/src/pages/Dashboard.tsx
View File

@@ -7,6 +7,7 @@ import {
} from "@/components/ui/card";
import { Activity, Server, Users, Zap } from "lucide-react";
import { useDashboardStats } from "@/hooks/use-dashboard-stats";
import { ControlPanel } from "@/components/ControlPanel";
export function Dashboard() {
const { stats, loading, error } = useDashboardStats();
@@ -122,45 +123,52 @@ export function Dashboard() {
</CardContent>
</Card>
<Card className="col-span-3 glass border-white/5 overflow-hidden">
<CardHeader className="bg-white/[0.02] border-b border-white/5">
<CardTitle className="text-xl font-bold">Recent Events</CardTitle>
<CardDescription className="text-white/30">Live system activity feed</CardDescription>
</CardHeader>
<CardContent className="p-0">
<div className="divide-y divide-white/5">
{stats.recentEvents.length === 0 ? (
<div className="p-8 text-center bg-transparent">
<p className="text-sm text-white/20 font-medium">No activity recorded</p>
</div>
) : (
stats.recentEvents.slice(0, 6).map((event, i) => (
<div key={i} className="flex items-start gap-4 p-4 hover:bg-white/[0.03] transition-colors group">
<div className={`mt-1 p-2 rounded-lg ${event.type === 'success' ? 'bg-emerald-500/10 text-emerald-500' :
event.type === 'error' ? 'bg-red-500/10 text-red-500' :
'bg-blue-500/10 text-blue-500'
} group-hover:scale-110 transition-transform`}>
<div className="text-lg leading-none">{event.icon}</div>
</div>
<div className="space-y-1 flex-1">
<p className="text-sm font-semibold text-white/90 leading-tight">
{event.message}
</p>
<p className="text-[10px] font-bold text-white/20 uppercase tracking-wider">
{new Date(event.timestamp).toLocaleTimeString()}
</p>
</div>
<div className="col-span-3 flex flex-col gap-6">
{/* Administrative Control Panel */}
<ControlPanel maintenanceMode={stats.maintenanceMode} />
{/* Recent Events Feed */}
<Card className="glass border-white/5 overflow-hidden flex-1">
<CardHeader className="bg-white/[0.02] border-b border-white/5">
<CardTitle className="text-xl font-bold">Recent Events</CardTitle>
<CardDescription className="text-white/30">Live system activity feed</CardDescription>
</CardHeader>
<CardContent className="p-0">
<div className="divide-y divide-white/5">
{stats.recentEvents.length === 0 ? (
<div className="p-8 text-center bg-transparent">
<p className="text-sm text-white/20 font-medium">No activity recorded</p>
</div>
))
) : (
stats.recentEvents.slice(0, 6).map((event, i) => (
<div key={i} className="flex items-start gap-4 p-4 hover:bg-white/[0.03] transition-colors group">
<div className={`mt-1 p-2 rounded-lg ${event.type === 'success' ? 'bg-emerald-500/10 text-emerald-500' :
event.type === 'error' ? 'bg-red-500/10 text-red-500' :
event.type === 'warn' ? 'bg-yellow-500/10 text-yellow-500' :
'bg-blue-500/10 text-blue-500'
} group-hover:scale-110 transition-transform`}>
<div className="text-lg leading-none">{event.icon}</div>
</div>
<div className="space-y-1 flex-1">
<p className="text-sm font-semibold text-white/90 leading-tight">
{event.message}
</p>
<p className="text-[10px] font-bold text-white/20 uppercase tracking-wider">
{new Date(event.timestamp).toLocaleTimeString()}
</p>
</div>
</div>
))
)}
</div>
{stats.recentEvents.length > 0 && (
<button className="w-full py-3 text-[10px] font-bold uppercase tracking-[0.2em] text-white/20 hover:text-primary hover:bg-white/[0.02] transition-all border-t border-white/5">
View Event Logs
</button>
)}
</div>
{stats.recentEvents.length > 0 && (
<button className="w-full py-3 text-[10px] font-bold uppercase tracking-[0.2em] text-white/20 hover:text-primary hover:bg-white/[0.02] transition-all border-t border-white/5">
View Event Logs
</button>
)}
</CardContent>
</Card>
</CardContent>
</Card>
</div>
</div>
</div>
);