Skip to content

Commit a5e522c

Browse files
committed
fix(mobile): separate undo toast accessibility targets
1 parent d65e06e commit a5e522c

1 file changed

Lines changed: 15 additions & 13 deletions

File tree

‎apps/mobile/src/features/home/ThreadUndoNotice.android.tsx‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { useLayoutEffect, useState } from "react";
2+
import { StyleSheet, View } from "react-native";
23
import { GestureDetector, usePanGesture } from "react-native-gesture-handler";
34
import Animated, {
45
cancelAnimation,
@@ -102,19 +103,20 @@ function SwipeableUndoNotice(props: {
102103
}}
103104
>
104105
<GestureDetector gesture={gesture}>
105-
<Animated.View
106-
collapsable={false}
107-
entering={noticeEntering}
108-
accessible
109-
accessibilityRole="alert"
110-
accessibilityLiveRegion="assertive"
111-
accessibilityLabel={`${notice.action} thread`}
112-
style={animatedStyle}
113-
accessibilityActions={[{ name: "dismiss", label: "Dismiss message" }]}
114-
onAccessibilityAction={({ nativeEvent }) => {
115-
if (nativeEvent.actionName === "dismiss") dismiss();
116-
}}
117-
>
106+
<Animated.View collapsable={false} entering={noticeEntering} style={animatedStyle}>
107+
{/* Keep the dismiss target separate so TalkBack can also focus Undo. */}
108+
<View
109+
accessible
110+
accessibilityRole="alert"
111+
accessibilityLiveRegion="assertive"
112+
accessibilityLabel={`${notice.action} thread`}
113+
accessibilityActions={[{ name: "dismiss", label: "Dismiss message" }]}
114+
onAccessibilityAction={({ nativeEvent }) => {
115+
if (nativeEvent.actionName === "dismiss") dismiss();
116+
}}
117+
pointerEvents="none"
118+
style={StyleSheet.absoluteFill}
119+
/>
118120
<Toast
119121
message={`${notice.action} thread`}
120122
action={{ label: "Undo", onPress: () => void notice.undo() }}

0 commit comments

Comments
 (0)