Merge pull request #7135 from element-hq/fix/a11y-message-composer

Fix accessibility for message composer input and read receipts button

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/receipt/TimelineItemReadReceiptView.kt

@@ -25,9 +25,10 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.res.pluralStringResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.semantics.Role
 import androidx.compose.ui.semantics.clearAndSetSemantics
 import androidx.compose.ui.semantics.contentDescription
-import androidx.compose.ui.semantics.hideFromAccessibility
+import androidx.compose.ui.semantics.role
 import androidx.compose.ui.semantics.testTag
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
@@ -57,18 +58,12 @@ fun TimelineItemReadReceiptView(
     modifier: Modifier = Modifier,
 ) {
     if (state.receipts.isNotEmpty()) {
-        ReadReceiptsRow(
+        ReadReceiptsRow(modifier = modifier) {
-            modifier = modifier.clearAndSetSemantics {
-                hideFromAccessibility()
-            }
-        ) {
             ReadReceiptsAvatars(
                 receipts = state.receipts,
                 modifier = Modifier
                     .clip(RoundedCornerShape(4.dp))
-                    .clickable {
+                    .clickable(onClick = onReadReceiptsClick)
-                        onReadReceiptsClick()
-                    }
                     .padding(2.dp)
             )
         }
@@ -140,6 +135,7 @@ private fun ReadReceiptsAvatars(
             .clearAndSetSemantics {
                 testTag = TestTags.messageReadReceipts.value
                 contentDescription = receiptDescription
+                role = Role.Button
             },
         horizontalArrangement = Arrangement.spacedBy(4.dp - avatarStrokeSize),
         verticalAlignment = Alignment.CenterVertically,

libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/components/markdown/MarkdownTextInput.kt

@@ -93,6 +93,7 @@ fun MarkdownTextInput(
                 setText(text)
                 setHint(placeholder)
                 setHintTextColor(ColorStateList.valueOf(placeholderColor.toArgb()))
+                contentDescription = placeholder
                 inputType = InputType.TYPE_CLASS_TEXT or
                     InputType.TYPE_TEXT_FLAG_CAP_SENTENCES or
                     InputType.TYPE_TEXT_FLAG_MULTI_LINE or
@@ -129,6 +130,7 @@ fun MarkdownTextInput(
             }
         },
         update = { editText ->
+            editText.contentDescription = placeholder
             editText.applyStyleInCompose(richTextEditorStyle)
             val text = state.text.value()
             mentionSpanUpdater.updateMentionSpans(text)