[DetailPanel] loading 처리

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

@@ -10,7 +10,11 @@ import { useDispatch, useSelector } from "react-redux";
 
 import Spotlight from "@enact/spotlight";
 
-import { changeLocalSettings, setHidePopup } from "../../actions/commonActions";
+import {
+  changeAppStatus,
+  changeLocalSettings,
+  setHidePopup,
+} from "../../actions/commonActions";
 import { clearCouponInfo } from "../../actions/couponActions";
 import { getDeviceAdditionInfo } from "../../actions/deviceActions";
 import {
@@ -42,6 +46,7 @@ import YouMayLike from "./YouMayLike/YouMayLike";
 
 export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
   const [lgCatCd, setLgCatCd] = useState("");
+  const [loading, setLoading] = useState(true);
   const [selectedIndex, setSelectedIndex] = useState(0);
   const productData = useSelector((state) => state.main.productData);
   const themeData = useSelector((state) => state.home.productData);
@@ -254,6 +259,16 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
     }
   }, [dispatch, themeProductInfos, selectedIndex, hotelInfos]);
 
+  useEffect(() => {
+    dispatch(
+      changeAppStatus({ showLoadingPanel: { show: true, type: "wait" } })
+    );
+    if (productData || hotelData || themeData) {
+      setLoading(false);
+      dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
+    }
+  }, [dispatch, productData, hotelData, themeData]);
+
   useEffect(() => {
     return () => {
       dispatch(clearProductDetail());