Skip to content

Improve Giphy preview TalkBack accessibility #6483

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
andremion wants to merge 5 commits into
base: develop
Choose a base branch
from
Open

Improve Giphy preview TalkBack accessibility #6483

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
14c847e
Announce Giphy alt text to TalkBack
andremion Jun 1, 2026
ca07128
Focus the Giphy preview bubble for TalkBack on appearance
andremion Jun 1, 2026
4ddd44b
Announce Giphy preview action state changes to TalkBack
andremion Jun 2, 2026
03801fc
Add snapshot coverage for Giphy preview composables
andremion Jun 2, 2026
52f8842
Merge branch 'develop' into fix/compose-giphy-preview-a11y
andremion Jun 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 14 additions & 6 deletions stream-chat-android-compose/api/stream-chat-android-compose.api
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -477,7 +477,6 @@ public final class io/getstream/chat/android/compose/ui/attachments/content/Comp
public static final field INSTANCE Lio/getstream/chat/android/compose/ui/attachments/content/ComposableSingletons$GiphyAttachmentContentKt;
public fun <init> ()V
public final fun getLambda$-573709398$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
public final fun getLambda$271803750$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
}

public final class io/getstream/chat/android/compose/ui/attachments/content/ComposableSingletons$LinkAttachmentContentKt {
Expand Down Expand Up @@ -525,7 +524,7 @@ public final class io/getstream/chat/android/compose/ui/attachments/content/Giph
}

public final class io/getstream/chat/android/compose/ui/attachments/content/GiphyAttachmentContentKt {
public static final fun GiphyAttachmentContent (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;Lio/getstream/chat/android/ui/common/utils/GiphyInfoType;Lio/getstream/chat/android/ui/common/utils/GiphySizingMode;Landroidx/compose/ui/layout/ContentScale;Lkotlin/jvm/functions/Function1;Landroidx/compose/runtime/Composer;II)V
public static final fun GiphyAttachmentContent (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;Lio/getstream/chat/android/ui/common/utils/GiphyInfoType;Lio/getstream/chat/android/ui/common/utils/GiphySizingMode;Landroidx/compose/ui/layout/ContentScale;ZLkotlin/jvm/functions/Function1;Landroidx/compose/runtime/Composer;II)V
}

public final class io/getstream/chat/android/compose/ui/attachments/content/LinkAttachmentClickData {
Expand Down Expand Up @@ -1516,6 +1515,13 @@ public final class io/getstream/chat/android/compose/ui/components/messageoption
public static final fun defaultMessageOptionsState (Lio/getstream/chat/android/models/Message;Lio/getstream/chat/android/models/User;ZLio/getstream/chat/android/models/Channel;Landroidx/compose/runtime/Composer;I)Ljava/util/List;
}

public final class io/getstream/chat/android/compose/ui/components/messages/ComposableSingletons$GiphyMessageContentKt {
public static final field INSTANCE Lio/getstream/chat/android/compose/ui/components/messages/ComposableSingletons$GiphyMessageContentKt;
public fun <init> ()V
public final fun getLambda$-2094128661$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
public final fun getLambda$-223271185$stream_chat_android_compose_release ()Lkotlin/jvm/functions/Function2;
}

