🐛Fix: modal -> navigate, fade 딜레이

Author: shlee9999

src/modals/ModalContainer/index.tsx

@@ -44,29 +44,39 @@ const ModalAnimation = ({
   children: React.ReactNode
   animationType?: AnimationType
   index: number
-}) => (
-  <motion.div
-    variants={animationVariants[animationType || 'fade']}
-    initial='initial'
-    animate='animate'
-    exit='exit'
-    transition={{
-      type: 'tween',
-      duration: 0.3,
-      delay: index * 0.1, // 각 모달에 약간의 지연 추가
-    }}
-    style={{
-      zIndex: 1000 + index, // 동적 z-index
-      position: 'absolute',
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-    }}
-  >
-    {children}
-  </motion.div>
-)
+}) => {
+  const transitionConfig =
+    animationType === 'fade'
+      ? {
+          type: 'tween',
+          duration: 0.15, // Shorter duration for fade animation
+          delay: index * 0.05, // Adjusted delay for fade animation
+        }
+      : {
+          type: 'tween',
+          duration: 0.3,
+          delay: index * 0.1,
+        }
+  return (
+    <motion.div
+      variants={animationVariants[animationType || 'fade']}
+      initial='initial'
+      animate='animate'
+      exit='exit'
+      transition={transitionConfig}
+      style={{
+        zIndex: 1000 + index, // 동적 z-index
+        position: 'absolute',
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+      }}
+    >
+      {children}
+    </motion.div>
+  )
+}
 
 export default function ModalContainer() {
   const { modalList, popModal } = useModalStore()

src/pages/RegisterPage/Register/index.tsx

@@ -13,7 +13,7 @@ import { validateOwnerProfile } from '~utils/validateOwnerProfile'
 import RegisterDogPage from '~pages/RegisterPage/Dog'
 import Toast from '~components/Toast'
 import { useToastStore } from '~stores/toastStore'
-import { useSearchParams } from 'react-router-dom'
+import { useNavigate, useSearchParams } from 'react-router-dom'
 import { createRegister } from '~apis/register/createRegister'
 import { FamilyRole } from '~types/common'
 import { useEffect } from 'react'
@@ -27,7 +27,7 @@ export default function Register() {
   const [searchParams] = useSearchParams()
   const email = searchParams.get('email') || ''
   const provider = searchParams.get('provider') || ''
-
+  const navigate = useNavigate()
   const handleNextClick = async () => {
     const alertMessage = validateOwnerProfile(ownerProfile)
     if (alertMessage) {
@@ -55,7 +55,7 @@ export default function Register() {
       if (response.code === 201) {
         //? 채팅 구현을 위해 임의로 추가한 부분입니다.
         setOwnerProfile({ memberId: response.data.memberId })
-        pushModal(<RegisterDogPage />)
+        navigate('/register/dog')
       }
     } catch (error) {
       showToast(error instanceof Error ? error.message : '회원가입에 실패했습니다')