refactor: 불필요한 부분 제거

depromeet · Oct 7, 2024 · 8c377ee · 8c377ee
1 parent 2c13a7c
commit 8c377ee
Showing 1 changed file with 18 additions and 30 deletions.
diff --git a/features/on-boarding/components/molecules/steps.tsx b/features/on-boarding/components/molecules/steps.tsx
@@ -1,5 +1,4 @@
-import { cloneElement, Fragment, ReactElement } from 'react';
-import { CSSTransition, TransitionGroup } from 'react-transition-group';
+import { Fragment } from 'react';
 
 import { Image } from '@/components/atoms';
 import { OnBoardingImages } from '@/public/images/on-boarding';
@@ -29,34 +28,23 @@ export function Steps({ current }: StepsProps) {
   };
 
   return (
-    <TransitionGroup
-      component={null}
-      childFactory={(child: ReactElement) => {
-        return cloneElement(child, {
-          classNames: 'fade',
-        });
-      }}
-    >
-      <CSSTransition key={current} timeout={200}>
-        <div className={layout.total}>
-          <p className={textStyles.total}>
-            {highlightText(
-              stepsIntroduce[current].total,
-              stepsIntroduce[current].highlight,
-            )}
-          </p>
-          <div className={layout.image}>
-            <Image
-              key={current}
-              src={OnBoardingImages[current]}
-              alt="온보딩 이미지"
-              fill
-              style={{ objectFit: 'contain' }}
-            />
-          </div>
-        </div>
-      </CSSTransition>
-    </TransitionGroup>
+    <div className={layout.total}>
+      <p className={textStyles.total}>
+        {highlightText(
+          stepsIntroduce[current].total,
+          stepsIntroduce[current].highlight,
+        )}
+      </p>
+      <div className={layout.image}>
+        <Image
+          key={current}
+          src={OnBoardingImages[current]}
+          alt="온보딩 이미지"
+          fill
+          style={{ objectFit: 'contain' }}
+        />
+      </div>
+    </div>
   );
 }