Fix last frame flash

src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.android.tsx

@@ -58,6 +58,7 @@ type Props = {
       cropFrameTransform: Transform
       cropContentTransform: Transform
       isResting: boolean
+      isHidden: boolean
     }>
   >
 }
@@ -310,7 +311,7 @@ const ImageItem = ({
       )
 
   const containerStyle = useAnimatedStyle(() => {
-    const {scaleAndMoveTransform} = transforms.value
+    const {scaleAndMoveTransform, isHidden} = transforms.value
     // Apply the active adjustments on top of the committed transform before the gestures.
     // This is matrix multiplication, so operations are applied in the reverse order.
     let t = createTransform()
@@ -325,6 +326,7 @@ const ImageItem = ({
     ]
     const screenSize = measureSafeArea()
     return {
+      opacity: isHidden ? 0 : 1,
       transform: scaleAndMoveTransform.concat(manipulationTransform),
       width: screenSize.width,
       maxHeight: screenSize.height,

src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx

@@ -55,6 +55,7 @@ type Props = {
       cropFrameTransform: Transform
       cropContentTransform: Transform
       isResting: boolean
+      isHidden: boolean
     }>
   >
 }
@@ -145,10 +146,11 @@ const ImageItem = ({
   )
 
   const containerStyle = useAnimatedStyle(() => {
-    const {scaleAndMoveTransform} = transforms.value
+    const {scaleAndMoveTransform, isHidden} = transforms.value
     return {
       flex: 1,
       transform: scaleAndMoveTransform,
+      opacity: isHidden ? 0 : 1,
     }
   })
 

src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.tsx

@@ -33,6 +33,7 @@ type Props = {
       cropFrameTransform: Transform
       cropContentTransform: Transform
       isResting: boolean
+      isHidden: boolean
     }>
   >
 }

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

@@ -382,6 +382,16 @@ function LightboxImage({
     const dismissTranslateY =
       isActive && openProgress.value === 1 ? dismissSwipeTranslateY.value : 0
 
+    if (openProgress.value === 0 && isFlyingAway.value) {
+      return {
+        isHidden: true,
+        isResting: false,
+        scaleAndMoveTransform: [],
+        cropFrameTransform: [],
+        cropContentTransform: [],
+      }
+    }
+
     if (isActive && thumbRect && imageAspect && openProgress.value < 1) {
       return interpolateTransform(
         openProgress.value,
@@ -391,6 +401,7 @@ function LightboxImage({
       )
     }
     return {
+      isHidden: false,
       isResting: dismissTranslateY === 0,
       scaleAndMoveTransform: [{translateY: dismissTranslateY}],
       cropFrameTransform: [],
@@ -628,6 +639,7 @@ function interpolateTransform(
   cropFrameTransform: Transform
   cropContentTransform: Transform
   isResting: boolean
+  isHidden: boolean
 } {
   'worklet'
   const thumbAspect = thumbnailDims.width / thumbnailDims.height
@@ -678,6 +690,7 @@ function interpolateTransform(
     [croppedFinalHeight / finalHeight, 1],
   )
   return {
+    isHidden: false,
     isResting: progress === 1,
     scaleAndMoveTransform: [{translateX}, {translateY}, {scale}],
     cropFrameTransform: [{scaleX: cropScaleX}, {scaleY: cropScaleY}],