[APP-539] Rework lightbox and alt-image behaviors (#573)

* Replace the long press on the lightbox with footer controls

* Remove long-press from images in the feed

* Tune the lightbox footer control ui

* Replace the AltImageRead modal with the ability to view all alt text in the lightbox footer

* Tune lightbox footer for iOS

* Add alt text to the web lightbox

* Fix lint

* a11y slight changes

---------

Co-authored-by: renahlee <renahlee@outlook.com>

1 files changed, 0 insertions, 80 deletions

diff --git a/src/view/com/modals/AltImageRead.tsx b/src/view/com/modals/AltImageRead.tsx
deleted file mode 100644
index 985477287..000000000
--- a/src/view/com/modals/AltImageRead.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-import React, {useCallback} from 'react'
-import {StyleSheet, View} from 'react-native'
-import {usePalette} from 'lib/hooks/usePalette'
-import {gradients, s} from 'lib/styles'
-import {Text} from '../util/text/Text'
-import {TouchableOpacity} from 'react-native-gesture-handler'
-import LinearGradient from 'react-native-linear-gradient'
-import {useStores} from 'state/index'
-import {isDesktopWeb} from 'platform/detection'
-
-export const snapPoints = ['70%']
-
-interface Props {
-  altText: string
-}
-
-export function Component({altText}: Props) {
-  const pal = usePalette('default')
-  const store = useStores()
-
-  const onPress = useCallback(() => {
-    store.shell.closeModal()
-  }, [store])
-
-  return (
-    <View
-      testID="altTextImageModal"
-      style={[pal.view, styles.container, s.flex1]}>
-      <Text style={[styles.title, pal.text]}>Image description</Text>
-      <View style={[styles.text, pal.viewLight]}>
-        <Text style={pal.text}>{altText}</Text>
-      </View>
-      <TouchableOpacity
-        testID="altTextImageSaveBtn"
-        onPress={onPress}
-        accessibilityRole="button"
-        accessibilityLabel="Done"
-        accessibilityHint="Closes alt text modal">
-        <LinearGradient
-          colors={[gradients.blueLight.start, gradients.blueLight.end]}
-          start={{x: 0, y: 0}}
-          end={{x: 1, y: 1}}
-          style={[styles.button]}>
-          <Text type="button-lg" style={[s.white, s.bold]}>
-            Done
-          </Text>
-        </LinearGradient>
-      </TouchableOpacity>
-    </View>
-  )
-}
-
-const styles = StyleSheet.create({
-  container: {
-    gap: 18,
-    paddingVertical: isDesktopWeb ? 0 : 18,
-    paddingHorizontal: isDesktopWeb ? 0 : 12,
-    height: '100%',
-    width: '100%',
-  },
-  title: {
-    textAlign: 'center',
-    fontWeight: 'bold',
-    fontSize: 24,
-  },
-  text: {
-    borderRadius: 5,
-    marginVertical: 18,
-    paddingHorizontal: 18,
-    paddingVertical: 16,
-  },
-  button: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center',
-    width: '100%',
-    borderRadius: 32,
-    padding: 10,
-  },
-})