[a11y] Add long click label

bmarty · bmarty · commit 5d81a0264bf5 · 2025-07-04T09:34:14.000+02:00
diff --git a/features/home/impl/src/main/kotlin/io/element/android/features/home/impl/components/RoomSummaryRow.kt b/features/home/impl/src/main/kotlin/io/element/android/features/home/impl/components/RoomSummaryRow.kt
@@ -173,6 +173,7 @@ private fun RoomSummaryScaffoldRow(
     val clickModifier = Modifier.combinedClickable(
         onClick = { onClick(room) },
         onLongClick = { onLongClick(room) },
+        onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
         indication = ripple(),
         interactionSource = remember { MutableInteractionSource() }
     )
diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessageStateEventContainer.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessageStateEventContainer.kt
@@ -17,10 +17,12 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 import io.element.android.libraries.designsystem.theme.components.Surface
+import io.element.android.libraries.ui.strings.CommonStrings
 
 private val CORNER_RADIUS = 8.dp
 
@@ -41,6 +43,7 @@ fun MessageStateEventContainer(
             .combinedClickable(
                 onClick = onClick,
                 onLongClick = onLongClick,
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
                 indication = ripple(),
                 interactionSource = interactionSource
             ),
diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessagesReactionButton.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/MessagesReactionButton.kt
@@ -51,6 +51,7 @@ import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.matrix.api.media.MediaSource
 import io.element.android.libraries.matrix.ui.media.MediaRequestData
+import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
 @Suppress("ModifierClickableOrder") // This is needed to display the right ripple shape
@@ -103,6 +104,7 @@ fun MessagesReactionButton(
                         userAlreadyReacted = content.isHighlighted
                     )
                 },
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
                 onLongClick = onLongClick
             )
             // Inner border, to highlight when selected
diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemCallNotifyView.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemCallNotifyView.kt
@@ -51,7 +51,12 @@ internal fun TimelineItemCallNotifyView(
         modifier = modifier
             .fillMaxWidth()
             .border(1.dp, ElementTheme.colors.borderInteractiveSecondary, RoundedCornerShape(8.dp))
-            .combinedClickable(enabled = true, onClick = {}, onLongClick = { onLongClick(event) })
+            .combinedClickable(
+                enabled = true,
+                onClick = {},
+                onLongClick = { onLongClick(event) },
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
+            )
             .padding(12.dp),
         horizontalArrangement = Arrangement.spacedBy(12.dp),
         verticalAlignment = Alignment.CenterVertically,
diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemRow.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/TimelineItemRow.kt
@@ -145,14 +145,15 @@ internal fun TimelineItemRow(
                                 // Custom clickable that applies over the whole item for accessibility
                                 .then(
                                     if (isTalkbackActive()) {
-                                    Modifier.combinedClickable(
-                                    onClick = { onContentClick(timelineItem) },
-                                    onLongClick = { onLongClick(timelineItem) }
-                                    )
-                                } else {
-                                    Modifier
-                                }
-                            ),
+                                        Modifier.combinedClickable(
+                                            onClick = { onContentClick(timelineItem) },
+                                            onLongClick = { onLongClick(timelineItem) },
+                                            onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
+                                        )
+                                    } else {
+                                        Modifier
+                                    }
+                                ),
                             event = timelineItem,
                             timelineRoomInfo = timelineRoomInfo,
                             renderReadReceipts = renderReadReceipts,
