[OnSalePanel] fixed issue, SHOPTIME-1972

Detail Notes :

1. GNB가 열려있는 상태에서 다시 OnSalePanel로 action을 취할 경우 focse가 사라지는 문제 수정
2. 불필요 state, useEffect 정리

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

@@ -20,48 +20,50 @@ export default function OnSalePanel() {
   const dispatch = useDispatch();
 
   const panelInfo = useSelector((state) => state.panels.panels[0]?.panelInfo);
+
   const categoryInfos = useSelector(
     (state) => state.onSale.onSaleData.categoryInfos
   );
+  const firstLgCatCd = useSelector(
+    (state) => state.onSale.onSaleData.categoryInfos[0].lgCatCd
+  );
   const saleInfos = useSelector((state) => state.onSale.onSaleData.saleInfos);
 
   const [selectedLgCatCd, setSelectedLgCatCd] = useState();
-  const [isInitialLoad, setIsInitialLoad] = useState(true);
   const [isTopButtonClicked, setIsTopButtonClicked] = useState(false);
   const [targetId, setTargetId] = useState();
 
   const timerRef = useRef();
 
+  // set selectedLgCatCd upon initial render
   useEffect(() => {
     if (categoryInfos && !selectedLgCatCd) {
       panelInfo?.lgCatCd
         ? setSelectedLgCatCd(panelInfo.lgCatCd)
-        : setSelectedLgCatCd(categoryInfos[0].lgCatCd);
+        : setSelectedLgCatCd(firstLgCatCd);
     }
-  }, []);
+  }, [categoryInfos, selectedLgCatCd]);
 
+  // API request and add focusing through selectedLgCatCd settings
   useEffect(() => {
     if (selectedLgCatCd) {
       dispatch(
         getOnSaleInfo({ categoryIncFlag: "Y", lgCatCd: selectedLgCatCd })
       );
+
+      Spotlight.focus("spotlightId-" + selectedLgCatCd);
     }
   }, [selectedLgCatCd, dispatch]);
 
+  // set targetId
   useEffect(() => {
     if (saleInfos) {
       const prdtId = saleInfos[0].saleProductInfos[0].prdtId;
       setTargetId("spotlightId-" + removeDotAndColon(prdtId));
     }
-  }, [dispatch, saleInfos]);
-
-  useEffect(() => {
-    if (selectedLgCatCd && isInitialLoad) {
-      Spotlight.focus("spotlightId-" + selectedLgCatCd);
-      setIsInitialLoad(false);
-    }
-  }, [selectedLgCatCd, isInitialLoad]);
+  }, [saleInfos]);
 
+  // unmounted
   useEffect(() => {
     return () => clearTimeout(timerRef.current);
   }, []);
@@ -88,7 +90,7 @@ export default function OnSalePanel() {
         selectedLgCatCd={selectedLgCatCd}
         setSelectedLgCatCd={setSelectedLgCatCd}
       />
-      <TBody className={css.tBody} cbScrollTo={getScrollTo}>
+      <TBody className={css.tBody} cbScrollTo={getScrollTo} spotlightId={null}>
         {saleInfos &&
           saleInfos.map(({ saleNm, saleProductInfos, expsOrd }, index) => (
             <OnSaleContents