Merge branch 'main' of github.com:bluesky-social/social-app into main

README.md

@@ -12,9 +12,9 @@ Get the app itself:
 
 This is a [React Native](https://reactnative.dev/) application, written in the TypeScript programming language. It builds on the `atproto` TypeScript packages (like [`@atproto/api`](https://www.npmjs.com/package/@atproto/api)), code for which is also on open source, but in [a different git repository](https://github.com/bluesky-social/atproto).
 
-There is a small about of Go language source code (in `./bskyweb/`), for a web service that returns the React Native Web application.
+There is a small amount of Go language source code (in `./bskyweb/`), for a web service that returns the React Native Web application.
 
-The [Build Instructions](./docs/builds.md) are a good place to get started with the app itself.
+The [Build Instructions](./docs/build.md) are a good place to get started with the app itself.
 
 The Authenticated Transfer Protocol ("AT Protocol" or "atproto") is a decentralized social media protocol. You don't *need* to understand AT Protocol to work with this application, but it can help. Learn more at:
 

src/state/models/media/image.ts

@@ -166,7 +166,7 @@ export class ImageModel implements Omit<RNImage, 'size'> {
   async crop() {
     try {
       // NOTE
-      // on ios, react-native-image-cropper gives really bad quality
+      // on ios, react-native-image-crop-picker gives really bad quality
       // without specifying width and height. on android, however, the
       // crop stretches incorrectly if you do specify it. these are
       // both separate bugs in the library. we deal with that by

src/view/com/lightbox/ImageViewing/index.tsx

@@ -71,7 +71,6 @@ function ImageViewing({
   const imageList = useRef<VirtualizedList<ImageSource>>(null)
   const [isScaled, setIsScaled] = useState(false)
   const [isDragging, setIsDragging] = useState(false)
-  const [opacity, setOpacity] = useState(1)
   const [currentImageIndex, setImageIndex] = useState(imageIndex)
   const [headerTranslate] = useState(
     () => new Animated.ValueXY(INITIAL_POSITION),
@@ -100,12 +99,6 @@ function ImageViewing({
     }
   }
 
-  const onRequestCloseEnhanced = () => {
-    setOpacity(0)
-    onRequestClose()
-    setTimeout(() => setOpacity(1), 0)
-  }
-
   const onScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {
     const {
       nativeEvent: {
@@ -162,14 +155,14 @@ function ImageViewing({
       aria-modal
       accessibilityViewIsModal>
       <ModalsContainer />
-      <View style={[styles.container, {opacity, backgroundColor}]}>
+      <View style={[styles.container, {backgroundColor}]}>
         <Animated.View style={[styles.header, {transform: headerTransform}]}>
           {typeof HeaderComponent !== 'undefined' ? (
             React.createElement(HeaderComponent, {
               imageIndex: currentImageIndex,
             })
           ) : (
-            <ImageDefaultHeader onRequestClose={onRequestCloseEnhanced} />
+            <ImageDefaultHeader onRequestClose={onRequestClose} />
           )}
         </Animated.View>
         <VirtualizedList
@@ -191,7 +184,7 @@ function ImageViewing({
             <ImageItem
               onZoom={onZoom}
               imageSrc={imageSrc}
-              onRequestClose={onRequestCloseEnhanced}
+              onRequestClose={onRequestClose}
               pinchGestureRef={pinchGestureRefs.get(imageSrc)}
               isScrollViewBeingDragged={isDragging}
             />