fix: design QA fixes omnibus (#11016)

* decreased corner radius of modal

* increased line height of disclaimer text

* made forgot password return to email step

* memoized the recaptcha component definition

* simple is best

* redeclare recaptcha component when welcome step is active

* undid line height change (pending another solution)

src/app/Components/Recaptcha/Recaptcha.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@artsy/palette-mobile"
 import { RecaptchaWebView } from "app/Components/Recaptcha/RecaptchaWebView"
-import { useState } from "react"
+import { useCallback, useState } from "react"
 
 type State = "idle" | "error" | undefined
 type UseRecaptchaProps = { source: string; action: string }
@@ -18,11 +18,21 @@ export const useRecaptcha = ({ source, action }: UseRecaptchaProps) => {
     setState("error")
   }
 
-  const RecaptchaComponent = () => (
-    <Box height={0}>
-      <RecaptchaWebView action={action} onToken={handleOnToken} onError={handleOnError} />
-    </Box>
-  )
+  interface RecaptchaComponentProps {
+    active?: boolean
+  }
+
+  const RecaptchaComponent: React.FC<RecaptchaComponentProps> = useCallback(({ active }) => {
+    if (!active) {
+      return null
+    }
+
+    return (
+      <Box height={0}>
+        <RecaptchaWebView action={action} onToken={handleOnToken} onError={handleOnError} />
+      </Box>
+    )
+  }, [])
 
   return { Recaptcha: RecaptchaComponent, token, state }
 }

src/app/Scenes/Onboarding/Auth2/components/AuthModal.tsx

@@ -68,7 +68,7 @@ export const AuthModal: React.FC = ({ children }) => {
         style={{
           width: "100%",
           backgroundColor: color("white100"),
-          borderRadius: space(2),
+          borderRadius: space(1),
           overflow: "hidden",
           position: "relative",
         }}

src/app/Scenes/Onboarding/Auth2/scenes/ForgotPasswordStep.tsx

@@ -69,6 +69,11 @@ const ForgotPasswordStepForm: React.FC = () => {
     resetForm({ values: { email: screen.params?.email ?? "" } })
   }
 
+  const handleReturnToLoginPress = () => {
+    navigation.navigate({ name: "LoginWelcomeStep" })
+    resetForm({ values: { email: screen.params?.email ?? "" } })
+  }
+
   const requestedPasswordReset = screen.params?.requestedPasswordReset
 
   useInputAutofocus({
@@ -83,7 +88,6 @@ const ForgotPasswordStepForm: React.FC = () => {
   return (
     <Flex padding={2}>
       <BackButton onPress={handleBackButtonPress} />
-
       <Spacer y={1} />
 
       <Flex flex={1} justifyContent="flex-start">
@@ -144,7 +148,7 @@ const ForgotPasswordStepForm: React.FC = () => {
 
           <Button
             variant="fillDark"
-            onPress={handleBackButtonPress}
+            onPress={handleReturnToLoginPress}
             block
             haptic="impactMedium"
             testID="returnToLoginButton"

src/app/Scenes/Onboarding/Auth2/scenes/LoginWelcomeStep.tsx

@@ -29,6 +29,9 @@ interface LoginEmailFormValues {
 }
 
 export const LoginWelcomeStep: React.FC = () => {
+  const currentScreen = AuthContext.useStoreState((state) => state.currentScreen)
+  const isCurrentScreen = currentScreen?.name === "LoginWelcomeStep"
+
   const navigation = useAuthNavigation()
 
   const { Recaptcha, token } = useRecaptcha({
@@ -38,7 +41,7 @@ export const LoginWelcomeStep: React.FC = () => {
 
   return (
     <>
-      <Recaptcha />
+      <Recaptcha active={isCurrentScreen} />
 
       <Formik<LoginEmailFormValues>
         initialValues={{ email: "" }}
@@ -185,6 +188,7 @@ const LoginWelcomeStepForm: React.FC = () => {
           >
             Privacy Policy
           </LinkText>
+          .
         </Text>
       </MotiView>
     </Flex>