about summary refs log tree commit diff
path: root/src/view/com/composer/Composer.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/composer/Composer.tsx')
-rw-r--r--src/view/com/composer/Composer.tsx58
1 files changed, 34 insertions, 24 deletions
diff --git a/src/view/com/composer/Composer.tsx b/src/view/com/composer/Composer.tsx
index 6a6ac7267..3ca709a1e 100644
--- a/src/view/com/composer/Composer.tsx
+++ b/src/view/com/composer/Composer.tsx
@@ -24,11 +24,14 @@ import Animated, {
   FadeIn,
   FadeOut,
   interpolateColor,
+  LayoutAnimationConfig,
   useAnimatedStyle,
   useDerivedValue,
   useSharedValue,
   withRepeat,
   withTiming,
+  ZoomIn,
+  ZoomOut,
 } from 'react-native-reanimated'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 import {
@@ -84,7 +87,7 @@ import {GalleryModel} from 'state/models/media/gallery'
 import {State as VideoUploadState} from 'state/queries/video/video'
 import {ComposerOpts} from 'state/shell/composer'
 import {ComposerReplyTo} from 'view/com/composer/ComposerReplyTo'
-import {atoms as a, useTheme} from '#/alf'
+import {atoms as a, native, useTheme} from '#/alf'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
 import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
 import {EmojiArc_Stroke2_Corner0_Rounded as EmojiSmile} from '#/components/icons/Emoji'
@@ -766,29 +769,36 @@ export const ComposePost = observer(function ComposePost({
                 )}
               </View>
             ) : null}
-            {videoUploadState.asset &&
-              (videoUploadState.status === 'compressing' ? (
-                <VideoTranscodeProgress
-                  asset={videoUploadState.asset}
-                  progress={videoUploadState.progress}
-                  clear={clearVideo}
-                />
-              ) : videoUploadState.video ? (
-                <VideoPreview
-                  asset={videoUploadState.asset}
-                  video={videoUploadState.video}
-                  setDimensions={updateVideoDimensions}
-                  clear={clearVideo}
-                />
-              ) : null)}
-            {(videoUploadState.asset || videoUploadState.video) && (
-              <SubtitleDialogBtn
-                altText={videoAltText}
-                setAltText={setVideoAltText}
-                captions={captions}
-                setCaptions={setCaptions}
-              />
-            )}
+            <LayoutAnimationConfig skipExiting>
+              {(videoUploadState.asset || videoUploadState.video) && (
+                <Animated.View
+                  style={[a.w_full, a.mt_xs]}
+                  entering={native(ZoomIn)}
+                  exiting={native(ZoomOut)}>
+                  {videoUploadState.asset &&
+                    (videoUploadState.status === 'compressing' ? (
+                      <VideoTranscodeProgress
+                        asset={videoUploadState.asset}
+                        progress={videoUploadState.progress}
+                        clear={clearVideo}
+                      />
+                    ) : videoUploadState.video ? (
+                      <VideoPreview
+                        asset={videoUploadState.asset}
+                        video={videoUploadState.video}
+                        setDimensions={updateVideoDimensions}
+                        clear={clearVideo}
+                      />
+                    ) : null)}
+                  <SubtitleDialogBtn
+                    altText={videoAltText}
+                    setAltText={setVideoAltText}
+                    captions={captions}
+                    setCaptions={setCaptions}
+                  />
+                </Animated.View>
+              )}
+            </LayoutAnimationConfig>
           </View>
         </Animated.ScrollView>
         <SuggestedLanguage text={richtext.text} />