[TScroller, CategoryPanel, TButton]

- TScroller noScrollByWheel props 추가
- CategpryPanel TopButton -> TButton 교체
- TButton TopButton시 css 추가

com.twin.app.shoptime/src/components/TButton/TButton.module.less

@@ -214,6 +214,8 @@
     background-image: url("../../../assets/images/btn/btn-top-nor@3x.png");
     background-position: center;
     background-size: contain;
+    display: block;
+    margin: 0 auto;
 
     &:focus {
       background-image: url("../../../assets/images/btn/btn-top-foc@3x.png");

com.twin.app.shoptime/src/components/TScroller/TScroller.jsx

@@ -18,6 +18,7 @@ export default function TScroller({
   scrollMode,
   onScrollStart,
   onScrollStop,
+  noScrollByWheel = false,
   ...rest
 }) {
   const isScrolling = useRef(false);
@@ -109,6 +110,7 @@ export default function TScroller({
         track: false,
         wheel: false,
       }}
+      noScrollByWheel={noScrollByWheel}
     >
       {children}
     </Scroller>

com.twin.app.shoptime/src/components/TVirtualGridList/TVirtualGridList.jsx

@@ -37,7 +37,7 @@ export default function TVirtualGridList({
         ? itemPropsTransfomers["TItemCard"](itemData)
         : itemData;
 
-      const onCardClick = () => onClick(itemData);
+      const onCardClick = onCardClick ? () => onClick(itemData) : null;
 
       return (
         <>

com.twin.app.shoptime/src/views/CategoryPanel/CategoryPanel.jsx

@@ -9,6 +9,7 @@ import { setContainerLastFocusedElement } from "@enact/spotlight/src/container";
 import { getSubCategory } from "../../actions/mainActions";
 import SectionTitle from "../../components/SectionTitle/SectionTitle";
 import TBody from "../../components/TBody/TBody";
+import TButton, { TYPES } from "../../components/TButton/TButton";
 import TButtonTab, { LIST_TYPE } from "../../components/TButtonTab/TButtonTab";
 import TDropDown from "../../components/TDropDown/TDropDown";
 import THeader from "../../components/THeader/THeader";
@@ -113,9 +114,10 @@ export default function CategoryPanel() {
   }, [dropDownTab]);
 
   const handleTopButtonClick = useCallback(() => {
+    scrollTop();
     setContainerLastFocusedElement(null, ["categoryContentsBox"]);
     Spotlight.focus(`tab-${tab}`);
-  }, [tab]);
+  }, [scrollTop, tab]);
 
   return (
     <TPanel>
@@ -159,6 +161,11 @@ export default function CategoryPanel() {
           )}
           {tab === 0 && <ShowContents />}
           {tab === 1 && <ItemContents />}
+          <TButton
+            type={TYPES.topButton}
+            size={null}
+            onClick={handleTopButtonClick}
+          />
         </div>
       </TBody>
     </TPanel>

com.twin.app.shoptime/src/views/CategoryPanel/CategoryPanel.module.less

@@ -8,6 +8,7 @@
 
   .paddingContainer {
     padding-left: 60px;
+    padding-bottom: 60px;
 
     .title {
       margin: 38px 0 33px 0;

com.twin.app.shoptime/src/views/OnSalePanel/OnSalePanel.jsx

@@ -93,13 +93,11 @@ export default function OnSalePanel() {
               setIsTopButtonClicked={setIsTopButtonClicked}
             />
           ))}
-        <div className={css.topButtonWrap}>
-          <TButton
-            onClick={handleTopButtonClick}
-            size={null}
-            type={TYPES.topButton}
-          />
-        </div>
+        <TButton
+          onClick={handleTopButtonClick}
+          size={null}
+          type={TYPES.topButton}
+        />
       </TBody>
     </TPanel>
   );

com.twin.app.shoptime/src/views/OnSalePanel/OnSalePanel.module.less

@@ -7,9 +7,4 @@
   .tBody {
     height: calc(1080px - 236px);
   }
-
-  .topButtonWrap {
-    .flex();
-    .size(@w: 100%, @h: 240px);
-  }
 }