update

components/details/details-content.tsx

@@ -7,6 +7,7 @@ import { close, loading } from "@/config/swal";
 import { useParams } from "next/navigation";
 import Author from "../landing-page/author";
 import { Link2, MailIcon } from "lucide-react";
+import { getAdvertise } from "@/service/advertisement";
 
 type TabKey = "trending" | "comments" | "latest";
 
@@ -27,6 +28,15 @@ type Article = {
   }[];
 };
 
+type Advertise = {
+  id: number;
+  title: string;
+  description: string;
+  placement: string;
+  contentFileUrl: string;
+  redirectLink: string;
+};
+
 interface CategoryType {
   id: number;
   label: string;
@@ -69,6 +79,36 @@ export default function DetailContent() {
     { id: "latest", label: "Latest" },
   ];
 
+  const [bannerAd, setBannerAd] = useState<Advertise | null>(null);
+
+  useEffect(() => {
+    initStateAdver();
+  }, []);
+
+  async function initStateAdver() {
+    const req = {
+      limit: 100,
+      page: 1,
+      sort: "desc",
+      sortBy: "created_at",
+      isPublish: true,
+    };
+
+    try {
+      const res = await getAdvertise(req);
+      const data: Advertise[] = res?.data?.data || [1];
+
+      // filter iklan dengan placement = "banner"
+      const banner = data.find((ad) => ad.placement === "jumbotron");
+
+      if (banner) {
+        setBannerAd(banner);
+      }
+    } catch (err) {
+      console.error("Error fetching advertisement:", err);
+    }
+  }
+
   useEffect(() => {
     fetchTabArticles();
   }, [activeTab]);
@@ -520,13 +560,32 @@ export default function DetailContent() {
         <div className="md:col-span-1 space-y-6">
           <div className="sticky top-0 space-y-6">
             <div className="bg-white shadow p-4 rounded-lg">
+              {bannerAd ? (
+                <a
+                  href={bannerAd.redirectLink}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="block w-full"
+                >
+                  <div className="relative w-full h-[350px] flex justify-center">
                     <Image
-                src={"/kolom.png"}
+                      src={bannerAd.contentFileUrl}
-                alt="Iklan"
+                      alt={bannerAd.title || "Iklan Banner"}
-                width={345}
+                      width={1200} // ukuran dasar untuk responsive
-                height={345}
+                      height={350}
-                className="rounded"
+                      className="object-cover w-full h-full"
                     />
+                  </div>
+                </a>
+              ) : (
+                <Image
+                  src="/kolom.png"
+                  alt="Berita Utama"
+                  width={1200}
+                  height={188}
+                  className="object-contain w-full h-[188px]"
+                />
+              )}
               <button className="mt-4 w-full bg-black text-white py-2 rounded hover:opacity-90">
                 Learn More
               </button>

components/form/article/create-article-form.tsx

@@ -9,7 +9,7 @@ import { CloudUploadIcon, TimesIcon } from "@/components/icons";
 import Image from "next/image";
 import ReactSelect from "react-select";
 import makeAnimated from "react-select/animated";
-import { htmlToString } from "@/utils/global";
+import { convertDateFormatNoTime, htmlToString } from "@/utils/global";
 import { close, error, loading, successToast } from "@/config/swal";
 import { useRouter } from "next/navigation";
 import Link from "next/link";
@@ -44,6 +44,13 @@ import GenerateSingleArticleForm from "./generate-ai-single-form";
 import GenerateContentRewriteForm from "./generate-ai-content-rewrite-form";
 import { Textarea } from "@/components/ui/textarea";
 import { Badge } from "@/components/ui/badge";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@/components/ui/popover";
+import { Calendar } from "@/components/ui/calendar";
+import DatePicker from "react-datepicker";
 
 const CustomEditor = dynamic(
   () => {
@@ -121,8 +128,8 @@ export default function CreateArticleForm() {
     "publish"
   );
   const [isScheduled, setIsScheduled] = useState(false);
-
+  const [startDateValue, setStartDateValue] = useState<Date | undefined>();
-  const [startDateValue, setStartDateValue] = useState<any>(null);
+  const [startTimeValue, setStartTimeValue] = useState<string>("");
 
   const { getRootProps, getInputProps } = useDropzone({
     onDrop: (acceptedFiles) => {
@@ -332,12 +339,34 @@ export default function CreateArticleForm() {
       }
     }
 
-    if (status === "scheduled") {
+    if (status === "scheduled" && startDateValue) {
+      // ambil waktu, default 00:00 jika belum diisi
+      const [hours, minutes] = startTimeValue
+        ? startTimeValue.split(":").map(Number)
+        : [0, 0];
+
+      // gabungkan tanggal + waktu
+      const combinedDate = new Date(startDateValue);
+      combinedDate.setHours(hours, minutes, 0, 0);
+
+      // format: 2025-10-08 14:30:00
+      const formattedDateTime = `${combinedDate.getFullYear()}-${String(
+        combinedDate.getMonth() + 1
+      ).padStart(2, "0")}-${String(combinedDate.getDate()).padStart(
+        2,
+        "0"
+      )} ${String(combinedDate.getHours()).padStart(2, "0")}:${String(
+        combinedDate.getMinutes()
+      ).padStart(2, "0")}:00`;
+
       const request = {
         id: articleId,
-        date: `${startDateValue?.year}-${startDateValue?.month}-${startDateValue?.day}`,
+        date: formattedDateTime,
       };
+
+      console.log("📤 Sending schedule request:", request);
       const res = await createArticleSchedule(request);
+      console.log("✅ Schedule response:", res);
     }
 
     close();
@@ -812,32 +841,49 @@ export default function CreateArticleForm() {
               </label>
             </div>
 
-            {/* {isScheduled && (
+            {isScheduled && (
-              <div className="flex flex-col lg:flex-row gap-3">
+              <div className="flex flex-col lg:flex-row gap-3 mt-2">
-                <div className="w-full lg:w-[140px] flex flex-col gal-2 ">
+                {/* Pilih tanggal */}
+                <div className="w-full lg:w-[140px] flex flex-col gap-2">
                   <p className="text-sm">Tanggal</p>
                   <Popover>
                     <PopoverTrigger>
                       <Button
                         type="button"
-                        className="w-full !h-[30px] lg:h-[40px] border-1 rounded-lg text-black"
+                        className="w-full !h-[37px] lg:h-[37px] border-1 rounded-lg text-black"
                         variant="outline"
                       >
                         {startDateValue
-                          ? convertDateFormatNoTime(startDateValue)
+                          ? startDateValue.toISOString().split("T")[0]
                           : "-"}
                       </Button>
                     </PopoverTrigger>
                     <PopoverContent className="bg-transparent p-0">
-                      <Calendar
+                      <DatePicker
                         selected={startDateValue}
-                        onSelect={setStartDateValue}
+                        onChange={(date) =>
+                          setStartDateValue(date ?? undefined)
+                        }
+                        dateFormat="yyyy-MM-dd"
+                        className="w-full border rounded-lg px-2 py-1 text-black cursor-pointer h-[150px]"
+                        placeholderText="Pilih tanggal"
                       />
                     </PopoverContent>
                   </Popover>
                 </div>
+
+                {/* Pilih waktu */}
+                <div className="w-full lg:w-[140px] flex flex-col gap-2">
+                  <p className="text-sm">Waktu</p>
+                  <input
+                    type="time"
+                    value={startTimeValue}
+                    onChange={(e) => setStartTimeValue(e.target.value)}
+                    className="w-full border rounded-lg px-2 py-[6px] text-black"
+                  />
                 </div>
-            )} */}
+              </div>
+            )}
           </div>
         </div>
 

components/landing-page/breaking-news.tsx

@@ -6,6 +6,7 @@ import Image from "next/image";
 import { Calendar } from "lucide-react";
 import { getListArticle } from "@/service/article";
 import Link from "next/link";
+import { getAdvertise } from "@/service/advertisement";
 
 type Article = {
   id: number;
@@ -19,6 +20,15 @@ type Article = {
   files: { fileUrl: string; file_alt: string }[];
 };
 
+type Advertise = {
+  id: number;
+  title: string;
+  description: string;
+  placement: string;
+  contentFileUrl: string;
+  redirectLink: string;
+};
+
 export default function BreakingNews() {
   const [articles, setArticles] = useState<Article[]>([]);
   const [editorArticles, setEditorArticles] = useState<Article[]>([]);
@@ -26,6 +36,35 @@ export default function BreakingNews() {
   const [activeTab, setActiveTab] = useState<
     "trending" | "comments" | "latest"
   >("trending");
+  const [bannerAd, setBannerAd] = useState<Advertise | null>(null);
+
+  useEffect(() => {
+    initStateAdver();
+  }, []);
+
+  async function initStateAdver() {
+    const req = {
+      limit: 100,
+      page: 1,
+      sort: "desc",
+      sortBy: "created_at",
+      isPublish: true,
+    };
+
+    try {
+      const res = await getAdvertise(req);
+      const data: Advertise[] = res?.data?.data || [];
+
+      // filter iklan dengan placement = "banner"
+      const banner = data.find((ad) => ad.placement === "banner");
+
+      if (banner) {
+        setBannerAd(banner);
+      }
+    } catch (err) {
+      console.error("Error fetching advertisement:", err);
+    }
+  }
 
   useEffect(() => {
     fetchArticles();
@@ -141,13 +180,33 @@ export default function BreakingNews() {
             </div>
           )}
           <div className="relative mb-2 h-[120px] overflow-hidden flex items-center border my-8">
+            {bannerAd ? (
+              <a
+                href={bannerAd.redirectLink}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="block w-full"
+              >
+                <div className="relative w-full h-[350px] flex justify-center">
                   <Image
-              src={"/image-kolom.png"}
+                    src={bannerAd.contentFileUrl}
-              alt="Kolom PPS"
+                    alt={bannerAd.title || "Iklan Banner"}
-              fill
+                    width={1200} // ukuran dasar untuk responsive
-              className="w-full object-cover"
+                    height={350}
+                    className="object-cover w-full h-full"
                   />
                 </div>
+              </a>
+            ) : (
+              <Image
+                src="/image-kolom.png"
+                alt="Berita Utama"
+                width={1200}
+                height={188}
+                className="object-contain w-full h-[188px]"
+              />
+            )}
+          </div>
 
           <div className="mt-10">
             <h2 className="text-lg md:text-xl font-bold mb-4 border-b pb-2">
@@ -206,13 +265,33 @@ export default function BreakingNews() {
             </div>
           </div>
           <div className="relative mb-2 h-[120px] overflow-hidden flex items-center border my-8">
+            {bannerAd ? (
+              <a
+                href={bannerAd.redirectLink}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="block w-full"
+              >
+                <div className="relative w-full h-[350px] flex justify-center">
                   <Image
-              src={"/image-kolom.png"}
+                    src={bannerAd.contentFileUrl}
-              alt="Kolom PPS"
+                    alt={bannerAd.title || "Iklan Banner"}
-              fill
+                    width={1200} // ukuran dasar untuk responsive
-              className="w-full object-cover"
+                    height={350}
+                    className="object-cover w-full h-full"
                   />
                 </div>
+              </a>
+            ) : (
+              <Image
+                src="/image-kolom.png"
+                alt="Berita Utama"
+                width={1200}
+                height={188}
+                className="object-contain w-full h-[188px]"
+              />
+            )}
+          </div>
           {/* News Index Section */}
           <div className="mt-10">
             <h2 className="text-lg md:text-xl font-bold mb-4 border-b pb-2">
@@ -335,21 +414,34 @@ export default function BreakingNews() {
             ))}
           </div>
           <div className="relative w-[1111px] max-w-full h-[300px] overflow-hidden flex items-center mx-auto border my-6 rounded">
+            {bannerAd ? (
+              <a
+                href={bannerAd.redirectLink}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="block w-full"
+              >
+                <div className="relative w-full h-[350px] flex justify-center">
+                  <Image
+                    src={bannerAd.contentFileUrl}
+                    alt={bannerAd.title || "Iklan Banner"}
+                    width={1200} // ukuran dasar untuk responsive
+                    height={350}
+                    className="object-cover w-full h-full"
+                  />
+                </div>
+              </a>
+            ) : (
               <Image
                 src="/kolom.png"
                 alt="Berita Utama"
-              fill
+                width={1200}
-              className="object-contain rounded"
+                height={188}
-            />
+                className="object-contain w-full h-[188px]"
-          </div>
-          <div className="relative w-[1111px] max-w-full h-[300px] overflow-hidden flex items-center mx-auto border my-6 rounded">
-            <Image
-              src="/kolom.png"
-              alt="Berita Utama"
-              fill
-              className="object-contain rounded"
               />
+            )}
           </div>
+
           {/* Follow Us Section */}
           <div className="mt-10">
             <h2 className="text-lg md:text-xl font-bold mb-4 border-b pb-2">
@@ -437,8 +529,33 @@ export default function BreakingNews() {
       </div>
 
       {/* Banner Slot */}
-      <div className="mt-8 border text-center py-10 text-gray-400 font-bold tracking-widest">
+      <div className="mt-8 text-center py-10 text-gray-400 font-bold tracking-widest">
-        KOLOM PPS
+        {bannerAd ? (
+          <a
+            href={bannerAd.redirectLink}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="block w-full"
+          >
+            <div className="relative w-full h-auto flex justify-center">
+              <Image
+                src={bannerAd.contentFileUrl}
+                alt={bannerAd.title || "Iklan Banner"}
+                width={1200} // ukuran dasar untuk responsive
+                height={350}
+                className="object-cover w-full h-full"
+              />
+            </div>
+          </a>
+        ) : (
+          <Image
+            src="/image-kolom.png"
+            alt="Berita Utama"
+            width={1200}
+            height={188}
+            className="object-contain w-full h-[188px]"
+          />
+        )}
       </div>
     </section>
   );

components/landing-page/news.tsx

@@ -5,6 +5,7 @@ import Image from "next/image";
 import { getListArticle } from "@/service/article";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import { getAdvertise } from "@/service/advertisement";
 
 type Article = {
   id: number;
@@ -23,10 +24,48 @@ type Article = {
   }[];
 };
 
+type Advertise = {
+  id: number;
+  title: string;
+  description: string;
+  placement: string;
+  contentFileUrl: string;
+  redirectLink: string;
+};
+
 export default function BumnNews() {
   const [articles, setArticles] = useState<Article[]>([]);
   const [popular, setPopular] = useState<Article[]>([]);
-  const pathname = usePathname(); // ⬅️ "/bumn-news" misalnya
+  const pathname = usePathname();
+  const [bannerAd, setBannerAd] = useState<Advertise | null>(null);
+
+  useEffect(() => {
+    initStateAdver();
+  }, []);
+
+  async function initStateAdver() {
+    const req = {
+      limit: 100,
+      page: 1,
+      sort: "desc",
+      sortBy: "created_at",
+      isPublish: true,
+    };
+
+    try {
+      const res = await getAdvertise(req);
+      const data: Advertise[] = res?.data?.data || [1];
+
+      // filter iklan dengan placement = "banner"
+      const banner = data.find((ad) => ad.placement === "jumbotron");
+
+      if (banner) {
+        setBannerAd(banner);
+      }
+    } catch (err) {
+      console.error("Error fetching advertisement:", err);
+    }
+  } // ⬅️ "/bumn-news" misalnya
   const categoryName =
     pathname
       .split("/")
@@ -215,14 +254,33 @@ export default function BumnNews() {
 
         {/* Advert */}
         <div className="mt-6">
+          {bannerAd ? (
+            <a
+              href={bannerAd.redirectLink}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="block w-full"
+            >
+              <div className="relative w-full h-[350px] flex justify-center">
                 <Image
-            src="/adversment.png"
+                  src={bannerAd.contentFileUrl}
-            alt="Advertisement"
+                  alt={bannerAd.title || "Iklan Banner"}
-            width={300}
+                  width={1200} // ukuran dasar untuk responsive
-            height={250}
+                  height={350}
-            className="mx-auto"
+                  className="object-cover w-full h-full"
                 />
               </div>
+            </a>
+          ) : (
+            <Image
+              src="/kolom.png"
+              alt="Berita Utama"
+              width={1200}
+              height={188}
+              className="object-contain w-full h-[188px]"
+            />
+          )}
+        </div>
       </div>
     </section>
   );