diff options
author | Paul Frazee <pfrazee@gmail.com> | 2023-07-03 15:57:53 -0500 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-07-03 15:57:53 -0500 |
commit | bc55241c9ae731f633f8b93a9b7eac7635070148 (patch) | |
tree | 2f75cf5fc31bb8214f848a4326c1af731000b842 /src/view/com/post-thread/PostThreadItem.tsx | |
parent | 0163ba0af8cd42e2a76b3ae66efc0777afdc2544 (diff) | |
download | voidsky-bc55241c9ae731f633f8b93a9b7eac7635070148.tar.zst |
[APP-724] Collection of accessibility fixes (#949)
* Fix: include alt text on the web lightbox image * a11y: Dont read the 'ALT' label * a11y: remove a wrapper behavior from posts This appears to have been introduced with the goal of creating meta actions on posts, but the behavior seems counter-productive. The accessibility inspector was unable to access individual items within the post and therefore most content was simply skipped. There may be a way to support the post actions without losing the ability to access the inner elements but I couldnt find it. -prf * a11y: apply alt tags to image wrappers so they get read * a11y: set Link accessibilityLabel to the title if none set * a11y: skip the SANDBOX watermark * a11y: improve post meta to not read UI and give a useful date * ally: improve post controls * a11y: add labels to lightbox images on mobile * fix types
Diffstat (limited to 'src/view/com/post-thread/PostThreadItem.tsx')
-rw-r--r-- | src/view/com/post-thread/PostThreadItem.tsx | 46 |
1 files changed, 4 insertions, 42 deletions
diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx index 83a51f7aa..e1c73c0d5 100644 --- a/src/view/com/post-thread/PostThreadItem.tsx +++ b/src/view/com/post-thread/PostThreadItem.tsx @@ -1,6 +1,6 @@ -import React, {useCallback, useMemo} from 'react' +import React, {useMemo} from 'react' import {observer} from 'mobx-react-lite' -import {AccessibilityActionEvent, Linking, StyleSheet, View} from 'react-native' +import {Linking, StyleSheet, View} from 'react-native' import Clipboard from '@react-native-clipboard/clipboard' import {AtUri, AppBskyFeedDefs} from '@atproto/api' import { @@ -138,40 +138,6 @@ export const PostThreadItem = observer(function PostThreadItem({ ) }, [item, store]) - const accessibilityActions = useMemo( - () => [ - { - name: 'reply', - label: 'Reply', - }, - { - name: 'repost', - label: item.post.viewer?.repost ? 'Undo repost' : 'Repost', - }, - {name: 'like', label: item.post.viewer?.like ? 'Unlike' : 'Like'}, - ], - [item.post.viewer?.like, item.post.viewer?.repost], - ) - - const onAccessibilityAction = useCallback( - (event: AccessibilityActionEvent) => { - switch (event.nativeEvent.actionName) { - case 'like': - onPressToggleLike() - break - case 'reply': - onPressReply() - break - case 'repost': - onPressToggleRepost() - break - default: - break - } - }, - [onPressReply, onPressToggleLike, onPressToggleRepost], - ) - if (!record) { return <ErrorMessage message="Invalid or unsupported post record" /> } @@ -193,9 +159,7 @@ export const PostThreadItem = observer(function PostThreadItem({ <PostHider testID={`postThreadItem-by-${item.post.author.handle}`} style={[styles.outer, styles.outerHighlighted, pal.border, pal.view]} - moderation={item.moderation.thread} - accessibilityActions={accessibilityActions} - onAccessibilityAction={onAccessibilityAction}> + moderation={item.moderation.thread}> <PostSandboxWarning /> <View style={styles.layout}> <View style={styles.layoutAvi}> @@ -369,9 +333,7 @@ export const PostThreadItem = observer(function PostThreadItem({ pal.view, item._showParentReplyLine && styles.noTopBorder, ]} - moderation={item.moderation.thread} - accessibilityActions={accessibilityActions} - onAccessibilityAction={onAccessibilityAction}> + moderation={item.moderation.thread}> {item._showParentReplyLine && ( <View style={[ |