diff --git a/app/[locale]/(protected)/admin/media-tracking/component/modal.tsx b/app/[locale]/(protected)/admin/media-tracking/component/modal.tsx
index 8abc28f4..2d41b5f9 100644
--- a/app/[locale]/(protected)/admin/media-tracking/component/modal.tsx
+++ b/app/[locale]/(protected)/admin/media-tracking/component/modal.tsx
@@ -1,371 +1,121 @@
 "use client";
-
-import * as React from "react";
-import {
-  ColumnDef,
-  ColumnFiltersState,
-  PaginationState,
-  SortingState,
-  VisibilityState,
-  flexRender,
-  getCoreRowModel,
-  getFilteredRowModel,
-  getPaginationRowModel,
-  getSortedRowModel,
-  useReactTable,
-} from "@tanstack/react-table";
 import { Button } from "@/components/ui/button";
+import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
+import { toast } from "sonner";
 
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from "@/components/ui/table";
-import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
-import {
-  ChevronDown,
-  ChevronLeft,
-  ChevronRight,
-  Eye,
-  MoreVertical,
-  Search,
-  SquarePen,
-  Trash2,
-  TrendingDown,
-  TrendingUp,
-  UserIcon,
-} from "lucide-react";
-import { cn } from "@/lib/utils";
-import {
-  DropdownMenu,
-  DropdownMenuCheckboxItem,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuRadioGroup,
-  DropdownMenuRadioItem,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import TablePagination from "@/components/table/table-pagination";
-import columns from "./column";
-import { listEnableCategory } from "@/service/content/content";
-import { close, loading } from "@/config/swal";
-import { Label } from "@/components/ui/label";
-import TrackingMediaModal from "./modal";
-import { getMediaTracking } from "@/service/media-tracking/media-tracking";
+import { Input } from "@/components/ui/input";
+import { close, error, loading, successCallback } from "@/config/swal";
+import { getMediaTracking, listDataAllNonPagination, listDataTracking, mediaTrackingSave } from "@/service/media-tracking/media-tracking";
+import { useEffect, useState } from "react";
 
-const NewsTable = () => {
-  const router = useRouter();
-  const asPath = usePathname();
-  const searchParams = useSearchParams();
-  const [showData, setShowData] = React.useState("10");
-  const [categories, setCategories] = React.useState<any>();
-  const [dataTable, setDataTable] = React.useState<any[]>([]);
-  const [sorting, setSorting] = React.useState<SortingState>([]);
-  const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(
-    []
-  );
-  const [showTable, setShowTable] = React.useState(false);
-  const [onSearch, setOnSearch] = React.useState("");
-  const [columnVisibility, setColumnVisibility] =
-    React.useState<VisibilityState>({});
-  const [rowSelection, setRowSelection] = React.useState({});
-  const [pagination, setPagination] = React.useState<PaginationState>({
-    pageIndex: 0,
-    pageSize: Number(showData),
-  });
-  const [categoryFilter, setCategoryFilter] = React.useState<any>([]);
-  const [searchTitle, setSearchTitle] = React.useState<string>("");
-  const [statusFilter, setStatusFilter] = React.useState<number[]>([]);
-  const [page, setPage] = React.useState(1);
-  const [imageData, setImageData] = React.useState<any>();
-  const [totalData, setTotalData] = React.useState<number>(1);
-  const [totalPage, setTotalPage] = React.useState(1);
-  const [contentAll, setContentAll] = React.useState([]);
-  const [formatFilter, setFormatFilter] = React.useState<any>([]);
-  const [totalContent, setTotalContent] = React.useState();
-  const [search, setSearch] = React.useState<string>("");
-  const group = searchParams?.get("group");
-  const title = searchParams?.get("title");
-  const categorie = searchParams?.get("category");
-  const table = useReactTable({
-    data: dataTable,
-    columns,
-    onSortingChange: setSorting,
-    onColumnFiltersChange: setColumnFilters,
-    getCoreRowModel: getCoreRowModel(),
-    getPaginationRowModel: getPaginationRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    getFilteredRowModel: getFilteredRowModel(),
-    onColumnVisibilityChange: setColumnVisibility,
-    onRowSelectionChange: setRowSelection,
-    onPaginationChange: setPagination,
-    state: {
-      sorting,
-      columnFilters,
-      columnVisibility,
-      rowSelection,
-      pagination,
-    },
-  });
+export default function TrackingMediaModal(props: { triggerFetch: () => void }) {
+  const [content, setContent] = useState<any>([]);
+  const [inputValue, setInputValue] = useState("");
+  const [selectedId, setSelectedId] = useState(0);
+  const [search, setSearch] = useState<string>("");
+  const [page, setPage] = useState(1);
+  const [showData, setShowData] = useState("10");
 
-  let typingTimer: any;
-  const doneTypingInterval = 1500;
-
-  // async function doneTyping() {
-  //   fetchData();
-  // }
-
-  React.useEffect(() => {
-    const pageFromUrl = searchParams?.get("page");
-    if (pageFromUrl) {
-      setPage(Number(pageFromUrl));
-    }
-  }, [searchParams]);
-
-  React.useEffect(() => {
-    getCategories();
-  }, []);
-
-  React.useEffect(() => {
-    getDataTable();
+  useEffect(() => {
+    initFecth();
   }, [page, showData, search]);
 
-  const getDataTable = async () => {
-    const res = await getMediaTracking(page - 1, search, showData);
+  const initFecth = async () => {
+    const response = await getMediaTracking(page - 1, search, showData);
+    setContent(response?.data?.data.content);
+  };
 
-    const data = res?.data?.data;
-    const newData = data?.content;
+  const fecthAll = async (search?: string) => {
+    const response = await listDataAllNonPagination(search || inputValue);
+    setContent(response?.data?.data.content);
+  };
 
-    newData.forEach((item: any, index: number) => {
-      item.no = (page - 1) * Number(showData) + index + 1;
+  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const value = e.target.value;
+    const nowLength = value.split(" ").length;
+    const prevLength = inputValue.split(" ").length;
+
+    setInputValue(value);
+
+    if (value === "") {
+      initFecth();
+      setSelectedId(0);
+    }
+
+    if (/\s/.test(value)) {
+      console.log("Terdapat spasi dalam input");
+      fecthAll();
+    }
+
+    if (nowLength !== prevLength) {
+      fecthAll();
+    }
+  };
+
+  const doSave = async () => {
+    loading();
+    const req = {
+      mediaUploadId: selectedId,
+      duration: 24,
+      scrapingPeriod: 3,
+    };
+
+    const res = await mediaTrackingSave(req);
+    if (res?.error) {
+      error(res?.message);
+      return false;
+    }
+    close();
+
+    toast("Berhasil Menambahkan", {
+      description: "",
     });
-
-    setDataTable(newData);
-    setTotalData(data?.totalElements);
-    setTotalPage(data?.totalPages);
-    setTotalContent(data.totalElements);
-  };
-
-  async function getCategories() {
-    const category = await listEnableCategory("");
-    const resCategory = category?.data?.data?.content;
-    setCategories(resCategory);
-  }
-
-  React.useEffect(() => {
-    if (categorie) {
-      setCategoryFilter(
-        categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]
-      );
-      console.log(
-        "Kategori",
-        categorie,
-        categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]
-      );
-    }
-  }, [categorie]);
-
-  const handleCategoryFilter = (e: boolean, id: string) => {
-    let filter = [...categoryFilter];
-
-    if (e) {
-      filter = [...categoryFilter, String(id)];
-    } else {
-      filter.splice(categoryFilter.indexOf(id), 1);
-    }
-    console.log("checkbox filter", filter);
-    setCategoryFilter(filter);
-    router.push(`?category=${filter.join("&")}`);
-  };
-
-  const cleanCheckbox = () => {
-    setCategoryFilter([]);
-    setFormatFilter([]);
-    router.push(`?category=&title=`);
-  };
-
-  // async function getData() {
-  //   if (asPath?.includes("/polda/") == true) {
-  //     if (asPath?.split("/")[2] !== "[polda_name]") {
-  //       const filter =
-  //         categoryFilter?.length > 0
-  //           ? categoryFilter?.sort().join(",")
-  //           : categorie || "";
-
-  //       const name = title == undefined ? "" : title;
-  //       const format = formatFilter == undefined ? "" : formatFilter?.join(",");
-  //       const filterGroup = group == undefined ? asPath.split("/")[2] : group;
-  //       loading();
-  //       const response = await listDataAll("", name, filter, "");
-  //       close();
-  //       // setGetTotalPage(response?.data?.data?.totalPages);
-  //       // setContentImage(response?.data?.data?.content);
-  //       // setTotalContent(response?.data?.data?.totalElements);
-  //       const data = response?.data?.data;
-  //       const contentData = data?.content;
-  //       setImageData(contentData);
-  //       setTotalData(data?.totalElements);
-  //       setContentAll(response?.data?.data?.content);
-  //       setTotalPage(data?.totalPages);
-  //       setTotalContent(response?.data?.data?.totalElements);
-  //     }
-  //   }
-  // }
-
-  const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setSearch(e.target.value);
-    table.getColumn("judul")?.setFilterValue(e.target.value);
-  };
-
-  const handleKeyUp = () => {
-    clearTimeout(typingTimer);
-    typingTimer = setTimeout(doneTyping, doneTypingInterval);
-  };
-
-  async function doneTyping() {
-    if (searchTitle == "" || searchTitle == undefined) {
-      router.push("?title=");
-    } else {
-      router.push(`?title=${searchTitle}`);
-    }
-  }
-
-  const handleKeyDown = () => {
-    clearTimeout(typingTimer);
+    props.triggerFetch();
+    return false;
   };
 
   return (
-    <div className="w-full overflow-x-auto bg-white p-4 rounded-sm space-y-3 border ">
-      <div className="flex justify-between  items-center">
-        <p className="text-xl font-medium text-default-900">
-          Tracking Berita hari ini!
-        </p>
-      </div>
-
-      <div className="flex flex-col sm:flex-row lg:flex-row justify-between sm:items-center md:items-center lg:items-center px-1">
-        {/* <TrackingMediaModal triggerFetch={() => getDataTable()} /> */}
-        <div className=" flex flex-row items-center gap-3">
-          <div className="flex items-center py-2">
-            <div className="mx-3">
-              <DropdownMenu>
-                <DropdownMenuTrigger asChild>
-                  <Button size="md" variant="outline">
-                    1 - {showData} Data
-                  </Button>
-                </DropdownMenuTrigger>
-                <DropdownMenuContent className="w-56 text-sm">
-                  <DropdownMenuRadioGroup
-                    value={showData}
-                    onValueChange={setShowData}
-                  >
-                    <DropdownMenuRadioItem value="10">
-                      1 - 10 Data
-                    </DropdownMenuRadioItem>
-                    <DropdownMenuRadioItem value="50">
-                      1 - 50 Data
-                    </DropdownMenuRadioItem>
-                    <DropdownMenuRadioItem value="100">
-                      1 - 100 Data
-                    </DropdownMenuRadioItem>
-                    <DropdownMenuRadioItem value="250">
-                      1 - 250 Data
-                    </DropdownMenuRadioItem>
-                  </DropdownMenuRadioGroup>
-                </DropdownMenuContent>
-              </DropdownMenu>
-            </div>
-          </div>
-
-          <div className="flex items-center py-4">
-            <DropdownMenu>
-              <DropdownMenuTrigger asChild>
-                <Button variant="outline" className="ml-auto" size="md">
-                  Columns <ChevronDown />
-                </Button>
-              </DropdownMenuTrigger>
-              <DropdownMenuContent align="end">
-                {table
-                  .getAllColumns()
-                  .filter((column) => column.getCanHide())
-                  .map((column) => {
-                    return (
-                      <DropdownMenuCheckboxItem
-                        key={column.id}
-                        className="capitalize"
-                        checked={column.getIsVisible()}
-                        onCheckedChange={(value) =>
-                          column.toggleVisibility(!!value)
-                        }
-                      >
-                        {column.id}
-                      </DropdownMenuCheckboxItem>
-                    );
-                  })}
-              </DropdownMenuContent>
-            </DropdownMenu>
+    <Dialog>
+      <DialogTrigger asChild>
+        <Button className="bg-blue-600" size="md">
+          Tracking Berita
+        </Button>
+      </DialogTrigger>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>Form Tracking Berita</DialogTitle>
+        </DialogHeader>
+        <div className="flex flex-col gap-2">
+          {" "}
+          <Input type="text" placeholder="Content" value={inputValue} onChange={handleInputChange} />{" "}
+          <div className="w-full border rounded-sm text-xs p-2 flex flex-col max-h-[300px] overflow-auto">
+            {content.length > 0 &&
+              content.map((item: any) => (
+                <a
+                  key={item.id}
+                  className={`cursor-pointer  px-2 py-4 ${selectedId === item.id ? "font-bold bg-gray-200 rounded-sm" : "hover:bg-gray-100 hover:font-semibold"}`}
+                  onClick={() => {
+                    setSelectedId(item.id);
+                    setInputValue(item.title);
+                    fecthAll(item.title);
+                  }}
+                >
+                  {item.title}
+                </a>
+              ))}
           </div>
         </div>
-      </div>
-      <Table className="overflow-hidden">
-        <TableHeader>
-          {table.getHeaderGroups().map((headerGroup) => (
-            <TableRow key={headerGroup.id} className="bg-default-200">
-              {headerGroup.headers.map((header) => (
-                <TableHead key={header.id}>
-                  {header.isPlaceholder
-                    ? null
-                    : flexRender(
-                        header.column.columnDef.header,
-                        header.getContext()
-                      )}
-                </TableHead>
-              ))}
-            </TableRow>
-          ))}
-        </TableHeader>
-        <TableBody>
-          {table.getRowModel().rows?.length ? (
-            table.getRowModel().rows.map((row) => (
-              <TableRow key={row.id} className="h-[75px]">
-                {row.getVisibleCells().map((cell) => (
-                  <TableCell key={cell.id}>
-                    {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </TableCell>
-                ))}
-              </TableRow>
-            ))
-          ) : (
-            <TableRow>
-              <TableCell colSpan={columns.length} className="h-24 text-center">
-                No results.
-              </TableCell>
-            </TableRow>
-          )}
-        </TableBody>
-      </Table>
-      <TablePagination
-        table={table}
-        totalData={totalData}
-        totalPage={totalPage}
-      />
-      {/* <div className="flex justify-end mt-4">
-        <Button
-          color="primary"
-          size="md"
-          className="text-sm mr-3"
-          onClick={() => setShowTable(false)}
-        >
-          Tracking Berita Baru
-        </Button>
-      </div> */}
-      {/* </>
-      )} */}
-    </div>
+        {/* <DialogFooter className="sm:justify-start">
+          <DialogClose asChild>
+            <Button type="button">Close</Button>
+          </DialogClose>
+        </DialogFooter> */}
+        <DialogFooter className="flex justify-end gap-2">
+          <Button className="bg-blue-600 text-white" onClick={doSave}>
+            Tracking Berita
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
   );
-};
-
-export default NewsTable;
\ No newline at end of file
+}
diff --git a/app/[locale]/(protected)/admin/media-tracking/component/table.tsx b/app/[locale]/(protected)/admin/media-tracking/component/table.tsx
index 678330a9..954f89f6 100644
--- a/app/[locale]/(protected)/admin/media-tracking/component/table.tsx
+++ b/app/[locale]/(protected)/admin/media-tracking/component/table.tsx
@@ -54,27 +54,8 @@ import columns from "./column";
 import { listEnableCategory } from "@/service/content/content";
 import { close, loading } from "@/config/swal";
 import { Label } from "@/components/ui/label";
-import {
-  Dialog,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from "@/components/ui/dialog";
-import { link } from "fs";
-import { listDataAll } from "@/service/landing/landing";
-import SearchImageComponent from "@/components/form/media-tracking/search-image-card";
-import SearchVideoComponent from "@/components/form/media-tracking/search-video-card";
-import SearchDocumentComponent from "@/components/form/media-tracking/search-document-card";
-import SearchAudioComponent from "@/components/form/media-tracking/search-audio-card";
 import TrackingMediaModal from "./modal";
 import { getMediaTracking } from "@/service/media-tracking/media-tracking";
-import { group } from "console";
-import router from "next/router";
-import { title } from "process";
-import { InputGroup, InputGroupText } from "@/components/ui/input-group";
-import { Input } from "@/components/ui/input";
 
 const NewsTable = () => {
   const router = useRouter();
diff --git a/app/[locale]/(protected)/admin/settings/banner/component/table.tsx b/app/[locale]/(protected)/admin/settings/banner/component/table.tsx
index 03175fb1..5b57778c 100644
--- a/app/[locale]/(protected)/admin/settings/banner/component/table.tsx
+++ b/app/[locale]/(protected)/admin/settings/banner/component/table.tsx
@@ -65,13 +65,17 @@ import { listEnableCategory } from "@/service/content/content";
 import { Checkbox } from "@/components/ui/checkbox";
 import { close, loading } from "@/config/swal";
 import { Link } from "@/i18n/routing";
+import { data } from "jquery";
+import { useToast } from "@/components/ui/use-toast";
+import { setBanner } from "@/service/settings/settings";
+import { id } from "date-fns/locale";
 
-const ContentListTable = () => {
+const ContentListBanner = () => {
   const router = useRouter();
   const searchParams = useSearchParams();
   const [showData, setShowData] = React.useState("10");
   const [categories, setCategories] = React.useState<any>();
-  const [dataTable, setDataTable] = React.useState<any[]>([]);
+  const [data, setData] = React.useState<any[]>([]);
   const [totalData, setTotalData] = React.useState<number>(1);
   const [sorting, setSorting] = React.useState<SortingState>([]);
   const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(
@@ -86,28 +90,9 @@ const ContentListTable = () => {
   });
   const [categoryFilter, setCategoryFilter] = React.useState<number[]>([]);
   const [statusFilter, setStatusFilter] = React.useState<number[]>([]);
+  const [selectedItems, setSelectedItems] = React.useState<number[]>([]);
   const [page, setPage] = React.useState(1);
   const [totalPage, setTotalPage] = React.useState(1);
-  const table = useReactTable({
-    data: dataTable,
-    columns,
-    onSortingChange: setSorting,
-    onColumnFiltersChange: setColumnFilters,
-    getCoreRowModel: getCoreRowModel(),
-    getPaginationRowModel: getPaginationRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    getFilteredRowModel: getFilteredRowModel(),
-    onColumnVisibilityChange: setColumnVisibility,
-    onRowSelectionChange: setRowSelection,
-    onPaginationChange: setPagination,
-    state: {
-      sorting,
-      columnFilters,
-      columnVisibility,
-      rowSelection,
-      pagination,
-    },
-  });
 
   let typingTimer: any;
   const doneTypingInterval = 1500;
@@ -159,7 +144,7 @@ const ContentListTable = () => {
 
       console.log("contentData : ", data);
 
-      setDataTable(contentData);
+      setData(contentData);
       setTotalData(data?.totalElements);
       setTotalPage(data?.totalPages);
       close();
@@ -200,6 +185,38 @@ const ContentListTable = () => {
     }
   };
 
+  const handleSelect = (id: number) => {
+    setSelectedItems((prev) =>
+      prev.includes(id) ? prev.filter((item) => item !== id) : [...prev, id]
+    );
+  };
+
+  const handleSelectAll = () => {
+    if (selectedItems.length === data.length) {
+      setSelectedItems([]);
+    } else {
+      setSelectedItems(data.map((item: any) => Number(item.id)));
+    }
+  };
+
+  const { toast } = useToast();
+
+  const handleBanner = async (ids: number[]) => {
+    try {
+      await Promise.all(ids.map((id) => setBanner(id, true)));
+      toast({
+        title: "Sukses",
+        description: `${ids.length} item berhasil dijadikan banner.`,
+      });
+    } catch (err) {
+      toast({
+        title: "Gagal",
+        description: "Terjadi kesalahan saat menjadikan banner.",
+        variant: "destructive",
+      });
+    }
+  };
+
   return (
     <>
       <div className="flex justify-between ">
@@ -210,7 +227,7 @@ const ContentListTable = () => {
           onKeyDown={handleKeyDown}
           className="max-w-[300px]"
         />
-        <div className="flex flex-row gap-2">
+        {/* <div className="flex flex-row gap-2">
           <DropdownMenu>
             <DropdownMenuTrigger asChild>
               <Button size="md" variant="outline">
@@ -338,56 +355,57 @@ const ContentListTable = () => {
               </div>
             </PopoverContent>
           </Popover>
+        </div> */}
+      </div>
+      <div>
+        {/* Header select all + action */}
+        <div className="flex items-center justify-between mb-4">
+          <div className="flex items-center gap-2">
+            <Checkbox
+              checked={selectedItems.length === data.length}
+              onCheckedChange={handleSelectAll}
+            />
+            <span>Pilih Semua</span>
+          </div>
+          {selectedItems.length > 0 && (
+            <Button color="primary" onClick={() => handleBanner(selectedItems)}>
+              Jadikan Banner
+            </Button>
+          )}
+        </div>
+
+        {/* Grid Cards */}
+        <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
+          {data?.map((item: any) => (
+            <div
+              key={item.id}
+              className="relative rounded-lg shadow-md overflow-hidden border border-gray-200"
+            >
+              <div className="absolute top-2 left-2 z-10">
+                <Checkbox
+                  checked={selectedItems.includes(item.id)}
+                  onCheckedChange={() => handleSelect(item.id)}
+                />
+              </div>
+              <img
+                src={item.thumbnailLink || "/placeholder.jpg"}
+                alt={item.title}
+                className="w-full h-48 object-cover"
+              />
+              <div className="p-3">
+                <h4 className="font-semibold text-sm truncate">{item.title}</h4>
+              </div>
+            </div>
+          ))}
+        </div>
+        <div className="flex justify-center mt-6">
+          <div className="border rounded px-3 py-1 text-sm text-gray-600">
+            1
+          </div>
         </div>
       </div>
-      <Table className="overflow-hidden">
-        <TableHeader>
-          {table.getHeaderGroups().map((headerGroup) => (
-            <TableRow key={headerGroup.id} className="bg-default-200">
-              {headerGroup.headers.map((header) => (
-                <TableHead key={header.id}>
-                  {header.isPlaceholder
-                    ? null
-                    : flexRender(
-                        header.column.columnDef.header,
-                        header.getContext()
-                      )}
-                </TableHead>
-              ))}
-            </TableRow>
-          ))}
-        </TableHeader>
-        <TableBody>
-          {table.getRowModel().rows?.length ? (
-            table.getRowModel().rows.map((row) => (
-              <TableRow
-                key={row.id}
-                data-state={row.getIsSelected() && "selected"}
-                className="h-[75px]"
-              >
-                {row.getVisibleCells().map((cell) => (
-                  <TableCell key={cell.id}>
-                    {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </TableCell>
-                ))}
-              </TableRow>
-            ))
-          ) : (
-            <TableRow>
-              <TableCell colSpan={columns.length} className="h-24 text-center">
-                No results.
-              </TableCell>
-            </TableRow>
-          )}
-        </TableBody>
-      </Table>
-      <TablePagination
-        table={table}
-        totalData={totalData}
-        totalPage={totalPage}
-      />
     </>
   );
 };
 
-export default ContentListTable;
+export default ContentListBanner;
diff --git a/app/[locale]/(protected)/admin/settings/banner/page.tsx b/app/[locale]/(protected)/admin/settings/banner/page.tsx
index c3fcbe33..8385b071 100644
--- a/app/[locale]/(protected)/admin/settings/banner/page.tsx
+++ b/app/[locale]/(protected)/admin/settings/banner/page.tsx
@@ -5,6 +5,7 @@ import { useState } from "react";
 
 import BannerListTable from "./component/banner-table";
 import { Button } from "@/components/ui/button";
+import ContentListBanner from "./component/table";
 
 export default function AdminBanner() {
   const [selectedTab, setSelectedTab] = useState("content");
@@ -44,7 +45,11 @@ export default function AdminBanner() {
           </div>
         </div>
 
-        {selectedTab === "content" ? <ContentListTable /> : <BannerListTable />}
+        {selectedTab === "content" ? (
+          <ContentListBanner />
+        ) : (
+          <BannerListTable />
+        )}
       </div>
     </div>
   );
diff --git a/app/[locale]/(protected)/admin/settings/iklan/component/table.tsx b/app/[locale]/(protected)/admin/settings/iklan/component/table.tsx
index 21f35ad3..e9d72d23 100644
--- a/app/[locale]/(protected)/admin/settings/iklan/component/table.tsx
+++ b/app/[locale]/(protected)/admin/settings/iklan/component/table.tsx
@@ -30,6 +30,7 @@ import {
   ChevronRight,
   Eye,
   MoreVertical,
+  Plus,
   Search,
   SquarePen,
   Trash2,
@@ -65,6 +66,7 @@ import { listEnableCategory } from "@/service/content/content";
 import { Checkbox } from "@/components/ui/checkbox";
 import { close, loading } from "@/config/swal";
 import { Link } from "@/i18n/routing";
+import { TambahIklanModal } from "@/components/form/setting/form-add-iklan";
 
 const IklanList = () => {
   const router = useRouter();
@@ -202,6 +204,9 @@ const IklanList = () => {
 
   return (
     <>
+      <div>
+        <TambahIklanModal />
+      </div>
       <div className="flex justify-between ">
         <Input
           type="text"
diff --git a/app/[locale]/(protected)/admin/settings/iklan/page.tsx b/app/[locale]/(protected)/admin/settings/iklan/page.tsx
index 8615d36c..3571c256 100644
--- a/app/[locale]/(protected)/admin/settings/iklan/page.tsx
+++ b/app/[locale]/(protected)/admin/settings/iklan/page.tsx
@@ -14,38 +14,7 @@ export default function AdminIklan() {
     <div>
       <SiteBreadcrumb />
       <div className="w-full overflow-x-auto bg-white p-4 rounded-sm space-y-3">
-        <div className="flex justify-between">
-          {selectedTab === "content" ? "List Media" : " List Pop Up"}
-
-          <div className="flex flex-row gap-1 border-2 rounded-md w-fit mb-5">
-            <Button
-              rounded="md"
-              onClick={() => setSelectedTab("content")}
-              className={` hover:text-white
-                ${
-                  selectedTab === "content"
-                    ? "bg-black text-white "
-                    : "bg-white text-black "
-                }`}
-            >
-              Kontent
-            </Button>
-            <Button
-              rounded="md"
-              onClick={() => setSelectedTab("iklan")}
-              className={` hover:text-white
-                ${
-                  selectedTab === "iklan"
-                    ? "bg-black text-white "
-                    : "bg-white text-black "
-                }`}
-            >
-              Iklan
-            </Button>
-          </div>
-        </div>
-
-        {selectedTab === "content" ? <IklanList /> : <IklanListTable />}
+        <IklanList />
       </div>
     </div>
   );
diff --git a/app/[locale]/(protected)/admin/settings/popup/component/table.tsx b/app/[locale]/(protected)/admin/settings/popup/component/table.tsx
index f23f6709..bd716f74 100644
--- a/app/[locale]/(protected)/admin/settings/popup/component/table.tsx
+++ b/app/[locale]/(protected)/admin/settings/popup/component/table.tsx
@@ -65,13 +65,17 @@ import { listEnableCategory } from "@/service/content/content";
 import { Checkbox } from "@/components/ui/checkbox";
 import { close, loading } from "@/config/swal";
 import { Link } from "@/i18n/routing";
+import { data } from "jquery";
+import { useToast } from "@/components/ui/use-toast";
+import { setBanner } from "@/service/settings/settings";
+import { id } from "date-fns/locale";
 
-const PopUpList = () => {
+const ContentListPopUp = () => {
   const router = useRouter();
   const searchParams = useSearchParams();
   const [showData, setShowData] = React.useState("10");
   const [categories, setCategories] = React.useState<any>();
-  const [dataTable, setDataTable] = React.useState<any[]>([]);
+  const [data, setData] = React.useState<any[]>([]);
   const [totalData, setTotalData] = React.useState<number>(1);
   const [sorting, setSorting] = React.useState<SortingState>([]);
   const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(
@@ -86,28 +90,9 @@ const PopUpList = () => {
   });
   const [categoryFilter, setCategoryFilter] = React.useState<number[]>([]);
   const [statusFilter, setStatusFilter] = React.useState<number[]>([]);
+  const [selectedItems, setSelectedItems] = React.useState<number[]>([]);
   const [page, setPage] = React.useState(1);
   const [totalPage, setTotalPage] = React.useState(1);
-  const table = useReactTable({
-    data: dataTable,
-    columns,
-    onSortingChange: setSorting,
-    onColumnFiltersChange: setColumnFilters,
-    getCoreRowModel: getCoreRowModel(),
-    getPaginationRowModel: getPaginationRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    getFilteredRowModel: getFilteredRowModel(),
-    onColumnVisibilityChange: setColumnVisibility,
-    onRowSelectionChange: setRowSelection,
-    onPaginationChange: setPagination,
-    state: {
-      sorting,
-      columnFilters,
-      columnVisibility,
-      rowSelection,
-      pagination,
-    },
-  });
 
   let typingTimer: any;
   const doneTypingInterval = 1500;
@@ -159,7 +144,7 @@ const PopUpList = () => {
 
       console.log("contentData : ", data);
 
-      setDataTable(contentData);
+      setData(contentData);
       setTotalData(data?.totalElements);
       setTotalPage(data?.totalPages);
       close();
@@ -200,6 +185,38 @@ const PopUpList = () => {
     }
   };
 
+  const handleSelect = (id: number) => {
+    setSelectedItems((prev) =>
+      prev.includes(id) ? prev.filter((item) => item !== id) : [...prev, id]
+    );
+  };
+
+  const handleSelectAll = () => {
+    if (selectedItems.length === data.length) {
+      setSelectedItems([]);
+    } else {
+      setSelectedItems(data.map((item: any) => Number(item.id)));
+    }
+  };
+
+  const { toast } = useToast();
+
+  const handleBanner = async (ids: number[]) => {
+    try {
+      await Promise.all(ids.map((id) => setBanner(id, true)));
+      toast({
+        title: "Sukses",
+        description: `${ids.length} item berhasil dijadikan banner.`,
+      });
+    } catch (err) {
+      toast({
+        title: "Gagal",
+        description: "Terjadi kesalahan saat menjadikan banner.",
+        variant: "destructive",
+      });
+    }
+  };
+
   return (
     <>
       <div className="flex justify-between ">
@@ -210,7 +227,7 @@ const PopUpList = () => {
           onKeyDown={handleKeyDown}
           className="max-w-[300px]"
         />
-        <div className="flex flex-row gap-2">
+        {/* <div className="flex flex-row gap-2">
           <DropdownMenu>
             <DropdownMenuTrigger asChild>
               <Button size="md" variant="outline">
@@ -338,56 +355,57 @@ const PopUpList = () => {
               </div>
             </PopoverContent>
           </Popover>
+        </div> */}
+      </div>
+      <div>
+        {/* Header select all + action */}
+        <div className="flex items-center justify-between mb-4">
+          <div className="flex items-center gap-2">
+            <Checkbox
+              checked={selectedItems.length === data.length}
+              onCheckedChange={handleSelectAll}
+            />
+            <span>Pilih Semua</span>
+          </div>
+          {selectedItems.length > 0 && (
+            <Button color="primary" onClick={() => handleBanner(selectedItems)}>
+              Jadikan Banner
+            </Button>
+          )}
+        </div>
+
+        {/* Grid Cards */}
+        <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
+          {data?.map((item: any) => (
+            <div
+              key={item.id}
+              className="relative rounded-lg shadow-md overflow-hidden border border-gray-200"
+            >
+              <div className="absolute top-2 left-2 z-10">
+                <Checkbox
+                  checked={selectedItems.includes(item.id)}
+                  onCheckedChange={() => handleSelect(item.id)}
+                />
+              </div>
+              <img
+                src={item.thumbnailLink || "/placeholder.jpg"}
+                alt={item.title}
+                className="w-full h-48 object-cover"
+              />
+              <div className="p-3">
+                <h4 className="font-semibold text-sm truncate">{item.title}</h4>
+              </div>
+            </div>
+          ))}
+        </div>
+        <div className="flex justify-center mt-6">
+          <div className="border rounded px-3 py-1 text-sm text-gray-600">
+            1
+          </div>
         </div>
       </div>
-      <Table className="overflow-hidden">
-        <TableHeader>
-          {table.getHeaderGroups().map((headerGroup) => (
-            <TableRow key={headerGroup.id} className="bg-default-200">
-              {headerGroup.headers.map((header) => (
-                <TableHead key={header.id}>
-                  {header.isPlaceholder
-                    ? null
-                    : flexRender(
-                        header.column.columnDef.header,
-                        header.getContext()
-                      )}
-                </TableHead>
-              ))}
-            </TableRow>
-          ))}
-        </TableHeader>
-        <TableBody>
-          {table.getRowModel().rows?.length ? (
-            table.getRowModel().rows.map((row) => (
-              <TableRow
-                key={row.id}
-                data-state={row.getIsSelected() && "selected"}
-                className="h-[75px]"
-              >
-                {row.getVisibleCells().map((cell) => (
-                  <TableCell key={cell.id}>
-                    {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </TableCell>
-                ))}
-              </TableRow>
-            ))
-          ) : (
-            <TableRow>
-              <TableCell colSpan={columns.length} className="h-24 text-center">
-                No results.
-              </TableCell>
-            </TableRow>
-          )}
-        </TableBody>
-      </Table>
-      <TablePagination
-        table={table}
-        totalData={totalData}
-        totalPage={totalPage}
-      />
     </>
   );
 };
 
-export default PopUpList;
+export default ContentListPopUp;
diff --git a/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx b/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx
index 10116e1e..3dc28244 100644
--- a/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx
+++ b/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx
@@ -57,6 +57,7 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { Label } from "@/components/ui/label";
+import { CalendarPolriAdd } from "@/components/form/schedule/form-calendar-polri";
 
 const CalendarPolriTable = () => {
   const router = useRouter();
@@ -161,12 +162,7 @@ const CalendarPolriTable = () => {
               {t("calendar-polri")} {t("schedule")}
             </div>
             <div className="flex-none">
-              <Link href={"/contributor/schedule/press-conference/create"}>
-                <Button color="primary" className="text-white">
-                  <UploadIcon size={18} className="mr-2" />
-                  {t("create-schedule")}
-                </Button>
-              </Link>
+              <CalendarPolriAdd />
             </div>
           </div>
         </CardTitle>
diff --git a/app/[locale]/(public)/content-management/rewrite/page.tsx b/app/[locale]/(public)/content-management/rewrite/page.tsx
index 4430eef1..6a1b1d9d 100644
--- a/app/[locale]/(public)/content-management/rewrite/page.tsx
+++ b/app/[locale]/(public)/content-management/rewrite/page.tsx
@@ -4,14 +4,24 @@ import HeaderManagement from "@/components/landing-page/header-management";
 import SidebarManagement from "@/components/landing-page/sidebar-management";
 import { close, error, loading, successCallback } from "@/config/swal";
 import { getCookiesDecrypt } from "@/lib/utils";
-import { checkWishlistStatus, deleteWishlist, getContentRewritePagination, getInfoProfile, saveWishlist } from "@/service/landing/landing";
+import {
+  checkWishlistStatus,
+  deleteWishlist,
+  getContentRewritePagination,
+  getInfoProfile,
+  saveWishlist,
+} from "@/service/landing/landing";
 import { useRouter, useSearchParams } from "next/navigation";
 import React, { useEffect, useState } from "react";
 import Swal from "sweetalert2";
 import withReactContent from "sweetalert2-react-content";
 import { Card, CardContent } from "@/components/ui/card";
 import { Link } from "@/i18n/routing";
-import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@/components/ui/popover";
 import { Icon } from "@iconify/react/dist/iconify.js";
 import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
@@ -63,7 +73,10 @@ const page = () => {
   }, [page, category, title, refresh]);
 
   async function getData() {
-    const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : category || "";
+    const filter =
+      categoryFilter?.length > 0
+        ? categoryFilter?.sort().join(",")
+        : category || "";
 
     const name = title == undefined ? "" : title;
     const format = formatFilter == undefined ? "" : formatFilter?.join(",");
@@ -119,7 +132,9 @@ const page = () => {
   };
 
   const copyToClip = async (url: any) => {
-    await navigator.clipboard.writeText(`https://mediahub.polri.go.id/image/detail/${url}`);
+    await navigator.clipboard.writeText(
+      `https://mediahub.polri.go.id/image/detail/${url}`
+    );
     setCopySuccess("Copied");
     // toast.success("Link Berhasil Di Copy");
   };
@@ -211,48 +226,110 @@ const page = () => {
             {contentImage?.length > 0 ? (
               <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
                 {contentImage?.map((image: any) => (
-                  <Card key={image?.id} className="hover:scale-105 transition-transform duration-300">
+                  <Card
+                    key={image?.id}
+                    className="hover:scale-105 transition-transform duration-300"
+                  >
                     <CardContent className="flex flex-col text-xs lg:text-sm w-full p-0">
                       <div>
                         <div className="relative group overflow-hidden shadow-md hover:shadow-lg">
                           <div className="relative h-60 rounded-lg overflow-hidden">
-                            <ImageBlurry src={image?.thumbnailUrl} alt={image?.title} style={{ objectFit: "contain", width: "100%", height: "100%" }} />
+                            <ImageBlurry
+                              src={image?.thumbnailUrl}
+                              alt={image?.title}
+                              style={{
+                                objectFit: "contain",
+                                width: "100%",
+                                height: "100%",
+                              }}
+                            />
                             <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-transparent via-gray-900/80 to-transparent text-white">
-                              <Link href={`/content-management/rewrite/detail/${image.id}`}>
-                                <p className="text-sm p-2 lg:text-base font-semibold truncate">{image?.title}</p>
+                              <Link
+                                href={`/content-management/rewrite/detail/${image.id}`}
+                              >
+                                <p className="text-sm p-2 lg:text-base font-semibold truncate">
+                                  {image?.title}
+                                </p>
                               </Link>
                               <p className="flex text-[10px] ml-1 mb-2 items-end">
                                 <Popover>
-                                  <PopoverTrigger className="flex cursor-pointer" asChild>
+                                  <PopoverTrigger
+                                    className="flex cursor-pointer"
+                                    asChild
+                                  >
                                     <a className="flex justify-end items-end place-items-end">
-                                      <Icon className="text-white ml-1" fontSize={25} icon="tabler:dots" />
+                                      <Icon
+                                        className="text-white ml-1"
+                                        fontSize={25}
+                                        icon="tabler:dots"
+                                      />
                                     </a>
                                   </PopoverTrigger>
                                   <PopoverContent className="w-52">
-                                    <div onClick={() => handleSaveWishlist(image?.mediaUpload?.id)} className="cursor-pointer flex flex-row gap-2 hover:text-red-800">
-                                      <Icon icon="material-symbols:bookmark-outline" fontSize={25} />
-                                      <p className="text-base font-semibold mb-2">{t("save")}</p>
+                                    <div
+                                      onClick={() =>
+                                        handleSaveWishlist(
+                                          image?.mediaUpload?.id
+                                        )
+                                      }
+                                      className="cursor-pointer flex flex-row gap-2 hover:text-red-800"
+                                    >
+                                      <Icon
+                                        icon="material-symbols:bookmark-outline"
+                                        fontSize={25}
+                                      />
+                                      <p className="text-base font-semibold mb-2">
+                                        {t("save")}
+                                      </p>
                                     </div>
-                                    <Link href={`/content-management/rewrite/create/${image?.mediaUpload?.id}`} className="flex flex-row hover:text-red-800 gap-2">
+                                    <Link
+                                      href={`/content-management/rewrite/create/${image?.id}`}
+                                      className="flex flex-row hover:text-red-800 gap-2"
+                                    >
                                       <Icon icon="jam:write" fontSize={25} />
-                                      <p className="text-base font-semibold mb-2">Content Rewrite</p>
+                                      <p className="text-base font-semibold mb-2">
+                                        Content Rewrite
+                                      </p>
                                     </Link>
                                     <div className="flex items-center gap-1 hover:text-red-800 w-full rounded-lg">
                                       <Popover>
                                         <PopoverTrigger asChild>
                                           <button className="w-full flex flex-row items-center gap-3">
-                                            <Icon icon="oi:share" fontSize={20} />
-                                            <p className="text-base font-semibold mb-1"> {t("share")}</p>
+                                            <Icon
+                                              icon="oi:share"
+                                              fontSize={20}
+                                            />
+                                            <p className="text-base font-semibold mb-1">
+                                              {" "}
+                                              {t("share")}
+                                            </p>
                                           </button>
                                         </PopoverTrigger>
                                         <PopoverContent>
                                           <div className="flex flex-col">
-                                            <h1 className="mb-2">{t("shareTo")}</h1>
+                                            <h1 className="mb-2">
+                                              {t("shareTo")}
+                                            </h1>
                                             <div className="flex flex-col mb-2">
-                                              <p className="text-base font-semibold mb-1">{t("destinationEmail")}</p>
-                                              <Input value={emailShareInput} onChange={(event) => setEmailShareInput(event.target.value)} onKeyPress={handleEmailList} type="email" placeholder={t("pressEnter")} />
+                                              <p className="text-base font-semibold mb-1">
+                                                {t("destinationEmail")}
+                                              </p>
+                                              <Input
+                                                value={emailShareInput}
+                                                onChange={(event) =>
+                                                  setEmailShareInput(
+                                                    event.target.value
+                                                  )
+                                                }
+                                                onKeyPress={handleEmailList}
+                                                type="email"
+                                                placeholder={t("pressEnter")}
+                                              />
                                             </div>
-                                            <Button className="bg-blue-500 text-white p-2 w-fit rounded-lg" onClick={() => shareToEmail()}>
+                                            <Button
+                                              className="bg-blue-500 text-white p-2 w-fit rounded-lg"
+                                              onClick={() => shareToEmail()}
+                                            >
                                               {t("send")}
                                             </Button>
                                           </div>
@@ -272,7 +349,13 @@ const page = () => {
               </div>
             ) : (
               <p className="flex items-center justify-center">
-                <Image width={1920} height={1080} src="/assets/empty-data.png" alt="empty" className="h-52 w-52 my-4" />
+                <Image
+                  width={1920}
+                  height={1080}
+                  src="/assets/empty-data.png"
+                  alt="empty"
+                  className="h-52 w-52 my-4"
+                />
               </p>
             )}
           </div>
diff --git a/components/form/content/spit-convert-form.tsx b/components/form/content/spit-convert-form.tsx
index 40f96b6f..5a381f13 100644
--- a/components/form/content/spit-convert-form.tsx
+++ b/components/form/content/spit-convert-form.tsx
@@ -45,11 +45,16 @@ import "swiper/css";
 import "swiper/css/navigation";
 import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
 import { request } from "http";
-import { generateDataArticle, getDetailArticle } from "@/service/content/ai";
+import {
+  generateDataArticle,
+  generateDataRewrite,
+  getDetailArticle,
+} from "@/service/content/ai";
 import { getCookiesDecrypt } from "@/lib/utils";
 import dynamic from "next/dynamic";
 import { error } from "@/lib/swal";
 import { useTranslations } from "next-intl";
+import { contextType } from "cleave.js/react";
 
 const imageSchema = z.object({
   contentTitle: z.string().min(1, { message: "Judul diperlukan" }),
@@ -501,12 +506,15 @@ export default function FormConvertSPIT() {
       additionalKeywords: detail?.contentTitle,
       targetCountry: null,
       articleSize: "news",
+      contextType: "text",
+      context: detail?.contentDescription,
       projectId: 2,
       createdBy: roleId,
-      clientId: "ngDLPPiorplznw2jTqVe3YFCz5xqKfUJ",
+      sentiment: "Humorous",
+      clientId: "7QTW8cMojyayt6qnhqTOeJaBI70W4EaQ",
     };
 
-    const res = await generateDataArticle(request);
+    const res = await generateDataRewrite(request);
     close();
 
     if (res?.error) {
diff --git a/components/form/schedule/form-calendar-polri.tsx b/components/form/schedule/form-calendar-polri.tsx
new file mode 100644
index 00000000..d9358fb5
--- /dev/null
+++ b/components/form/schedule/form-calendar-polri.tsx
@@ -0,0 +1,112 @@
+// components/TambahIklanModal.tsx
+"use client";
+
+import * as React from "react";
+import {
+  Dialog,
+  DialogTrigger,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { CalendarIcon, Plus } from "lucide-react";
+import { useTranslations } from "next-intl";
+import DatePicker from "react-datepicker";
+import { id } from "date-fns/locale";
+import "react-datepicker/dist/react-datepicker.css";
+
+export function CalendarPolriAdd() {
+  const [open, setOpen] = React.useState(false);
+  const t = useTranslations("Schedule");
+  const [eventDate, setEventDate] = React.useState<Date | null>(new Date());
+  return (
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>
+        <Button onClick={() => setOpen(true)} color="primary" size="md">
+          <Plus className="mr-2 h-4 w-4" /> {t("calendar-polri")}{" "}
+          {t("schedule")}
+        </Button>
+      </DialogTrigger>
+      <DialogContent size="md">
+        <DialogHeader>
+          <DialogTitle>Buat Jadwal Kalender Polri</DialogTitle>
+        </DialogHeader>
+
+        <div className="space-y-4">
+          <div>
+            <p className="font-medium mb-1">Tanggal Acara</p>
+            <div className="relative">
+              <DatePicker
+                selected={eventDate}
+                onChange={(date) => setEventDate(date)}
+                dateFormat="dd MMMM yyyy"
+                locale={id}
+                className="w-full px-4 py-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
+              />
+              <CalendarIcon className="absolute right-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-500 pointer-events-none" />
+            </div>
+          </div>
+          <div>
+            <p className="font-medium">Publish Area</p>
+            <div className="flex flex-wrap gap-4 mt-2">
+              {["Semua", "Nasional", "Polda", "Satker", "International"].map(
+                (label) => (
+                  <label key={label} className="flex items-center gap-2">
+                    <Checkbox id={label} />
+                    <span>{label}</span>
+                  </label>
+                )
+              )}
+            </div>
+          </div>
+
+          <div>
+            <p className="font-medium">Nama Acara</p>
+            <Input placeholder="Masukkan nama acara" />
+          </div>
+
+          <div className="border-2 border-dashed rounded-md p-4 flex flex-col items-center justify-center text-center text-sm text-muted-foreground">
+            <svg
+              className="w-6 h-6 mb-2 text-blue-500"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+              viewBox="0 0 24 24"
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M4 16v1a2 2 0 002 2h12a2 2 0 002-2v-1M12 12v9m0-9l3 3m-3-3l-3 3m6-11a4 4 0 00-8 0v1H4a2 2 0 00-2 2v4h20v-4a2 2 0 00-2-2h-4v-1z"
+              />
+            </svg>
+            <div>
+              Drag your file(s) or{" "}
+              <span className="text-blue-500 underline cursor-pointer">
+                browse
+              </span>
+            </div>
+            <div className="text-xs mt-1">Max 10 MB files are allowed</div>
+          </div>
+
+          <div>
+            <p className="font-medium">Deskripsi</p>
+            <Textarea placeholder="Masukkan deskripsi acara" rows={4} />
+          </div>
+
+          <div className="text-right">
+            <Button
+              type="submit"
+              className="bg-blue-600 text-white hover:bg-blue-700"
+            >
+              Submit
+            </Button>
+          </div>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
diff --git a/components/form/schedule/live-report-form.tsx b/components/form/schedule/live-report-form.tsx
index e5a0eb19..cf3a73a4 100644
--- a/components/form/schedule/live-report-form.tsx
+++ b/components/form/schedule/live-report-form.tsx
@@ -99,10 +99,10 @@ export default function FormLiveReport() {
       address: data.location,
       speakerTitle: data.level,
       speakerName: data.name,
-      startTime, // Start time from state
-      endTime, // End time from state
-      addressLat: "0.0", // Replace with actual latitude
-      addressLong: "0.0", // Replace with actual longitude
+      startTime,
+      endTime,
+      addressLat: "0.0",
+      addressLong: "0.0",
       startDate: date?.from ? format(date.from, "yyyy-MM-dd") : null,
       endDate: date?.to ? format(date.to, "yyyy-MM-dd") : null,
       isYoutube: isLiveStreamingEnabled,
diff --git a/components/form/setting/form-add-iklan.tsx b/components/form/setting/form-add-iklan.tsx
new file mode 100644
index 00000000..2f702060
--- /dev/null
+++ b/components/form/setting/form-add-iklan.tsx
@@ -0,0 +1,108 @@
+// components/TambahIklanModal.tsx
+"use client";
+
+import * as React from "react";
+import {
+  Dialog,
+  DialogTrigger,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Plus } from "lucide-react";
+
+export function TambahIklanModal() {
+  const [open, setOpen] = React.useState(false);
+
+  return (
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>
+        <Button onClick={() => setOpen(true)} color="primary" size="md">
+          <Plus className="mr-2 h-4 w-4" />
+          Tambah Iklan
+        </Button>
+      </DialogTrigger>
+      <DialogContent size="md">
+        <DialogHeader>
+          <DialogTitle>Tambah Iklan</DialogTitle>
+        </DialogHeader>
+
+        <div className="space-y-4">
+          <div>
+            <p className="font-medium">Target Area</p>
+            <div className="flex flex-wrap gap-4 mt-2">
+              {["Kiri - 1", "Kiri - 2", "Kanan - 1", "Kanan - 2"].map(
+                (label) => (
+                  <label key={label} className="flex items-center gap-2">
+                    <Checkbox id={label} />
+                    <span>{label}</span>
+                  </label>
+                )
+              )}
+            </div>
+          </div>
+
+          <div>
+            <p className="font-medium">Publish Area</p>
+            <div className="flex flex-wrap gap-4 mt-2">
+              {["Semua", "Nasional", "Polda", "Satker", "International"].map(
+                (label) => (
+                  <label key={label} className="flex items-center gap-2">
+                    <Checkbox id={label} />
+                    <span>{label}</span>
+                  </label>
+                )
+              )}
+            </div>
+          </div>
+
+          <div>
+            <p className="font-medium">Nama Iklan</p>
+            <Input placeholder="Masukkan nama iklan" />
+          </div>
+
+          <div className="border-2 border-dashed rounded-md p-4 flex flex-col items-center justify-center text-center text-sm text-muted-foreground">
+            <svg
+              className="w-6 h-6 mb-2 text-blue-500"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+              viewBox="0 0 24 24"
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M4 16v1a2 2 0 002 2h12a2 2 0 002-2v-1M12 12v9m0-9l3 3m-3-3l-3 3m6-11a4 4 0 00-8 0v1H4a2 2 0 00-2 2v4h20v-4a2 2 0 00-2-2h-4v-1z"
+              />
+            </svg>
+            <div>
+              Drag your file(s) or{" "}
+              <span className="text-blue-500 underline cursor-pointer">
+                browse
+              </span>
+            </div>
+            <div className="text-xs mt-1">Max 10 MB files are allowed</div>
+          </div>
+
+          <div>
+            <p className="font-medium">Deskripsi</p>
+            <Textarea placeholder="Masukkan deskripsi iklan" rows={4} />
+          </div>
+
+          <div className="text-right">
+            <Button
+              type="submit"
+              className="bg-blue-600 text-white hover:bg-blue-700"
+            >
+              Tambah Iklan
+            </Button>
+          </div>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
diff --git a/service/content/ai.ts b/service/content/ai.ts
index 28a4f055..f97cff19 100644
--- a/service/content/ai.ts
+++ b/service/content/ai.ts
@@ -10,6 +10,15 @@ export async function generateDataArticle(data: any) {
   return await httpPost("ai-writer/save-article", headers, data);
 }
 
+export async function generateDataRewrite(data: any) {
+  const headers = {
+    "content-type": "application/json",
+    Authorization:
+      "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+  };
+  return await httpPost("ai-writer/create-rewriter", headers, data);
+}
+
 export async function getGenerateTitle(data: any) {
   const headers = {
     "content-type": "application/json",
@@ -109,5 +118,3 @@ export async function detailMediaNulis(id: any) {
   const url = `media/nulis-ai?id=${id}`;
   return httpGetInterceptor({ url });
 }
-
-