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, 18 insertions, 2 deletions

diff --git a/src/view/shell/desktop/RightNav.tsx b/src/view/shell/desktop/RightNav.tsx
index 7a3388f88..142f01163 100644
--- a/src/view/shell/desktop/RightNav.tsx
+++ b/src/view/shell/desktop/RightNav.tsx
@@ -61,7 +61,14 @@ export const DesktopRightNav = observer(function DesktopRightNav() {
       <View>
         <TouchableOpacity
           style={[styles.darkModeToggle]}
-          onPress={onDarkmodePress}>
+          onPress={onDarkmodePress}
+          accessibilityRole="button"
+          accessibilityLabel="Toggle dark mode"
+          accessibilityHint={
+            mode === 'Dark'
+              ? 'Sets display to light mode'
+              : 'Sets display to dark mode'
+          }>
           <View style={[pal.viewLight, styles.darkModeToggleIcon]}>
             <MoonIcon size={18} style={pal.textLight} />
           </View>
@@ -78,13 +85,22 @@ const InviteCodes = observer(() => {
   const store = useStores()
   const pal = usePalette('default')
 
+  const {invitesAvailable} = store.me
+
   const onPress = React.useCallback(() => {
     store.shell.openModal({name: 'invite-codes'})
   }, [store])
   return (
     <TouchableOpacity
       style={[styles.inviteCodes, pal.border]}
-      onPress={onPress}>
+      onPress={onPress}
+      accessibilityRole="button"
+      accessibilityLabel={
+        invitesAvailable === 1
+          ? 'Invite codes: 1 available'
+          : `Invite codes: ${invitesAvailable} available`
+      }
+      accessibilityHint="Opens list of invite codes">
       <FontAwesomeIcon
         icon="ticket"
         style={[