[cm] fix: hydration 에러

apps/cm/src/pages/dashboard/ui/banner-list.tsx

@@ -1,9 +1,13 @@
 "use client";
 
-import { useRef } from "react";
+import { useRef, useState, useEffect } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { ENDPOINT } from "@/shared/config";
-import { getImageUrlByAtflCd, getBannerList, type Banner } from "../api/banner-service";
+import {
+  getImageUrlByAtflCd,
+  getBannerList,
+  type Banner,
+} from "../api/banner-service";
 import { getCookie } from "@/shared/lib";
 
 import {
@@ -21,7 +25,12 @@ type BannerImageProps = {
 };
 
 const BannerList: React.FC = () => {
-  const siteId = getCookie("site-id-key") ?? "";
+  const [siteId, setSiteId] = useState<string>("");
+
+  useEffect(() => {
+    const id = getCookie("site-id-key") ?? "";
+    setSiteId(id);
+  }, []);
 
   const BannerImage = ({ atflCd, lnkgUrlAddr }: BannerImageProps) => {
     const { data: imageUrl, isLoading } = useQuery({
@@ -91,6 +100,19 @@ const BannerList: React.FC = () => {
     return maybe.status ?? maybe.response?.status;
   };
 
+  // siteId가 없을 때
+  if (!siteId) {
+    return (
+      <div className="card card-border">
+        <div className="relative flex h-[240px] w-full items-center justify-center bg-accent">
+          <div className="text-sm text-muted-foreground">
+            사이트 ID가 없습니다
+          </div>
+        </div>
+      </div>
+    );
+  }
+
   // 401 에러 처리
   if (bannerError) {
     const is401Error =
@@ -133,21 +155,8 @@ const BannerList: React.FC = () => {
     );
   }
 
-  // siteId가 없을 때
-  if (!siteId) {
-    return (
-      <div className="card card-border">
-        <div className="relative flex h-[240px] w-full items-center justify-center bg-accent">
-          <div className="text-sm text-muted-foreground">
-            사이트 ID가 없습니다
-          </div>
-        </div>
-      </div>
-    );
-  }
-
   return (
-    <div className="card card-border"  style={{ height: "230px" }}>
+    <div className="card card-border" style={{ height: "230px" }}>
       <Carousel
         plugins={[plugin.current]}
         opts={{ loop: true }}