import Image from "next/image"; import Link from "next/link"; interface UserItem { id: string; username: string | null; displayUsername: string | null; image: string | null; bio: string | null; } interface UserListProps { users: UserItem[]; emptyMessage: string; } export function UserList({ users, emptyMessage }: UserListProps) { if (users.length === 0) { return (
{emptyMessage}
); } return (
{users.map((user) => ( {user.image ? (
{user.displayUsername
) : (
{(user.displayUsername || user.username || "U")[0].toUpperCase()}
)}
{user.displayUsername || user.username || "Anonymous"}
{user.username && (
@{user.username}
)} {user.bio && (
{user.bio}
)}
))}
); }