fix: carousel 하단 버튼 초기 렌더링 시 보이도록 상태 관리 수정

Author: Turtle-Hwan

dist/index.js

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "name": "LinKU",
   "description": "건국대학교 학생들을 위한 건국대, 건대 교내외 페이지 모음 링쿠, LinKU",
-  "version": "1.1.36",
+  "version": "1.1.37",
   "action": {
     "default_popup": "index.html"
   },

dist/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "name": "LinKU",
   "description": "건국대학교 학생들을 위한 건국대, 건대 교내외 페이지 모음 링쿠, LinKU",
-  "version": "1.1.36",
+  "version": "1.1.37",
   "action": {
     "default_popup": "index.html"
   },

public/manifest.json

@@ -7,15 +7,18 @@ import { IMAGE_URL } from "@/constants/URL";
 
 const ImageCarousel = () => {
   const [imageList, setImageList] = useState<BannerItemType[]>([]);
+  const [emblaRef, emblaApi] = useEmblaCarousel({ loop: true }, [Autoplay()]);
+  const [selectedIndex, setSelectedIndex] = useState(0);
+  const [scrollSnaps, setScrollSnaps] = useState<number[]>([]);
+
   useEffect(() => {
     getBannersAPI().then((data) => {
       setImageList(data.banners);
+      if (emblaApi) {
+        setScrollSnaps(emblaApi.scrollSnapList());
+      }
     });
-  }, []);
-
-  const [emblaRef, emblaApi] = useEmblaCarousel({ loop: true }, [Autoplay()]);
-  const [selectedIndex, setSelectedIndex] = useState(0);
-  const [scrollSnaps, setScrollSnaps] = useState<number[]>([]);
+  }, [emblaApi]);
 
   const scrollPrev = useCallback(
     () => emblaApi && emblaApi.scrollPrev(),
@@ -43,7 +46,7 @@ const ImageCarousel = () => {
     return () => {
       emblaApi.off("select", onSelect);
     };
-  }, [emblaApi, onSelect, imageList]);
+  }, [emblaApi, onSelect]);
 
   return (
     <div className="embla relative h-[86px]">