This commit is contained in:
Simo committed
1 parent
21a61068fb
commit
60278b9e71
38 files changed
+3452
No files matched your search
@@ -0,0 +1,191 @@
|
||||
import { ArrowLeftRight, Clock, DoorOpen, MessageSquare, TrendingUp, Users } from 'lucide-react'
|
||||
import dynamic from 'next/dynamic'
|
||||
import { redirect } from 'next/navigation'
|
||||
import { StatsCard } from '@/components/admin/stats-card'
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
|
||||
import { Skeleton } from '@/components/ui/skeleton'
|
||||
import { canAccess, getAdminContext, PERMS } from '@/lib/permissions'
|
||||
import { prisma } from '@/lib/prisma'
|
||||
|
||||
const DashboardChart = dynamic(
|
||||
() => import('@/components/admin/dashboard-chart').then((m) => ({ default: m.DashboardChart })),
|
||||
{ loading: () => <Skeleton className="h-[300px] w-full rounded-xl" /> },
|
||||
)
|
||||
|
||||
const PeakHoursHeatmap = dynamic(
|
||||
() =>
|
||||
import('@/components/admin/peak-hours-heatmap').then((m) => ({ default: m.PeakHoursHeatmap })),
|
||||
{ loading: () => <Skeleton className="h-[250px] w-full rounded-xl" /> },
|
||||
)
|
||||
|
||||
async function getAnalyticsData() {
|
||||
const now = Math.floor(Date.now() / 1000)
|
||||
const todayStart = now - (now % 86400)
|
||||
const weekAgo = now - 7 * 86400
|
||||
const monthAgo = now - 30 * 86400
|
||||
|
||||
const [
|
||||
totalUsers,
|
||||
onlineUsers,
|
||||
weekRegistrations,
|
||||
monthRegistrations,
|
||||
totalRooms,
|
||||
activeRooms,
|
||||
weekChatMessages,
|
||||
weekTrades,
|
||||
weekBans,
|
||||
] = await Promise.all([
|
||||
prisma.user.count(),
|
||||
prisma.user.count({ where: { online: '1' } }),
|
||||
prisma.user.count({ where: { accountCreated: { gte: weekAgo } } }),
|
||||
prisma.user.count({ where: { accountCreated: { gte: monthAgo } } }),
|
||||
prisma.rooms.count(),
|
||||
prisma.rooms.count({ where: { users: { gt: 0 } } }),
|
||||
prisma.$queryRaw<{ count: bigint }[]>`SELECT COUNT(*) AS count FROM chatlogs_room WHERE timestamp >= ${weekAgo}`,
|
||||
prisma.roomTradeLog.count({ where: { timestamp: { gte: weekAgo } } }),
|
||||
prisma.ban.count({ where: { timestamp: { gte: weekAgo } } }),
|
||||
])
|
||||
|
||||
// Registration chart (30 days) — single GROUP BY query instead of 30 sequential queries
|
||||
const regRows = await prisma.$queryRaw<{ day_bucket: bigint; count: bigint }[]>`
|
||||
SELECT FLOOR(account_created / 86400) AS day_bucket, COUNT(*) AS count
|
||||
FROM users
|
||||
WHERE account_created >= ${monthAgo}
|
||||
GROUP BY day_bucket ORDER BY day_bucket
|
||||
`
|
||||
const regCountMap = new Map(regRows.map((r) => [Number(r.day_bucket), Number(r.count)]))
|
||||
const registrationChart = []
|
||||
for (let i = 29; i >= 0; i--) {
|
||||
const dayStart = todayStart - i * 86400
|
||||
const bucket = Math.floor(dayStart / 86400)
|
||||
const date = new Date(dayStart * 1000)
|
||||
registrationChart.push({
|
||||
label: date.toLocaleDateString('en', { month: 'short', day: 'numeric' }),
|
||||
value: regCountMap.get(bucket) ?? 0,
|
||||
})
|
||||
}
|
||||
|
||||
// Peak hours — single GROUP BY query instead of fetching all user rows
|
||||
const peakRows = await prisma.$queryRaw<{ d: number; h: number; c: bigint }[]>`
|
||||
SELECT ((DAYOFWEEK(FROM_UNIXTIME(last_online)) + 5) % 7) AS d,
|
||||
HOUR(FROM_UNIXTIME(last_online)) AS h,
|
||||
COUNT(*) AS c
|
||||
FROM users
|
||||
WHERE last_online >= ${weekAgo}
|
||||
GROUP BY d, h
|
||||
`
|
||||
const grid: number[][] = Array.from({ length: 7 }, () => Array(24).fill(0))
|
||||
let max = 0
|
||||
for (const r of peakRows) {
|
||||
const count = Number(r.c)
|
||||
grid[r.d][r.h] = count
|
||||
if (count > max) max = count
|
||||
}
|
||||
|
||||
return {
|
||||
totalUsers,
|
||||
onlineUsers,
|
||||
weekRegistrations,
|
||||
monthRegistrations,
|
||||
totalRooms,
|
||||
activeRooms,
|
||||
weekChatMessages: Array.isArray(weekChatMessages) ? Number(weekChatMessages[0]?.count ?? 0) : 0,
|
||||
weekTrades,
|
||||
weekBans,
|
||||
registrationChart,
|
||||
peakHours: { grid, max },
|
||||
}
|
||||
}
|
||||
|
||||
export default async function AnalyticsPage() {
|
||||
const { session, permissions } = await getAdminContext()
|
||||
if (!canAccess(permissions, PERMS.ANALYTICS_VIEW, session.user.rank)) {
|
||||
redirect('/admin')
|
||||
}
|
||||
|
||||
const data = await getAnalyticsData()
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold tracking-tight">Analytics</h1>
|
||||
<p className="text-muted-foreground">Hotel performance overview and trends</p>
|
||||
</div>
|
||||
|
||||
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
|
||||
<StatsCard
|
||||
title="Total Users"
|
||||
value={data.totalUsers.toLocaleString()}
|
||||
description={`${data.onlineUsers} online now`}
|
||||
icon={<Users className="h-4 w-4" />}
|
||||
/>
|
||||
<StatsCard
|
||||
title="Week Registrations"
|
||||
value={data.weekRegistrations.toLocaleString()}
|
||||
description={`${data.monthRegistrations} this month`}
|
||||
icon={<TrendingUp className="h-4 w-4" />}
|
||||
/>
|
||||
<StatsCard
|
||||
title="Active Rooms"
|
||||
value={data.activeRooms.toLocaleString()}
|
||||
description={`${data.totalRooms} total rooms`}
|
||||
icon={<DoorOpen className="h-4 w-4" />}
|
||||
/>
|
||||
<StatsCard
|
||||
title="Weekly Activity"
|
||||
value={data.weekChatMessages.toLocaleString()}
|
||||
description={`${data.weekTrades} trades, ${data.weekBans} bans`}
|
||||
icon={<MessageSquare className="h-4 w-4" />}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid gap-6 md:grid-cols-2">
|
||||
<DashboardChart
|
||||
title="Registrations (30 days)"
|
||||
data={data.registrationChart}
|
||||
color="hsl(262, 83%, 58%)"
|
||||
description="New user registrations over the last 30 days"
|
||||
/>
|
||||
<PeakHoursHeatmap data={data.peakHours} />
|
||||
</div>
|
||||
|
||||
<div className="grid gap-6 md:grid-cols-3">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<MessageSquare className="h-4 w-4" /> Chat Activity
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-3xl font-bold">{data.weekChatMessages.toLocaleString()}</div>
|
||||
<p className="text-sm text-muted-foreground">Messages in the last 7 days</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<ArrowLeftRight className="h-4 w-4" /> Trades
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-3xl font-bold">{data.weekTrades.toLocaleString()}</div>
|
||||
<p className="text-sm text-muted-foreground">Trades in the last 7 days</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<Clock className="h-4 w-4" /> Retention
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-3xl font-bold">
|
||||
{data.totalUsers > 0 ? Math.round((data.onlineUsers / data.totalUsers) * 100) : 0}%
|
||||
</div>
|
||||
<p className="text-sm text-muted-foreground">Users online / total</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in new issue
Block a user