diff --git a/apps/webapp/src/i18n/en-US.json b/apps/webapp/src/i18n/en-US.json
index a434345d77c..daa4aaf177e 100644
--- a/apps/webapp/src/i18n/en-US.json
+++ b/apps/webapp/src/i18n/en-US.json
@@ -111,6 +111,7 @@
"accessibility.conversationDetailsActionGroupAdminLabel": "Set group admin",
"accessibility.conversationDetailsActionNotificationsLabel": "Show notifications settings",
"accessibility.conversationDetailsCloseLabel": "Close image details view",
+ "accessibility.conversationMuted": "Muted",
"accessibility.conversationOptionsMenu": "Open conversation options",
"accessibility.conversationOptionsMenuAccessKey": "Use right arrow key to focus on the conversation options menu",
"accessibility.conversationStatusMuted": "Muted conversation",
diff --git a/apps/webapp/src/script/components/ConversationListCell/ConversationListCell.tsx b/apps/webapp/src/script/components/ConversationListCell/ConversationListCell.tsx
index b6177654a0a..de5746ec737 100644
--- a/apps/webapp/src/script/components/ConversationListCell/ConversationListCell.tsx
+++ b/apps/webapp/src/script/components/ConversationListCell/ConversationListCell.tsx
@@ -104,6 +104,21 @@ export const ConversationListCell = ({
const [focusContextMenu, setContextMenuFocus] = useState(false);
const [isContextMenuOpen, setContextMenuOpen] = useState(false);
const contextMenuKeyboardShortcut = `keyboard-shortcut-${conversation.id}`;
+ const unreadMessagesCount = unreadState.allMessages.length;
+ const isMutedConversation = !conversation.showNotificationsEverything();
+ const accessibilityParts = [displayName];
+
+ if (unreadMessagesCount > 0) {
+ accessibilityParts.push(`${unreadMessagesCount} ${t('conversationLabelUnread')}`);
+ }
+
+ if (isMutedConversation) {
+ accessibilityParts.push(t('accessibility.conversationMuted'));
+ }
+
+ const accessibilityConversationLabel = `${accessibilityParts.join(', ')}. ${t('accessibility.openConversation', {
+ name: displayName,
+ })}`;
// Ref for immediate synchronous protection from multiple clicks
const isJoiningCallRef = useRef(false);
@@ -133,7 +148,7 @@ export const ConversationListCell = ({
await onJoinCall(conversation, MediaType.AUDIO);
isJoiningCallRef.current = false;
});
- } catch (error: unknown) {
+ } catch {
// Re-enable on error
isJoiningCallRef.current = false;
}
@@ -196,7 +211,7 @@ export const ConversationListCell = ({
onKeyDown={handleDivKeyDown}
data-uie-name="go-open-conversation"
tabIndex={isFocused ? TabIndex.FOCUSABLE : TabIndex.UNFOCUSABLE}
- aria-label={t('accessibility.openConversation', {name: displayName})}
+ aria-label={accessibilityConversationLabel}
aria-describedby={contextMenuKeyboardShortcut}
>
diff --git a/apps/webapp/src/script/components/ConversationListCell/components/StatusIcon/StatusIcon.tsx b/apps/webapp/src/script/components/ConversationListCell/components/StatusIcon/StatusIcon.tsx
index 5d5d418a8a9..675618ca3d2 100644
--- a/apps/webapp/src/script/components/ConversationListCell/components/StatusIcon/StatusIcon.tsx
+++ b/apps/webapp/src/script/components/ConversationListCell/components/StatusIcon/StatusIcon.tsx
@@ -97,6 +97,7 @@ export const StatusIcon = ({conversation}: Props) => {
className="conversation-list-cell-badge cell-badge-light conversation-muted"
data-uie-name="status-silence"
title={t('accessibility.conversationStatusMuted')}
+ aria-hidden="true"
>
diff --git a/apps/webapp/src/types/i18n.d.ts b/apps/webapp/src/types/i18n.d.ts
index 4f45efda108..b26a240c729 100644
--- a/apps/webapp/src/types/i18n.d.ts
+++ b/apps/webapp/src/types/i18n.d.ts
@@ -115,6 +115,7 @@ declare module 'I18n/en-US.json' {
'accessibility.conversationDetailsActionGroupAdminLabel': `Set group admin`;
'accessibility.conversationDetailsActionNotificationsLabel': `Show notifications settings`;
'accessibility.conversationDetailsCloseLabel': `Close image details view`;
+ 'accessibility.conversationMuted': `Muted`;
'accessibility.conversationOptionsMenu': `Open conversation options`;
'accessibility.conversationOptionsMenuAccessKey': `Use right arrow key to focus on the conversation options menu`;
'accessibility.conversationStatusMuted': `Muted conversation`;