public final class io/getstream/chat/android/compose/ui/components/messages/ComposableSingletons$MessageAnnotationKt {
public static final field INSTANCE Lio/getstream/chat/android/compose/ui/components/messages/ComposableSingletons$MessageAnnotationKt;
public fun <init> ()V
Expand Down Expand Up @@ -3930,13 +3936,15 @@ public final class io/getstream/chat/android/compose/ui/theme/FileAttachmentItem

public final class io/getstream/chat/android/compose/ui/theme/GiphyAttachmentContentParams {
public static final field $stable I
public fun <init> (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;)V
public synthetic fun <init> (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;ILkotlin/jvm/internal/DefaultConstructorMarker;)V
public fun <init> (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;Z)V
public synthetic fun <init> (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;ZILkotlin/jvm/internal/DefaultConstructorMarker;)V
public final fun component1 ()Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;
public final fun component2 ()Landroidx/compose/ui/Modifier;
public final fun copy (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;)Lio/getstream/chat/android/compose/ui/theme/GiphyAttachmentContentParams;
public static synthetic fun copy$default (Lio/getstream/chat/android/compose/ui/theme/GiphyAttachmentContentParams;Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;ILjava/lang/Object;)Lio/getstream/chat/android/compose/ui/theme/GiphyAttachmentContentParams;
public final fun component3 ()Z
public final fun copy (Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;Z)Lio/getstream/chat/android/compose/ui/theme/GiphyAttachmentContentParams;
public static synthetic fun copy$default (Lio/getstream/chat/android/compose/ui/theme/GiphyAttachmentContentParams;Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;Landroidx/compose/ui/Modifier;ZILjava/lang/Object;)Lio/getstream/chat/android/compose/ui/theme/GiphyAttachmentContentParams;
public fun equals (Ljava/lang/Object;)Z
public final fun getInteractive ()Z
public final fun getModifier ()Landroidx/compose/ui/Modifier;
public final fun getState ()Lio/getstream/chat/android/compose/state/messages/attachments/AttachmentState;
public fun hashCode ()I
Expand Down
51 changes: 34 additions & 17 deletions ...n/java/io/getstream/chat/android/compose/ui/attachments/content/GiphyAttachmentContent.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,8 @@ import io.getstream.chat.android.ui.common.utils.giphyInfo
* the default Giphy width and height dimensions, however you can still clip maximum dimensions.
* Setting it to fixed size mode will make it respect all given dimensions.
* @param contentScale Used to determine the way Giphys are scaled inside the [Image] composable.
* @param interactive When `true` (default), the container is clickable and long-clickable. When
* `false`, both handlers are disabled.
* @param onItemClick Lambda called when an item gets clicked (no-action by default).
*/
@OptIn(ExperimentalFoundationApi::class)
Expand All @@ -94,6 +96,7 @@ public fun GiphyAttachmentContent(
giphyInfoType: GiphyInfoType = GiphyInfoType.ORIGINAL,
giphySizingMode: GiphySizingMode = GiphySizingMode.ADAPTIVE,
contentScale: ContentScale = ContentScale.Crop,
interactive: Boolean = true,
onItemClick: (GiphyAttachmentClickData) -> Unit = {},
) {
val context = LocalContext.current
Expand All @@ -115,6 +118,7 @@ public fun GiphyAttachmentContent(
val giphyDimensions: DpSize = calculateSize(giphyInfo, giphySizingMode)

val shouldBeFullSize = message.shouldBeDisplayedAsFullSizeAttachment()
val interactionSource = remember { MutableInteractionSource() }
Box(
modifier = modifier
.testTag("Stream_GiphyContent")
Expand All @@ -123,26 +127,34 @@ public fun GiphyAttachmentContent(
padding(MessageStyling.messageSectionPadding)
.clip(RoundedCornerShape(StreamTokens.radiusLg))
}
.combinedClickable(
indication = ripple(),
interactionSource = remember { MutableInteractionSource() },
onClick = {
onItemClick(
GiphyAttachmentClickData(
context = context,
url = previewUrl,
attachment = attachment,
message = message,
),
)
},
onLongClick = { state.onLongItemClick(message) },
),
// Workaround: `interactive` gates `combinedClickable` so the ephemeral preview path
// can disable the clickable (its inner click and long-click are no-ops there) and let
// the surrounding bubble announce as a single TalkBack focus. The proper fix is to
// make `onItemClick` (and `AttachmentState.onLongItemClick`) nullable and gate on
// `!= null`, but that is a binary-breaking type change on a published API. Revisit in
// v8 and drop `interactive` once the handlers are nullable.
.applyIf(interactive) {
combinedClickable(
indication = ripple(),
interactionSource = interactionSource,
onClick = {
onItemClick(
GiphyAttachmentClickData(
context = context,
url = previewUrl,
attachment = attachment,
message = message,
),
)
},
onLongClick = { state.onLongItemClick(message) },
)
},
) {
StreamAsyncImage(
data = giphyInfo?.url,
modifier = Modifier.fillMaxSize(),
contentDescription = null,
contentDescription = attachment.title?.takeIf(String::isNotBlank),
contentScale = contentScale,
)

Expand Down Expand Up @@ -288,7 +300,10 @@ private fun GiphyAttachmentContentPreview() {
}

@Composable
internal fun GiphyAttachmentContent() {
internal fun GiphyAttachmentContent(
interactive: Boolean = true,
title: String? = "Funny cat",
) {
val previewHandler = AsyncImagePreviewHandler {
ColorImage(color = Color.Red.toArgb(), width = 200, height = 150)
}
Expand All @@ -301,10 +316,12 @@ internal fun GiphyAttachmentContent() {
Attachment(
titleLink = "https://giphy.com/gifs/funny-cat-3oEjI6SIIHBdRxXI40",
type = AttachmentType.GIPHY,
title = title,
),
),
),
),
interactive = interactive,
)
}
}
Loading
Loading