From 0f67be362751f4f65bfca473691c27acb816e05c Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Fri, 15 Mar 2024 14:21:15 +0000
Subject: animate transitions on web only

---
 src/screens/Login/ScreenTransition.tsx     | 10 ++++++++++
 src/screens/Login/ScreenTransition.web.tsx |  1 +
 src/screens/Login/index.tsx                |  9 ++-------
 3 files changed, 13 insertions(+), 7 deletions(-)
 create mode 100644 src/screens/Login/ScreenTransition.tsx
 create mode 100644 src/screens/Login/ScreenTransition.web.tsx

(limited to 'src')

diff --git a/src/screens/Login/ScreenTransition.tsx b/src/screens/Login/ScreenTransition.tsx
new file mode 100644
index 000000000..ab0a22367
--- /dev/null
+++ b/src/screens/Login/ScreenTransition.tsx
@@ -0,0 +1,10 @@
+import React from 'react'
+import Animated, {FadeInRight, FadeOutLeft} from 'react-native-reanimated'
+
+export function ScreenTransition({children}: {children: React.ReactNode}) {
+  return (
+    <Animated.View entering={FadeInRight} exiting={FadeOutLeft}>
+      {children}
+    </Animated.View>
+  )
+}
diff --git a/src/screens/Login/ScreenTransition.web.tsx b/src/screens/Login/ScreenTransition.web.tsx
new file mode 100644
index 000000000..4583720aa
--- /dev/null
+++ b/src/screens/Login/ScreenTransition.web.tsx
@@ -0,0 +1 @@
+export {Fragment as ScreenTransition} from 'react'
diff --git a/src/screens/Login/index.tsx b/src/screens/Login/index.tsx
index 10edb3eb6..da392569a 100644
--- a/src/screens/Login/index.tsx
+++ b/src/screens/Login/index.tsx
@@ -2,7 +2,6 @@ import React from 'react'
 import {KeyboardAvoidingView} from 'react-native'
 import {useAnalytics} from '#/lib/analytics/analytics'
 import {useLingui} from '@lingui/react'
-import Animated, {FadeInRight, FadeOutLeft} from 'react-native-reanimated'
 
 import {LoggedOutLayout} from '#/view/com/util/layouts/LoggedOutLayout'
 import {SessionAccount, useSession} from '#/state/session'
@@ -17,6 +16,7 @@ import {ForgotPasswordForm} from '#/screens/Login/ForgotPasswordForm'
 import {SetNewPasswordForm} from '#/screens/Login/SetNewPasswordForm'
 import {PasswordUpdatedForm} from '#/screens/Login/PasswordUpdatedForm'
 import {LoginForm} from '#/screens/Login/LoginForm'
+import {ScreenTransition} from './ScreenTransition'
 
 enum Forms {
   Login,
@@ -161,12 +161,7 @@ export const Login = ({onPressBack}: {onPressBack: () => void}) => {
   return (
     <KeyboardAvoidingView testID="signIn" behavior="padding" style={a.flex_1}>
       <LoggedOutLayout leadin="" title={title} description={description}>
-        <Animated.View
-          entering={FadeInRight}
-          exiting={FadeOutLeft}
-          key={currentForm}>
-          {content}
-        </Animated.View>
+        <ScreenTransition key={currentForm}>{content}</ScreenTransition>
       </LoggedOutLayout>
     </KeyboardAvoidingView>
   )
-- 
cgit 1.4.1