[HomePanel] 더보기 버튼 관련 처리

- 더보기 아이콘 추가.
 - 섹션타이틀 css 변경

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

@@ -11,6 +11,7 @@ import VirtualGridList from '@enact/sandstone/VirtualList';
 import {
   SpotlightContainerDecorator,
 } from '@enact/spotlight/SpotlightContainerDecorator';
+import Spottable from '@enact/spotlight/Spottable';
 
 import SectionTitle from '../../../components/SectionTitle/SectionTitle';
 import TGrid from '../../../components/TGrid/TGrid';
@@ -22,6 +23,7 @@ import {
 import css from './BestSeller.module.less';
 import BestSellerItem from './BestSellerItem/BestSellerItem';
 
+const SpottableComponent = Spottable("div");
 const Container = SpotlightContainerDecorator(
   { enterTo: "last-focused", leaveFor: { left: "", right: "" } },
   "div"
@@ -34,14 +36,23 @@ const BestSeller = () => {
   const renderItem = useCallback(
     ({ index, ...rest }) => {
       const itemData = bestSellerDatas[index];
-      return (
-        <BestSellerItem
-          bestSellerData={bestSellerDatas}
-          itemData={itemData}
-          isBestSeller
-          {...rest}
-        />
-      );
+      if (index !== bestSellerDatas.length) {
+        return (
+          <BestSellerItem
+            bestSellerData={bestSellerDatas}
+            itemData={itemData}
+            isBestSeller
+            {...rest}
+          />
+        );
+      } else {
+        return (
+          <SpottableComponent
+            className={css.addItem}
+            {...rest}
+          ></SpottableComponent>
+        );
+      }
     },
     [bestSellerDatas]
   );
@@ -53,7 +64,7 @@ const BestSeller = () => {
       <TGrid type="homeBestSeller">
         {bestSellerDatas && bestSellerDatas.length > 0 && (
           <VirtualGridList
-            dataSize={bestSellerDatas.length}
+            dataSize={bestSellerDatas.length + 1}
             direction="horizontal"
             horizontalScrollbar="hidden"
             itemRenderer={renderItem}