diff --git a/features/home/actions/Hero/addHeroBannerMediaToSaved.ts b/features/home/actions/Hero/addHeroBannerMediaToSaved.ts
new file mode 100644
index 0000000..8a1c3a1
--- /dev/null
+++ b/features/home/actions/Hero/addHeroBannerMediaToSaved.ts
@@ -0,0 +1,18 @@
+"use server";
+
+import { backendFetch } from "@/shared/helpers/backendFetch";
+
+export const addHeroBannerMediaToSaved = async (mediaId: string) => {
+  try {
+    return await backendFetch("collections/sys", {
+      method: "POST",
+      body: JSON.stringify({
+        name: "Saved",
+        itemId: mediaId,
+      }),
+    });
+  } catch (error) {
+    console.error("Error adding media to saved list:", error);
+    return { success: false, message: "Failed to add media to saved list." };
+  }
+};
diff --git a/features/home/sections/Hero/components/AddToList.tsx b/features/home/sections/Hero/components/AddToList.tsx
index 2ae4380..c9606ec 100644
--- a/features/home/sections/Hero/components/AddToList.tsx
+++ b/features/home/sections/Hero/components/AddToList.tsx
@@ -1,3 +1,5 @@
+"use client";
+import { addHeroBannerMediaToSaved } from "@/features/home/actions/Hero/addHeroBannerMediaToSaved";
 import { useAuth } from "@/shared/contexts/AuthContext";
 import { Button } from "@/shared/libs/shadcn/ui/button";
 import { Icon } from "@iconify/react";
@@ -5,10 +7,16 @@ import { Icon } from "@iconify/react";
 const AddToList = ({ mediaId }: { mediaId: string }) => {
   const { session } = useAuth();
 
+  const handleAddToList = async () => {
+    const result = await addHeroBannerMediaToSaved(mediaId);
+    console.log("Hasil dari fungsi server:", result);
+  };
+
   return (
     <div>
       {session?.user && (
         <Button
+          onClick={handleAddToList}
           variant="secondary"
           className="h-full flex gap-1 px-4 rounded-xl border border-neutral-400/10 bg-neutral-950/20 hover:bg-neutral-950/40 backdrop-blur-lg text-neutral-200"
         >
diff --git a/features/home/sections/Hero/components/Swiper.tsx b/features/home/sections/Hero/components/Swiper.tsx
index 0fddea5..5b9ddfc 100644
--- a/features/home/sections/Hero/components/Swiper.tsx
+++ b/features/home/sections/Hero/components/Swiper.tsx
@@ -28,8 +28,6 @@ const HeroSwiper = (props: HeroSwiperProps) => {
       <Swiper
         spaceBetween={0}
         slidesPerView={1}
-        onSlideChange={() => console.log("slide change")}
-        onSwiper={(swiper) => console.log(swiper)}
         className="h-full"
         autoplay={{ delay: 5000, disableOnInteraction: false }}
         modules={[Autoplay, Pagination, Navigation]}