OpenSource/mastodon
OpenSource/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2024-12-22 22:15:23 +01:00
Code Issues Projects Releases Packages Wiki Activity

Display description of first captioned media in notifications

Browse source
This commit is contained in:
Claire 2024-08-30 14:21:49 +02:00
parent 3ddeaca863
commit d52abc6a13
3 changed files with 79 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

98
app/javascript/mastodon/features/notifications_v2/components/embedded_status.tsx
View file

@ -19,6 +19,11 @@ import { useAppSelector, useAppDispatch } from 'mastodon/store';
import { EmbeddedStatusContent } from './embedded_status_content';
export type Mention = RecordOf<{ url: string; acct: string }>;
export type MediaAttachment = RecordOf<{
id: string;
type: string;
description?: string;
}>;
export const EmbeddedStatus: React.FC<{ statusId: string }> = ({
statusId,
@ -114,9 +119,72 @@ export const EmbeddedStatus: React.FC<{ statusId: string }> = ({
const language = status.get('language') as string;
const mentions = status.get('mentions') as ImmutableList<Mention>;
const expanded = !status.get('hidden') || !contentWarning;
const mediaAttachmentsSize = (
status.get('media_attachments') as ImmutableList<unknown>
).size;
const mediaAttachments = status.get(
'media_attachments',
) as ImmutableList<MediaAttachment>;
const mediaAttachmentsSize = mediaAttachments.size;
const mediaAttachmentDescription = mediaAttachments.find(
(attachment) => !!attachment.get('description'),
)?.get('description');
const mediaAttachmentsList = [];
if (expanded) {
if (poll) {
mediaAttachmentsList.push(
<div
className='notification-group__embedded-status__attachments reply-indicator__attachments'
key='poll-indicator'
>
<Icon icon={BarChart4BarsIcon} id='bar-chart-4-bars' />
<FormattedMessage id='reply_indicator.poll' defaultMessage='Poll' />
</div>,
);
}
if (mediaAttachmentDescription) {
mediaAttachmentsList.push(
<div
className='notification-group__embedded-status__attachments reply-indicator__attachments'
key='media-description-indicator'
>
<Icon icon={PhotoLibraryIcon} id='photo-library' />
<span>
{mediaAttachmentDescription}
</span>
</div>,
);
if (mediaAttachmentsSize > 1) {
mediaAttachmentsList.push(
<div
className='notification-group__embedded-status__attachments reply-indicator__attachments'
key='media-other-indicator'
>
<Icon icon={PhotoLibraryIcon} id='photo-library' />
<FormattedMessage
id='reply_indicator.and_other_attachments'
defaultMessage='and {count, plural, one {# other attachment} other {# other attachments}}'
values={{ count: mediaAttachmentsSize - 1 }}
/>
</div>,
);
}
} else if (mediaAttachmentsSize > 0) {
mediaAttachmentsList.push(
<div
className='notification-group__embedded-status__attachments reply-indicator__attachments'
key='media-indicator'
>
<Icon icon={PhotoLibraryIcon} id='photo-library' />
<FormattedMessage
id='reply_indicator.attachments'
defaultMessage='{count, plural, one {# attachment} other {# attachments}}'
values={{ count: mediaAttachmentsSize }}
/>
</div>,
);
}
}
return (
<div
@ -150,29 +218,7 @@ export const EmbeddedStatus: React.FC<{ statusId: string }> = ({
/>
)}
{expanded && (poll || mediaAttachmentsSize > 0) && (
<div className='notification-group__embedded-status__attachments reply-indicator__attachments'>
{!!poll && (
<>
<Icon icon={BarChart4BarsIcon} id='bar-chart-4-bars' />
<FormattedMessage
id='reply_indicator.poll'
defaultMessage='Poll'
/>
</>
)}
{mediaAttachmentsSize > 0 && (
<>
<Icon icon={PhotoLibraryIcon} id='photo-library' />
<FormattedMessage
id='reply_indicator.attachments'
defaultMessage='{count, plural, one {# attachment} other {# attachments}}'
values={{ count: mediaAttachmentsSize }}
/>
</>
)}
</div>
)}
{mediaAttachmentsList}
</div>
);
};

1
app/javascript/mastodon/locales/en.json
View file

@ -687,6 +687,7 @@
"relative_time.minutes": "{number}m",
"relative_time.seconds": "{number}s",
"relative_time.today": "today",
"reply_indicator.and_other_attachments": "and {count, plural, one {# other attachment} other {# other attachments}}",
"reply_indicator.attachments": "{count, plural, one {# attachment} other {# attachments}}",
"reply_indicator.cancel": "Cancel",
"reply_indicator.poll": "Poll",

6
app/javascript/styles/mastodon/components.scss
View file

@ -10644,6 +10644,12 @@ noscript {
font-size: 15px;
line-height: 22px;
color: $dark-text-color;
span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
}