refactor: remove realtime visitors detail page
Remove the individual session journey page and make the live visitor count a static indicator. Prepares for the new aggregated User Journeys feature (v0.17).
This commit is contained in:
@@ -1,19 +1,11 @@
|
||||
'use client'
|
||||
|
||||
import { useRouter } from 'next/navigation'
|
||||
|
||||
interface RealtimeVisitorsProps {
|
||||
count: number
|
||||
siteId?: string
|
||||
}
|
||||
|
||||
export default function RealtimeVisitors({ count, siteId }: RealtimeVisitorsProps) {
|
||||
const router = useRouter()
|
||||
|
||||
export default function RealtimeVisitors({ count }: RealtimeVisitorsProps) {
|
||||
return (
|
||||
<div
|
||||
onClick={() => siteId && router.push(`/sites/${siteId}/realtime`)}
|
||||
className={`bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-2xl p-6 ${siteId ? 'cursor-pointer hover:border-neutral-300 dark:hover:border-neutral-700 transition-colors' : ''}`}
|
||||
<div
|
||||
className="bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-2xl p-6"
|
||||
>
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<div className="text-sm text-neutral-600 dark:text-neutral-400">
|
||||
|
||||
@@ -26,7 +26,7 @@ export default function SiteNav({ siteId }: SiteNavProps) {
|
||||
|
||||
const isActive = (href: string) => {
|
||||
if (href === `/sites/${siteId}`) {
|
||||
return pathname === href || pathname === `${href}/realtime`
|
||||
return pathname === href
|
||||
}
|
||||
return pathname.startsWith(href)
|
||||
}
|
||||
|
||||
@@ -166,78 +166,6 @@ export function DashboardSkeleton() {
|
||||
)
|
||||
}
|
||||
|
||||
// ─── Realtime page skeleton ──────────────────────────────────
|
||||
|
||||
export function RealtimeSkeleton() {
|
||||
return (
|
||||
<div className="w-full max-w-6xl mx-auto px-4 sm:px-6 pb-8 h-[calc(100vh-64px)] flex flex-col">
|
||||
<div className="mb-6">
|
||||
<SkeletonLine className="h-4 w-32 mb-2" />
|
||||
<SkeletonLine className="h-8 w-64" />
|
||||
</div>
|
||||
<div className="flex flex-col md:flex-row flex-1 gap-6 min-h-0">
|
||||
{/* Visitors list */}
|
||||
<div className="w-full md:w-1/3 border border-neutral-200 dark:border-neutral-800 rounded-2xl overflow-hidden flex flex-col bg-white dark:bg-neutral-900">
|
||||
<div className="p-4 border-b border-neutral-200 dark:border-neutral-800">
|
||||
<SkeletonLine className="h-6 w-32" />
|
||||
</div>
|
||||
<div className="p-2 space-y-1">
|
||||
{Array.from({ length: 6 }).map((_, i) => (
|
||||
<div key={i} className="p-4 space-y-2">
|
||||
<div className="flex justify-between">
|
||||
<SkeletonLine className="h-4 w-32" />
|
||||
<SkeletonLine className="h-4 w-16" />
|
||||
</div>
|
||||
<SkeletonLine className="h-3 w-48" />
|
||||
<div className="flex gap-2">
|
||||
<SkeletonLine className="h-3 w-16" />
|
||||
<SkeletonLine className="h-3 w-16" />
|
||||
<SkeletonLine className="h-3 w-16" />
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
{/* Session details */}
|
||||
<div className="flex-1 border border-neutral-200 dark:border-neutral-800 rounded-2xl overflow-hidden bg-white dark:bg-neutral-900">
|
||||
<div className="p-4 border-b border-neutral-200 dark:border-neutral-800">
|
||||
<SkeletonLine className="h-6 w-40" />
|
||||
</div>
|
||||
<div className="p-6 space-y-6">
|
||||
{Array.from({ length: 5 }).map((_, i) => (
|
||||
<div key={i} className="flex gap-4 pl-6">
|
||||
<SkeletonCircle className="h-3 w-3 shrink-0 mt-1" />
|
||||
<div className="space-y-1 flex-1">
|
||||
<SkeletonLine className="h-4 w-48" />
|
||||
<SkeletonLine className="h-3 w-32" />
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ─── Session events skeleton (for loading events panel) ──────
|
||||
|
||||
export function SessionEventsSkeleton() {
|
||||
return (
|
||||
<div className="relative pl-6 border-l-2 border-neutral-100 dark:border-neutral-800 space-y-8">
|
||||
{Array.from({ length: 5 }).map((_, i) => (
|
||||
<div key={i} className="relative">
|
||||
<span className={`absolute -left-[29px] top-1 h-3 w-3 rounded-full ${SK}`} />
|
||||
<div className="space-y-1">
|
||||
<SkeletonLine className="h-4 w-48" />
|
||||
<SkeletonLine className="h-3 w-32" />
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ─── Uptime page skeleton ────────────────────────────────────
|
||||
|
||||
export function UptimeSkeleton() {
|
||||
|
||||
Reference in New Issue
Block a user