React Native accessibility (#539)

* React Native accessibility

* First round of changes

* Latest update

* Checkpoint

* Wrap up

* Lint

* Remove unhelpful image hints

* Fix navigation

* Fix rebase and lint

* Mitigate an known issue with the password entry in login

* Fix composer dismiss

* Remove focus on input elements for web

* Remove i and npm

* pls work

* Remove stray declaration

* Regenerate yarn.lock

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>

1 files changed, 16 insertions, 3 deletions

diff --git a/src/view/com/modals/Repost.tsx b/src/view/com/modals/Repost.tsx
index d5ed66b70..b1862ecbd 100644
--- a/src/view/com/modals/Repost.tsx
+++ b/src/view/com/modals/Repost.tsx
@@ -18,6 +18,7 @@ export function Component({
   onRepost: () => void
   onQuote: () => void
   isReposted: boolean
+  // TODO: Add author into component
 }) {
   const store = useStores()
   const pal = usePalette('default')
@@ -31,7 +32,10 @@ export function Component({
         <TouchableOpacity
           testID="repostBtn"
           style={[styles.actionBtn]}
-          onPress={onRepost}>
+          onPress={onRepost}
+          accessibilityRole="button"
+          accessibilityLabel={isReposted ? 'Undo repost' : 'Repost'}
+          accessibilityHint={isReposted ? 'Remove repost' : 'Repost '}>
           <RepostIcon strokeWidth={2} size={24} style={s.blue3} />
           <Text type="title-lg" style={[styles.actionBtnLabel, pal.text]}>
             {!isReposted ? 'Repost' : 'Undo repost'}
@@ -40,14 +44,23 @@ export function Component({
         <TouchableOpacity
           testID="quoteBtn"
           style={[styles.actionBtn]}
-          onPress={onQuote}>
+          onPress={onQuote}
+          accessibilityRole="button"
+          accessibilityLabel="Quote post"
+          accessibilityHint="">
           <FontAwesomeIcon icon="quote-left" size={24} style={s.blue3} />
           <Text type="title-lg" style={[styles.actionBtnLabel, pal.text]}>
             Quote Post
           </Text>
         </TouchableOpacity>
       </View>
-      <TouchableOpacity testID="cancelBtn" onPress={onPress}>
+      <TouchableOpacity
+        testID="cancelBtn"
+        onPress={onPress}
+        accessibilityRole="button"
+        accessibilityLabel="Cancel quote post"
+        accessibilityHint=""
+        onAccessibilityEscape={onPress}>
         <LinearGradient
           colors={[gradients.blueLight.start, gradients.blueLight.end]}
           start={{x: 0, y: 0}}