코드정리

com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx

@@ -24,7 +24,6 @@ const ContainerBasic = SpotlightContainerDecorator(
 );
 
 export default function HomeBanner({
-  scrollTopBody,
   selectTemplate,
   order,
   firstSpot,
@@ -33,8 +32,6 @@ export default function HomeBanner({
 }) {
   const dispatch = useDispatch();
 
-  const { handleScrollReset, handleStopScrolling } =
-    useScrollReset(scrollTopBody);
   const timerRef = useRef();
 
   const homeMainContentsBannerInfos = useSelector(
@@ -207,7 +204,6 @@ export default function HomeBanner({
   useEffect(() => {
     if (!homeMainContentsBannerInfos) {
       dispatch(getHomeMainContents());
-      scrollTopBody({ animate: false });
     }
 
     if (
@@ -223,7 +219,6 @@ export default function HomeBanner({
     return () => clearTimeout(timerRef.current);
   }, [
     dispatch,
-    scrollTopBody,
     homeMainContentsBannerInfos,
     selectTemplate,
     activePopup,
@@ -289,7 +284,6 @@ export default function HomeBanner({
                 bannerData={firstBanner}
                 isHorizontal={true}
                 spotlightId={"banner01"}
-                scrollTopBody={scrollTopBody}
                 handleItemFocus={_handleItemFocus}
               />
             ) : firstBanner && firstBanner.shptmDspyTpNm === "Random" ? (
@@ -297,15 +291,12 @@ export default function HomeBanner({
                 bannerData={firstBanner}
                 isHorizontal={true}
                 spotlightId={"banner01"}
-                scrollTopBody={scrollTopBody}
                 handleItemFocus={_handleItemFocus}
                 randomNumber={randomNumber}
               />
             ) : (
               <SpottableComponent
                 spotlightId={"banner01"}
-                onFocus={handleScrollReset}
-                onBlur={handleStopScrolling}
               >
                 <CustomImage
                   delay={0}
@@ -323,7 +314,6 @@ export default function HomeBanner({
                 bannerData={secondBanner}
                 isHorizontal={true}
                 spotlightId={"banner02"}
-                scrollTopBody={scrollTopBody}
                 handleItemFocus={_handleItemFocus}
               />
             ) : secondBanner && secondBanner.shptmDspyTpNm === "Random" ? (
@@ -331,15 +321,12 @@ export default function HomeBanner({
                 bannerData={secondBanner}
                 isHorizontal={true}
                 spotlightId={"banner02"}
-                scrollTopBody={scrollTopBody}
                 handleItemFocus={_handleItemFocus}
                 randomNumber={randomNumber}
               />
             ) : (
               <SpottableComponent
                 spotlightId={"banner02"}
-                onFocus={handleScrollReset}
-                onBlur={handleStopScrolling}
               >
                 <CustomImage
                   delay={0}
@@ -367,7 +354,6 @@ export default function HomeBanner({
               bannerData={thirdBanner}
               isHorizontal={false}
               spotlightId={"banner03"}
-              scrollTopBody={scrollTopBody}
               handleItemFocus={_handleItemFocus}
             />
           ) : thirdBanner && thirdBanner.shptmDspyTpNm === "Random" ? (
@@ -375,15 +361,12 @@ export default function HomeBanner({
               bannerData={thirdBanner}
               isHorizontal={false}
               spotlightId={"banner03"}
-              scrollTopBody={scrollTopBody}
               handleItemFocus={_handleItemFocus}
               randomNumber={randomNumber}
             />
           ) : (
             <SpottableComponent
               spotlightId={"banner03"}
-              onFocus={handleScrollReset}
-              onBlur={handleStopScrolling}
             >
               <CustomImage
                 delay={0}
@@ -410,7 +393,6 @@ export default function HomeBanner({
               bannerData={forthBanner}
               isHorizontal={false}
               spotlightId={"banner04"}
-              scrollTopBody={scrollTopBody}
               handleItemFocus={_handleItemFocus}
             />
           ) : forthBanner && forthBanner.shptmDspyTpNm === "Random" ? (
@@ -418,15 +400,12 @@ export default function HomeBanner({
               bannerData={forthBanner}
               isHorizontal={false}
               spotlightId={"banner04"}
-              scrollTopBody={scrollTopBody}
               handleItemFocus={_handleItemFocus}
               randomNumber={randomNumber}
             />
           ) : (
             <SpottableComponent
               spotlightId={"banner04"}
-              onFocus={handleScrollReset}
-              onBlur={handleStopScrolling}
             >
               <CustomImage delay={0} src={replaceImage?.vtctpImgPath2} />
             </SpottableComponent>

com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx

@@ -33,7 +33,6 @@ const Container = SpotlightContainerDecorator(
 export default function RandomUnit({
   bannerData,
   spotlightId,
-  scrollTopBody,
   isHorizontal,
   handleItemFocus,
   randomNumber,
@@ -44,8 +43,6 @@ export default function RandomUnit({
   const [priceInfos, setpriceInfos] = useState("");
   const [isFocused, setIsFocused] = useState(false);
   const timerRef = useRef();
-  const { handleScrollReset, handleStopScrolling } =
-    useScrollReset(scrollTopBody);
 
   const dispatch = useDispatch();
 
@@ -55,13 +52,11 @@ export default function RandomUnit({
       handleItemFocus();
     }
     setIsFocused(true);
-    handleScrollReset();
+  }, [handleItemFocus]);
-  }, [handleItemFocus, handleScrollReset]);
 
   // 포커스 아웃
   const onBlur = () => {
     setIsFocused(false);
-    handleStopScrolling();
     clearTimeout(timerRef.current);
   };
 

com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RollingUnit.jsx

@@ -30,7 +30,6 @@ const Container = SpotlightContainerDecorator(
 export default function RollingUnit({
   bannerData,
   spotlightId,
-  scrollTopBody,
   isHorizontal,
   handleItemFocus,
 }) {
@@ -46,9 +45,6 @@ export default function RollingUnit({
 
   const dispatch = useDispatch();
 
-  const { handleScrollReset, handleStopScrolling } =
-    useScrollReset(scrollTopBody);
-
   // 비디오 에러일시, 클릭 이동
   const videoErrorClick = () => {
     dispatch(
@@ -90,14 +86,12 @@ export default function RollingUnit({
 
     rollingStart(true);
     setRollingFocus(true);
-    handleScrollReset();
+  }, [handleItemFocus, rollingStart]);
-  }, [handleItemFocus, handleScrollReset, rollingStart]);
 
   // 배너 포커스 아웃
   const onBlur = () => {
     rollingStart(false);
     setRollingFocus(false);
-    handleStopScrolling();
   };
 
   // 인디케이터 아래키 누를시 [<]
@@ -126,13 +120,11 @@ export default function RollingUnit({
     setContentsFocus(false);
     setPrevFocus(false);
     rollingStart(true);
-    handleScrollReset();
+  }, [handleItemFocus, rollingStart]);
-  }, [handleItemFocus, handleScrollReset, rollingStart]);
 
   // 인디케이터 포커스 아웃
   const indicatorBlur = () => {
     rollingStart(false);
-    handleStopScrolling();
     setTimeout(() => {
       setNextFocus(false);
       setContentsFocus(false);