Files
Epicnabbo-Catalogus-Updated…/src/app/admin/users/[id]/user-rooms.tsx
T
openhands 7a41775c7e fix: disable route prefetching app-wide to avoid spurious requests
Wrap next/link in a shared Link component that ships prefetch=false by
default, so no route is ever prefetched (viewport or hover) anymore, and
drop the DNS prefetch hint. Removes hidden background requests that were
the source of intermittent issues.
2026-08-29 19:27:13 +02:00

76 lines
1.9 KiB
TypeScript

import { DoorOpen, Users } from "lucide-react";
import Link from "@/components/link";
import { Badge } from "@/components/ui/badge";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
interface UserRoom {
id: number;
name: string;
state: string;
users: number;
usersMax: number;
}
interface UserRoomsProps {
rooms: UserRoom[];
}
const stateColors: Record<
string,
"default" | "secondary" | "outline" | "destructive"
> = {
open: "default",
locked: "secondary",
password: "destructive",
invisible: "outline",
};
export function UserRooms({ rooms }: UserRoomsProps) {
return (
<Card>
<CardHeader>
<CardTitle className="flex items-center gap-2">
<DoorOpen className="h-4 w-4" />
Rooms ({rooms.length})
</CardTitle>
</CardHeader>
<CardContent>
{rooms.length === 0 ? (
<p className="text-sm text-muted-foreground">
This user doesn&apos;t own any rooms.
</p>
) : (
<div className="grid gap-2 sm:grid-cols-2">
{rooms.map((room) => (
<Link
key={room.id}
href={`/admin/rooms/${room.id}`}
className="flex items-center gap-3 rounded-lg border px-3 py-2.5 hover:bg-muted/50 transition-colors"
>
<div className="flex-1 min-w-0">
<p className="text-sm font-medium truncate">{room.name}</p>
<div className="flex items-center gap-2 mt-0.5">
<Badge
variant={stateColors[room.state] || "outline"}
className="text-[10px]"
>
{room.state}
</Badge>
<span className="text-xs text-muted-foreground flex items-center gap-1">
<Users className="h-3 w-3" />
{room.users}/{room.usersMax}
</span>
</div>
</div>
<span className="text-xs font-mono text-muted-foreground">
#{room.id}
</span>
</Link>
))}
</div>
)}
</CardContent>
</Card>
);
}