Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Grouped Notifications UI (#30440)

Browse source 
Co-authored-by: Eugen Rochko <eugen@zeonfederated.com>
Co-authored-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Renaud Chaput 2024-07-18 16:36:09 +02:00 • committed by GitHub
parent 7d090b2ab6
commit f587ff643f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
65 changed files with 3329 additions and 131 deletions
Download patch file Download diff file Expand all files Collapse all files

31
app/javascript/mastodon/features/notifications_v2/components/avatar_group.tsx Normal file
View file

@ -0,0 +1,31 @@
import { Link } from 'react-router-dom';
import { Avatar } from 'mastodon/components/avatar';
import { NOTIFICATIONS_GROUP_MAX_AVATARS } from 'mastodon/models/notification_group';
import { useAppSelector } from 'mastodon/store';
const AvatarWrapper: React.FC<{ accountId: string }> = ({ accountId }) => {
const account = useAppSelector((state) => state.accounts.get(accountId));
if (!account) return null;
return (
<Link
to={`/@${account.acct}`}
title={`@${account.acct}`}
data-hover-card-account={account.id}
>
<Avatar account={account} size={28} />
</Link>
);
};
export const AvatarGroup: React.FC<{ accountIds: string[] }> = ({
accountIds,
}) => (
<div className='notification-group__avatar-group'>
{accountIds.slice(0, NOTIFICATIONS_GROUP_MAX_AVATARS).map((accountId) => (
<AvatarWrapper key={accountId} accountId={accountId} />
))}
</div>
);