Files
calendar/packages/ui/components/avatar/UserAvatarGroup.tsx
T
Alex van AndelandGitHub be404436d7 fix: Do not self import @calcom/ui (#20050)
* fix: Do not self import @calcom/ui

* Make translations optional

* Fix mocking implementation of Button (never worked)

* Ensure other libraries can resolve AppListCard
2025-03-13 18:17:42 +00:00

32 lines
1.0 KiB
TypeScript

import { getUserAvatarUrl } from "@calcom/lib/getAvatarUrl";
import { getBookerBaseUrlSync } from "@calcom/lib/getBookerUrl/client";
import type { User } from "@calcom/prisma/client";
import type { UserProfile } from "@calcom/types/UserProfile";
import { AvatarGroup } from "./AvatarGroup";
type UserAvatarProps = Omit<React.ComponentProps<typeof AvatarGroup>, "items"> & {
users: (Pick<User, "name" | "username" | "avatarUrl"> & {
profile: Omit<UserProfile, "upId">;
hideTruncatedAvatarsCount?: boolean;
})[];
};
export function UserAvatarGroup(props: UserAvatarProps) {
const { users, ...rest } = props;
return (
<AvatarGroup
{...rest}
items={users.map((user) => ({
href: `${getBookerBaseUrlSync(user.profile?.organization?.slug ?? null)}/${
user.profile?.username
}?redirect=false`,
alt: user.name || "",
title: user.name || "",
image: getUserAvatarUrl(user),
hideTruncatedAvatarsCount: user.hideTruncatedAvatarsCount,
}))}
/>
);
}