[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

src/view/com/util/images/AutoSizedImage.tsx

@@ -64,15 +64,14 @@ export function AutoSizedImage({
         delayPressIn={DELAY_PRESS_IN}
         style={[styles.container, style]}
         accessible={true}
-        accessibilityLabel="Share image"
-        accessibilityHint="Opens ways of sharing image">
+        accessibilityRole="button"
+        accessibilityLabel={alt || 'Image'}
+        accessibilityHint="Tap to view fully">
         <Image
           style={[styles.image, {aspectRatio}]}
           source={uri}
-          accessible={true} // Must set for `accessibilityLabel` to work
+          accessible={false} // Must set for `accessibilityLabel` to work
           accessibilityIgnoresInvertColors
-          accessibilityLabel={alt}
-          accessibilityHint=""
         />
         {children}
       </TouchableOpacity>

src/view/com/util/images/Gallery.tsx

@@ -34,7 +34,7 @@ export const GalleryItem: FC<GalleryItemProps> = ({
         onPressIn={onPressIn ? () => onPressIn(index) : undefined}
         onLongPress={onLongPress ? () => onLongPress(index) : undefined}
         accessibilityRole="button"
-        accessibilityLabel="View image"
+        accessibilityLabel={image.alt || 'Image'}
         accessibilityHint="">
         <Image
           source={{uri: image.thumb}}
@@ -47,7 +47,9 @@ export const GalleryItem: FC<GalleryItemProps> = ({
       </TouchableOpacity>
       {image.alt === '' ? null : (
         <View style={styles.altContainer}>
-          <Text style={styles.alt}>ALT</Text>
+          <Text style={styles.alt} accessible={false}>
+            ALT
+          </Text>
         </View>
       )}
     </View>