diff --git a/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemStickerView.kt b/features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemStickerView.kt
@@ -66,7 +66,17 @@ fun TimelineItemStickerView(
                     modifier = Modifier
                         .fillMaxSize()
                         .then(if (isLoaded) Modifier.background(Color.White) else Modifier)
-                        .then(if (onContentClick != null) Modifier.combinedClickable(onClick = onContentClick, onLongClick = onLongClick) else Modifier),
+                        .then(
+                            if (onContentClick != null) {
+                                Modifier
+                                    .combinedClickable(
+                                        onClick = onContentClick,
+                                        onLongClick = onLongClick,
+                                        onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),                                    )
+                            } else {
+                                Modifier
+                            }
+                        ),
                     model = MediaRequestData(
                         source = content.preferredMediaSource,
                         kind = MediaRequestData.Kind.File(
diff --git a/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/AudioItemView.kt b/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/AudioItemView.kt
@@ -23,6 +23,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
@@ -35,6 +36,7 @@ import io.element.android.libraries.designsystem.theme.components.HorizontalDivi
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.mediaviewer.impl.model.MediaItem
+import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
 fun AudioItemView(
@@ -77,7 +79,11 @@ private fun FilenameRow(
                 color = ElementTheme.colors.bgSubtleSecondary,
                 shape = RoundedCornerShape(12.dp),
             )
-            .combinedClickable(onClick = onClick, onLongClick = onLongClick)
+            .combinedClickable(
+                onClick = onClick,
+                onLongClick = onLongClick,
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
+            )
             .fillMaxWidth()
             .padding(start = 12.dp, end = 36.dp, top = 8.dp, bottom = 8.dp),
         verticalAlignment = Alignment.CenterVertically,
diff --git a/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/FileItemView.kt b/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/FileItemView.kt
@@ -23,6 +23,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
@@ -35,6 +36,7 @@ import io.element.android.libraries.designsystem.theme.components.HorizontalDivi
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.mediaviewer.impl.model.MediaItem
+import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
 fun FileItemView(
@@ -77,7 +79,11 @@ private fun FilenameRow(
                 color = ElementTheme.colors.bgSubtleSecondary,
                 shape = RoundedCornerShape(12.dp),
             )
-            .combinedClickable(onClick = onClick, onLongClick = onLongClick)
+            .combinedClickable(
+                onClick = onClick,
+                onLongClick = onLongClick,
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
+            )
             .fillMaxWidth()
             .padding(start = 12.dp, end = 36.dp, top = 8.dp, bottom = 8.dp),
         verticalAlignment = Alignment.CenterVertically,
diff --git a/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/ImageItemView.kt b/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/ImageItemView.kt
@@ -21,12 +21,14 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.res.stringResource
 import coil3.compose.AsyncImage
 import coil3.compose.AsyncImagePainter
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 import io.element.android.libraries.mediaviewer.impl.model.MediaItem
 import io.element.android.libraries.mediaviewer.impl.model.aMediaItemImage
+import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
 fun ImageItemView(
@@ -38,7 +40,11 @@ fun ImageItemView(
     Box(
         modifier = modifier
             .aspectRatio(1f)
-            .combinedClickable(onClick = onClick, onLongClick = onLongClick),
+            .combinedClickable(
+                onClick = onClick,
+                onLongClick = onLongClick,
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
+            ),
     ) {
         var isLoaded by remember { mutableStateOf(false) }
         AsyncImage(
diff --git a/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/VideoItemView.kt b/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/VideoItemView.kt
@@ -26,6 +26,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import coil3.compose.AsyncImage
@@ -37,6 +38,7 @@ import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.mediaviewer.impl.model.MediaItem
+import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
 fun VideoItemView(
@@ -48,7 +50,11 @@ fun VideoItemView(
     Box(
         modifier = modifier
             .aspectRatio(1f)
-            .combinedClickable(onClick = onClick, onLongClick = onLongClick),
+            .combinedClickable(
+                onClick = onClick,
+                onLongClick = onLongClick,
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
+            ),
     ) {
         var isLoaded by remember { mutableStateOf(false) }
         AsyncImage(
diff --git a/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/VoiceItemView.kt b/libraries/mediaviewer/impl/src/main/kotlin/io/element/android/libraries/mediaviewer/impl/gallery/ui/VoiceItemView.kt
@@ -100,7 +100,11 @@ private fun VoiceInfoRow(
                 color = ElementTheme.colors.bgSubtleSecondary,
                 shape = RoundedCornerShape(12.dp),
             )
-            .combinedClickable(onClick = {}, onLongClick = onLongClick)
+            .combinedClickable(
+                onClick = {},
+                onLongClick = onLongClick,
+                onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),
+            )
             .fillMaxWidth()
             .padding(start = 12.dp, end = 36.dp, top = 8.dp, bottom = 8.dp),
         verticalAlignment = Alignment.CenterVertically,
diff --git a/libraries/ui-strings/src/main/res/values/localazy.xml b/libraries/ui-strings/src/main/res/values/localazy.xml
@@ -101,6 +101,7 @@
   <string name="action_no">"No"</string>
   <string name="action_not_now">"Not now"</string>
   <string name="action_ok">"OK"</string>
+  <string name="action_open_context_menu">"Open context menu"</string>
   <string name="action_open_settings">"Settings"</string>
   <string name="action_open_with">"Open with"</string>
   <string name="action_pin">"Pin"</string>

Original file line number	Diff line number	Diff line change
`@@ -173,6 +173,7 @@ private fun RoomSummaryScaffoldRow(`
`173`	`173`	`val clickModifier = Modifier.combinedClickable(`
`174`	`174`	`onClick = { onClick(room) },`
`175`	`175`	`onLongClick = { onLongClick(room) },`
	`176`	`+ onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),`
`176`	`177`	`indication = ripple(),`
`177`	`178`	`interactionSource = remember { MutableInteractionSource() }`
`178`	`179`	`)`
Original file line number	Diff line number	Diff line change
`@@ -51,6 +51,7 @@ import io.element.android.libraries.designsystem.theme.components.Surface`
`51`	`51`	`import io.element.android.libraries.designsystem.theme.components.Text`
`52`	`52`	`import io.element.android.libraries.matrix.api.media.MediaSource`
`53`	`53`	`import io.element.android.libraries.matrix.ui.media.MediaRequestData`
	`54`	`+import io.element.android.libraries.ui.strings.CommonStrings`
`54`	`55`
`55`	`56`	`@Composable`
`56`	`57`	`@Suppress("ModifierClickableOrder") // This is needed to display the right ripple shape`
`@@ -103,6 +104,7 @@ fun MessagesReactionButton(`
`103`	`104`	`userAlreadyReacted = content.isHighlighted`
`104`	`105`	`)`
`105`	`106`	`},`
	`107`	`+ onLongClickLabel = stringResource(CommonStrings.action_open_context_menu),`
`106`	`108`	`onLongClick = onLongClick`
`107`	`109`	`)`
`108`	`110`	`// Inner border, to highlight when selected`