38 lines
1.1 KiB
TypeScript
Executable File
38 lines
1.1 KiB
TypeScript
Executable File
import {User} from '@common/auth/user';
|
|
import {Trans} from '@common/i18n/trans';
|
|
import React from 'react';
|
|
import {UserProfileLink} from '@common/users/user-profile-link';
|
|
import {UserAvatar} from '@common/ui/images/user-avatar';
|
|
import {FollowButton} from '@common/users/follow-button';
|
|
|
|
interface Props {
|
|
follower: User;
|
|
}
|
|
export function FollowerListItem({follower}: Props) {
|
|
return (
|
|
<div
|
|
key={follower.id}
|
|
className="flex items-center gap-16 mb-16 pb-16 border-b"
|
|
>
|
|
<UserAvatar user={follower} size="lg" />
|
|
<div className="text-sm">
|
|
<UserProfileLink user={follower} />
|
|
{follower.followers_count && follower.followers_count > 0 ? (
|
|
<div className="text-xs text-muted">
|
|
<Trans
|
|
message="[one 1 followers|other :count followers]"
|
|
values={{count: follower.followers_count}}
|
|
/>
|
|
</div>
|
|
) : null}
|
|
</div>
|
|
<FollowButton
|
|
variant="outline"
|
|
size="xs"
|
|
className="ml-auto"
|
|
user={follower}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|