Use a constant for the max amount of avatars to display in a group

Renaud Chaput 2024-06-14 23:40:46 +02:00
parent a885a2e824
commit 32bb2d20eb
No known key found for this signature in database
GPG Key ID: BCFC859D49B46990
3 changed files with 12 additions and 3 deletions

View File

@ -1,6 +1,7 @@
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 }) => {
@ -19,7 +20,7 @@ export const AvatarGroup: React.FC<{ accountIds: string[] }> = ({
accountIds,
}) => (
<div className='notification-group__avatar-group'>
{accountIds.slice(0, 7).map((accountId) => (
{accountIds.slice(0, NOTIFICATIONS_GROUP_MAX_AVATARS).map((accountId) => (
<AvatarWrapper key={accountId} accountId={accountId} />
))}
</div>

View File

@ -9,6 +9,10 @@ import type {
} from 'mastodon/api_types/notifications';
import type { ApiReportJSON } from 'mastodon/api_types/reports';
// Maximum number of avatars displayed in a notification group
// This corresponds to the max lenght of `group.sampleAccountsIds`
export const NOTIFICATIONS_GROUP_MAX_AVATARS = 6;
interface BaseNotificationGroup
extends Omit<BaseNotificationGroupJSON, 'sample_accounts'> {
sampleAccountsIds: string[];

View File

@ -6,6 +6,7 @@ import {
processNewNotificationForGroups,
} from 'mastodon/actions/notification_groups';
import {
NOTIFICATIONS_GROUP_MAX_AVATARS,
createNotificationGroupFromJSON,
createNotificationGroupFromNotificationJSON,
} from 'mastodon/models/notification_group';
@ -84,8 +85,11 @@ export const notificationsGroupsReducer =
if (existingGroup && existingGroup.type !== 'gap') {
// Update the existing group
existingGroup.sampleAccountsIds.unshift(notification.account.id);
existingGroup.sampleAccountsIds.pop();
if (
existingGroup.sampleAccountsIds.unshift(notification.account.id) >
NOTIFICATIONS_GROUP_MAX_AVATARS
)
existingGroup.sampleAccountsIds.pop();
existingGroup.most_recent_notification_id = notification.id;
existingGroup.page_max_id = notification.id;