update domain

.gitlab-ci.yml

@@ -11,12 +11,12 @@ build-dev:
     name: docker:25.0.3-cli
   services:
     - name: docker:25.0.3-dind
-      command: ["--insecure-registry=103.82.242.92:8900"]
+      command: ["--insecure-registry=38.47.185.86:8900"]
   script:
     - docker logout
-    - docker login -u $DEPLOY_USERNAME -p $DEPLOY_TOKEN 103.82.242.92:8900
+    - docker login -u $DEPLOY_USERNAME -p $DEPLOY_TOKEN 38.47.185.86:8900
-    - docker build -t 103.82.242.92:8900/medols/web-milenial-bersuara:dev .
+    - docker build -t 38.47.185.86:8900/medols/web-milenial-bersuara:dev .
-    - docker push 103.82.242.92:8900/medols/web-milenial-bersuara:dev
+    - docker push 38.47.185.86:8900/medols/web-milenial-bersuara:dev
 
 auto-deploy:
   stage: deploy
@@ -27,4 +27,4 @@ auto-deploy:
   services:
     - docker:dind
   script:
-    - curl --user admin:$JENKINS_PWD http://38.47.180.165:8080/job/auto-deploy-milenial-bersuara/build?token=autodeploymedols
+    - curl --user admin:$JENKINS_PWD http://38.47.185.86:8080/job/auto-deploy-milenial-bersuara/build?token=autodeploymedols

components/details/details-content.tsx

@@ -21,6 +21,7 @@ import {
 import { useForm } from "react-hook-form";
 import { saveActivity } from "@/service/activity-log";
 import { Badge } from "../ui/badge";
+import { formatTextToHtmlTag } from "@/utils/global";
 
 type TabKey = "trending" | "comments" | "latest";
 
@@ -82,7 +83,7 @@ export default function DetailContent() {
   const [diseId, setDiseId] = useState(0);
   const [thumbnailImg, setThumbnailImg] = useState<File[]>([]);
   const [selectedMainImage, setSelectedMainImage] = useState<number | null>(
-    null
+    null,
   );
   const [selectedIndex, setSelectedIndex] = useState(0);
 
@@ -279,21 +280,14 @@ export default function DetailContent() {
     );
   }
 
-  function decodeHtmlString(raw: string = "") {
+  function removeImgTags(htmlString?: { __html: string }) {
-    if (!raw) return "";
+    const parser = new DOMParser();
+    const doc = parser.parseFromString(String(htmlString?.__html), "text/html");
 
-    // 1️⃣ Hapus newline escape, backslash, dsb
+    const images = doc.querySelectorAll("img");
-    let decoded = raw
+    images.forEach((img) => img.remove());
-      .replace(/\\n/g, "\n")
-      .replace(/\\"/g, '"') // ubah \" jadi "
-      .replace(/\\'/g, "'") // ubah \' jadi '
-      .replace(/\\\\/g, "\\") // ubah \\ jadi \
-      .trim();
 
-    // 2️⃣ Decode entity HTML (misal &quot;)
+    return { __html: doc.body.innerHTML };
-    const el = document.createElement("textarea");
-    el.innerHTML = decoded;
-    return el.value;
   }
 
   return (
@@ -332,17 +326,22 @@ export default function DetailContent() {
               </span>
               <span>-</span>
               <span>
-                <span>
+                {new Date(
-                  {new Date(articleDetail?.publishedAt).toLocaleDateString(
+                  articleDetail?.publishedAt ?? articleDetail?.createdAt,
-                    "id-ID",
+                )
-                    {
+                  .toLocaleString("id-ID", {
-                      day: "numeric",
+                    day: "numeric",
-                      month: "long",
+                    month: "long",
-                      year: "numeric",
+                    year: "numeric",
-                    }
+                    hour: "2-digit",
-                  )}
+                    minute: "2-digit",
-                </span>
+                    hour12: false,
+                    timeZone: "Asia/Jakarta",
+                  })
+                  .replace("pukul ", "")}{" "}
+                WIB
               </span>
+
               <span className="text-gray-500">in</span>
               <span>{articleDetail?.categories?.[0]?.title}</span>
             </div>
@@ -504,15 +503,11 @@ export default function DetailContent() {
           <div className="flex relative">
             <div className="flex-1 overflow-y-auto">
               <p className="text-gray-700 leading-relaxed text-justify">
-                {/* <span className="text-black font-bold text-md">
-                  Mikulnews.com -
-                </span> */}
                 <div
-                  dangerouslySetInnerHTML={{
+                  dangerouslySetInnerHTML={removeImgTags(
-                    __html: decodeHtmlString(
+                    formatTextToHtmlTag(articleDetail?.htmlDescription),
-                      articleDetail?.htmlDescription || ""
+                  )}
-                    ),
+                  className="text-sm lg:text-xl lg:leading-8 text-justify space-y-4"
-                  }}
                 />
               </p>
               <div className="w-full bg-white   py-6">
@@ -766,7 +761,7 @@ export default function DetailContent() {
                                 day: "2-digit",
                                 month: "long",
                                 year: "numeric",
-                              }
+                              },
                             )}
                           </span>
                           <span>💬 0</span>

components/editor/custom-editor.js

@@ -1,40 +1,78 @@
-// components/custom-editor.js
+import React, { useCallback, useEffect, useRef, useState } from "react";
-
-import React from "react";
 import { CKEditor } from "@ckeditor/ckeditor5-react";
+
+import "@/styles/custom-editor.css";
 import Editor from "@/vendor/ckeditor5/build/ckeditor";
 
 function CustomEditor(props) {
+  const maxHeight = props.maxHeight || 600;
+
   return (
-    <CKEditor
+    <div className="ckeditor-wrapper">
-      editor={Editor}
+      <CKEditor
-      data={props.initialData}
+        editor={Editor}
-      onChange={(event, editor) => {
+        data={props.initialData}
-        const data = editor.getData();
+        onChange={(event, editor) => {
-        console.log({ event, editor, data });
+          const data = editor.getData();
-        props.onChange(data);
+          console.log({ event, editor, data });
-      }}
+          props.onChange(data);
-      config={{
+        }}
-        toolbar: [
+        config={{
-          "heading",
+          toolbar: [
-          "fontsize",
+            "heading",
-          "bold",
+            "fontsize",
-          "italic",
+            "bold",
-          "link",
+            "italic",
-          "numberedList",
+            "link",
-          "bulletedList",
+            "numberedList",
-          "undo",
+            "bulletedList",
-          "redo",
+            "undo",
-          "alignment",
+            "redo",
-          "outdent",
+            "alignment",
-          "indent",
+            "outdent",
-          "blockQuote",
+            "indent",
-          "insertTable",
+            "blockQuote",
-          "codeBlock",
+            "insertTable",
-          "sourceEditing",
+            "codeBlock",
-        ],
+            "sourceEditing",
-      }}
+          ],
-    />
+          content_style: `
+            body {
+              font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+              font-size: 14px;
+              line-height: 1.6;
+              color: #111 !important; 
+              background: #fff !important;
+              margin: 0;
+              padding: 1rem;
+            }
+            p {
+              margin: 0.5em 0 !important;
+            }
+            h1, h2, h3, h4, h5, h6 {
+              margin: 1em 0 0.5em 0;
+              color: inherit !important;
+            }
+            ul, ol {
+              margin: 0.5em 0;
+              padding-left: 2em;
+            }
+            blockquote {
+              margin: 1em 0;
+              padding: 0.5em 1em;
+              border-left: 4px solid #d1d5db;
+              background-color: #f9fafb;
+              color: inherit !important;
+            }
+          `,
+          height: props.height || 400,
+          removePlugins: ["Title"],
+          mobile: {
+            theme: "silver",
+          },
+        }}
+      />
+    </div>
   );
 }
 

components/editor/view-editor.js

@@ -3,17 +3,262 @@ import { CKEditor } from "@ckeditor/ckeditor5-react";
 import Editor from "@/vendor/ckeditor5/build/ckeditor";
 
 function ViewEditor(props) {
+  const maxHeight = props.maxHeight || 600; // Default max height 600px
+
   return (
-    <CKEditor
+    <div className="ckeditor-view-wrapper">
-      editor={Editor}
+      <CKEditor
-      data={props.initialData}
+        editor={Editor}
-      disabled={true}
+        data={props.initialData}
-      config={{
+        disabled={true}
-        // toolbar: [],
+        config={{
-        isReadOnly: true,
+          isReadOnly: true,
-      }}
+          content_style: `
-    />
+            body {
+              font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+              font-size: 14px;
+              line-height: 1.6;
+              color: #111;
+              background: #fff;
+              margin: 0;
+              padding: 0;
+            }
+            p {
+              margin: 0.5em 0;
+            }
+            h1, h2, h3, h4, h5, h6 {
+              margin: 1em 0 0.5em 0;
+            }
+            ul, ol {
+              margin: 0.5em 0;
+              padding-left: 2em;
+            }
+            blockquote {
+              margin: 1em 0;
+              padding: 0.5em 1em;
+              border-left: 4px solid #d1d5db;
+              background-color: #f9fafb;
+            }
+          `,
+          height: props.height || 400,
+          removePlugins: ["Title"],
+        }}
+      />
+      <style jsx>{`
+        .ckeditor-view-wrapper {
+          border-radius: 6px;
+          overflow: hidden;
+          box-shadow:
+            0 1px 3px 0 rgba(0, 0, 0, 0.1),
+            0 1px 2px 0 rgba(0, 0, 0, 0.06);
+        }
+
+        .ckeditor-view-wrapper :global(.ck.ck-editor__main) {
+          min-height: ${props.height || 400}px;
+          max-height: ${maxHeight}px;
+        }
+
+        .ckeditor-view-wrapper :global(.ck.ck-editor__editable) {
+          min-height: ${(props.height || 400) - 50}px;
+          max-height: ${maxHeight - 50}px;
+          overflow-y: auto !important;
+          scrollbar-width: thin;
+          scrollbar-color: #cbd5e1 #f1f5f9;
+          background-color: #fdfdfd;
+          border: 1px solid #d1d5db;
+          border-radius: 6px;
+          color: #111;
+        }
+
+        /* 🌙 Dark mode support */
+        :global(.dark) .ckeditor-view-wrapper :global(.ck.ck-editor__editable) {
+          background-color: #111 !important;
+          color: #f9fafb !important;
+          border-color: #374151;
+        }
+
+        :global(.dark) .ckeditor-view-wrapper h1,
+        :global(.dark) .ckeditor-view-wrapper h2,
+        :global(.dark) .ckeditor-view-wrapper h3,
+        :global(.dark) .ckeditor-view-wrapper h4,
+        :global(.dark) .ckeditor-view-wrapper h5,
+        :global(.dark) .ckeditor-view-wrapper h6 {
+          color: #f9fafb !important;
+        }
+
+        :global(.dark) .ckeditor-view-wrapper blockquote {
+          background-color: #1f2937 !important;
+          border-left: 4px solid #374151 !important;
+          color: #f3f4f6 !important;
+        }
+
+        /* Custom scrollbar styling */
+        .ckeditor-view-wrapper
+          :global(.ck.ck-editor__editable::-webkit-scrollbar) {
+          width: 8px;
+        }
+
+        .ckeditor-view-wrapper
+          :global(.ck.ck-editor__editable::-webkit-scrollbar-track) {
+          background: #f1f5f9;
+          border-radius: 4px;
+        }
+
+        .ckeditor-view-wrapper
+          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb) {
+          background: #cbd5e1;
+          border-radius: 4px;
+        }
+
+        .ckeditor-view-wrapper
+          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb:hover) {
+          background: #94a3b8;
+        }
+
+        /* 🌙 Dark mode scrollbar */
+        :global(.dark)
+          .ckeditor-view-wrapper
+          :global(.ck.ck-editor__editable::-webkit-scrollbar-track) {
+          background: #1f2937;
+        }
+
+        :global(.dark)
+          .ckeditor-view-wrapper
+          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb) {
+          background: #4b5563;
+        }
+
+        :global(.dark)
+          .ckeditor-view-wrapper
+          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb:hover) {
+          background: #6b7280;
+        }
+
+        /* Read-only specific styling */
+        .ckeditor-view-wrapper :global(.ck.ck-editor__editable.ck-read-only) {
+          cursor: default;
+        }
+
+        /* Hide toolbar */
+        .ckeditor-view-wrapper :global(.ck.ck-toolbar) {
+          display: none !important;
+        }
+      `}</style>
+    </div>
   );
 }
 
 export default ViewEditor;
+
+// import React from "react";
+// import { CKEditor } from "@ckeditor/ckeditor5-react";
+// import Editor from "ckeditor5-custom-build";
+
+// function ViewEditor(props) {
+//   const maxHeight = props.maxHeight || 600;
+
+//   return (
+//     <div className="ckeditor-view-wrapper">
+//       <CKEditor
+//         editor={Editor}
+//         data={props.initialData}
+//         disabled={true}
+//         config={{
+//           // toolbar: [],
+//           isReadOnly: true,
+//           // Add content styling configuration for read-only mode
+//           content_style: `
+//             body {
+//               font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+//               font-size: 14px;
+//               line-height: 1.6;
+//               color: #333;
+//               margin: 0;
+//               padding: 0;
+//             }
+//             p {
+//               margin: 0.5em 0;
+//             }
+//             h1, h2, h3, h4, h5, h6 {
+//               margin: 1em 0 0.5em 0;
+//             }
+//             ul, ol {
+//               margin: 0.5em 0;
+//               padding-left: 2em;
+//             }
+//             blockquote {
+//               margin: 1em 0;
+//               padding: 0.5em 1em;
+//               border-left: 4px solid #d1d5db;
+//               background-color: #f9fafb;
+//             }
+//           `,
+//           // Editor appearance settings
+//           height: props.height || 400,
+//           removePlugins: ['Title'],
+//         }}
+//       />
+//       <style jsx>{`
+//         .ckeditor-view-wrapper {
+//           border-radius: 6px;
+//           overflow: hidden;
+//           box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+//         }
+
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__main) {
+//           min-height: ${props.height || 400}px;
+//           max-height: ${maxHeight}px;
+//         }
+
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__editable) {
+//           min-height: ${(props.height || 400) - 50}px;
+//           max-height: ${maxHeight - 50}px;
+//           overflow-y: auto !important;
+//           scrollbar-width: thin;
+//           scrollbar-color: #cbd5e1 #f1f5f9;
+//           background-color:rgb(253, 253, 253);
+//           border: 1px solid #d1d5db;
+//           border-radius: 6px;
+//         }
+
+//         /* Custom scrollbar styling for webkit browsers */
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__editable::-webkit-scrollbar) {
+//           width: 8px;
+//         }
+
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__editable::-webkit-scrollbar-track) {
+//           background: #f1f5f9;
+//           border-radius: 4px;
+//         }
+
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb) {
+//           background: #cbd5e1;
+//           border-radius: 4px;
+//         }
+
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb:hover) {
+//           background: #94a3b8;
+//         }
+
+//         /* Ensure content doesn't overflow */
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__editable .ck-content) {
+//           overflow: hidden;
+//         }
+
+//         /* Read-only specific styling */
+//         .ckeditor-view-wrapper :global(.ck.ck-editor__editable.ck-read-only) {
+//           background-color: #f8fafc;
+//           color: #4b5563;
+//           cursor: default;
+//         }
+
+//         /* Hide toolbar for view-only mode */
+//         .ckeditor-view-wrapper :global(.ck.ck-toolbar) {
+//           display: none !important;
+//         }
+//       `}</style>
+//     </div>
+//   );
+// }
+
+// export default ViewEditor;

components/landing-page/footer.tsx

@@ -1,173 +1,67 @@
-"use client";
+// components/Footer.tsx
 import Image from "next/image";
+import { Facebook, Twitter, Instagram, Youtube } from "lucide-react";
 import Link from "next/link";
-import { CalendarDays } from "lucide-react";
-
-const categories = [
-  "Destination",
-  "Food & Drink",
-  "News",
-  "Photo",
-  "Tak Berkategori",
-  "Travel Ideas",
-  "Video",
-];
-
-const tags = [
-  "AI",
-  "arus balik",
-  "arus mudik",
-  "Backpacker",
-  "Budi Zulkifli",
-  "drama Korea",
-  "Food",
-  "Indonesia",
-  "Jin BTS",
-  "jurnalis",
-  "Kakorlantas",
-  "konser",
-  "Korea Utara",
-  "Lebaran 2025",
-  "Media Hub",
-  "mudik",
-  "musik AI",
-  "Piala Usia U-17 2025",
-  "Polri",
-  "Resident Playbook",
-  "The Astronaut",
-  "Tips",
-  "Tol Cipali",
-  "Tol Japek",
-  "Trip Plan",
-];
-
-const recentNews = [
-  {
-    id: 1,
-    title:
-      "Jin BTS Jadi Special Guest Konser Coldplay di Korea, Bawakan Lagu My Universe dan The Astronaut",
-    date: "21 APRIL 2025",
-    image: "/coldplay.png",
-  },
-  {
-    id: 2,
-    title:
-      "Kehadiran Media Hub Polri Jadi Jawaban atas Kebutuhan Jurnalis Masa Kini",
-    date: "16 APRIL 2025",
-    image: "/mediahub-1.jpg",
-  },
-];
 
 export default function Footer() {
   return (
-    <footer className="bg-[#293132] text-gray-300 text-sm">
+    <footer className="bg-[#ECEFF5] pt-20 pb-10 w-full">
-      <div className="max-w-7xl mx-auto px-6 py-12 grid grid-cols-1 md:grid-cols-4 gap-8">
+      <div className="max-w-screen-xl mx-auto px-6 grid grid-cols-1 md:grid-cols-2 ">
-        {/* Logo & About */}
+        {/* Logo */}
-        <div>
+        <div className="flex justify-center md:justify-end">
-          <h2 className="text-2xl font-bold">
+          <Image
-            <span className="text-white">travel</span>
+            src="/milenial-logo.png"
-            <span className="text-teal-400">news</span>
+            alt="Logo"
-          </h2>
+            width={230}
-          <p className="mt-3 text-gray-400 leading-relaxed">
+            height={230}
-            We bring you the best Premium WordPress Themes that perfect for
+            className="object-contain"
-            news, magazine, personal blog, etc.
+          />
-          </p>
-          <Link
-            href="#"
-            className="mt-3 inline-block text-teal-400 hover:underline"
-          >
-            Read more
-          </Link>
         </div>
 
-        {/* Categories */}
+        {/* Subscribe Box */}
-        <div>
+        <div className="flex justify-end md:justify-end  pl-5">
-          <h3 className="text-white font-semibold mb-3">Categories</h3>
+          <div className=" w-full ml-5">
-          <ul className="space-y-2">
+            <h2 className="text-2xl font-semibold text-gray-800 leading-snug">
-            {categories.map((cat, i) => (
+              Subscribe us to get <br />
-              <li key={i}>
+              the latest news!
-                <Link href="#" className="hover:text-teal-400">
+            </h2>
-                  {cat}
-                </Link>
-              </li>
-            ))}
-          </ul>
-        </div>
 
-        {/* Tags */}
+            <label className="block mt-6 mb-1 text-sm text-gray-600">
-        <div>
+              Email address:
-          <h3 className="text-white font-semibold mb-3">Tags</h3>
+            </label>
-          <div className="flex flex-wrap gap-2">
+
-            {tags.map((tag, i) => (
+            <input
-              <span
+              type="email"
-                key={i}
+              placeholder="Your email address"
-                className="bg-gray-700 hover:bg-teal-500 hover:text-white text-gray-300 text-xs px-2 py-1 rounded cursor-pointer"
+              className="w-full border border-gray-300 rounded-md px-4 py-3 outline-none"
-              >
+            />
-                {tag}
+
-              </span>
+            <button className="mt-4 bg-green-600 hover:bg-green-500 text-black px-6 py-3 rounded-md font-medium">
-            ))}
+              SIGN UP
+            </button>
           </div>
         </div>
-
-        {/* Recent News */}
-        <div>
-          <h3 className="text-white font-semibold mb-3">Recent News</h3>
-          <ul className="space-y-4">
-            {recentNews.map((news) => (
-              <li key={news.id} className="flex gap-3">
-                <Image
-                  src={news.image}
-                  alt={news.title}
-                  width={80}
-                  height={60}
-                  className="object-cover rounded"
-                />
-                <div>
-                  <Link
-                    href="#"
-                    className="text-gray-200 font-medium hover:text-teal-400 text-sm leading-snug"
-                  >
-                    {news.title}
-                  </Link>
-                  <div className="flex items-center text-xs text-gray-400 gap-1 mt-1">
-                    <CalendarDays size={12} />
-                    {news.date}
-                  </div>
-                </div>
-              </li>
-            ))}
-          </ul>
-        </div>
       </div>
 
-      {/* Bottom Bar */}
+      <div className="flex flex-wrap justify-center gap-8 mt-16 text-gray-600 text-sm">
-      <div className="border-t bg-[#474044] border-gray-700 py-4 px-6 flex flex-col md:flex-row items-center justify-between text-xs text-gray-400">
+        <a href="#">About Us</a>
-        <p>
+        <a href="#">Contact</a>
-          © 2025 <span className="text-teal-400">JNews</span> - Premium
+        <a href="#">Kode Etik Jurnalistik</a>
-          WordPress news & magazine theme by{" "}
+        <a href="#">Kebijakan Privasi</a>
-          <Link href="#" className="hover:underline">
+        <a href="#">Disclaimer</a>
-            Jegtheme
+        <a href="#">Pedoman Media Siber</a>
-          </Link>
-          .
-        </p>
-        <div className="flex gap-4 mt-2 md:mt-0">
-          <Link href="#">
-            <i className="fab fa-facebook"></i>
-          </Link>
-          <Link href="#">
-            <i className="fab fa-twitter"></i>
-          </Link>
-          <Link href="#">
-            <i className="fab fa-google-plus-g"></i>
-          </Link>
-          <Link href="#">
-            <i className="fab fa-pinterest"></i>
-          </Link>
-          <Link href="#">
-            <i className="fab fa-rss"></i>
-          </Link>
-        </div>
       </div>
+
+      <div className="flex justify-center gap-8 mt-8 text-gray-700">
+        <Facebook className="w-5 h-5 cursor-pointer" />
+        <Twitter className="w-5 h-5 cursor-pointer" />
+        <Instagram className="w-5 h-5 cursor-pointer" />
+        <Youtube className="w-5 h-5 cursor-pointer" />
+      </div>
+
+      <p className="text-start text-gray-500 text-sm mt-8 pl-5">
+        © 2025 Milenial Bersuara - All Rights Reserved.
+      </p>
     </footer>
   );
 }

components/landing-page/navbar.tsx

@@ -11,10 +11,12 @@ export default function Navbar() {
         {/* Left: Logo */}
         <div className="flex flex-row justify-between mb-3">
           <div className="flex items-center">
-            <Link href="/" className="text-2xl font-bold">
+            <Image
-              <span className="text-gray-900">travel</span>
+              src="/milenial-logo.png"
-              <span className="text-teal-400">news</span>
+              alt="Kritik Tajam Logo"
-            </Link>
+              width={140}
+              height={100}
+            />
           </div>
           <div className="flex items-center gap-6">
             {/* Social Icons */}

components/table/article-table.tsx

@@ -316,7 +316,7 @@ export default function ArticleTable() {
           return cellValue;
       }
     },
-    [article, page]
+    [article, page],
   );
 
   let typingTimer: NodeJS.Timeout;
@@ -445,8 +445,8 @@ export default function ArticleTable() {
             </div>
           </div>
           <div className="w-full overflow-x-hidden">
-            <div className="w-full mx-auto overflow-x-hidden">
+            <div className="w-full overflow-x-auto">
-              <Table className="w-full table-fixed border text-sm">
+              <Table className="min-w-[1000px] w-full table-auto border text-sm">
                 <TableHeader>
                   <TableRow>
                     {(username === "admin-mabes"
@@ -455,7 +455,18 @@ export default function ArticleTable() {
                     ).map((column) => (
                       <TableHead
                         key={column.uid}
-                        className="truncate bg-white dark:bg-black text-black dark:text-white border-b text-md"
+                        className={`bg-white dark:bg-black text-black dark:text-white 
+    text-sm font-semibold border-b px-3 py-3
+    ${
+      column.uid === "no"
+        ? "min-w-[60px] text-center"
+        : column.uid === "title"
+          ? "min-w-[280px]"
+          : column.uid === "actions"
+            ? "min-w-[100px] text-center"
+            : "min-w-[160px]"
+    }
+  `}
                       >
                         {column.name}
                       </TableHead>
@@ -472,7 +483,17 @@ export default function ArticleTable() {
                         ).map((column) => (
                           <TableCell
                             key={column.uid}
-                            className="truncate text-black dark:text-white max-w-[200px]"
+                            className={`text-black dark:text-white text-sm px-3 py-3 align-top
+    ${
+      column.uid === "no"
+        ? "min-w-[60px] text-center font-medium"
+        : column.uid === "title"
+          ? "min-w-[280px] whitespace-normal break-words leading-snug"
+          : column.uid === "actions"
+            ? "min-w-[100px] text-center"
+            : "min-w-[160px] whitespace-normal break-words"
+    }
+  `}
                           >
                             {renderCell(item, column.uid)}
                           </TableCell>

next.config.ts

@@ -1,13 +1,11 @@
-import type { NextConfig } from "next";
+/** @type {import('next').NextConfig} */
-
+const nextConfig = {
-const nextConfig: NextConfig = {
   images: {
-    domains: ["mikulnews.com", "dev.mikulnews.com"],
+    domains: ["mikulnews.com", "dev.mikulnews.com", "dev.milenialbersuara.com"],
   },
   eslint: {
     ignoreDuringBuilds: true,
   },
-  // Add experimental features for better chunk handling
   experimental: {
     optimizePackageImports: ["@ckeditor/ckeditor5-react", "react-apexcharts"],
   },

package-lock.json

@@ -34,12 +34,12 @@
         "framer-motion": "^12.23.12",
         "js-cookie": "^3.0.5",
         "lucide-react": "^0.542.0",
-        "next": "15.5.2",
+        "next": "^16.1.1",
-        "react": "19.1.0",
+        "react": "^19.2.3",
         "react-apexcharts": "^1.7.0",
         "react-datepicker": "^8.7.0",
         "react-day-picker": "^9.9.0",
-        "react-dom": "19.1.0",
+        "react-dom": "^19.2.4",
         "react-dropzone": "^14.3.8",
         "react-hook-form": "^7.59.0",
         "react-password-checklist": "^1.8.1",
@@ -1257,10 +1257,19 @@
       "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
       "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg=="
     },
+    "node_modules/@img/colour": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@img/colour/-/colour-1.0.0.tgz",
+      "integrity": "sha512-A5P/LfWGFSl6nsckYtjw9da+19jB8hkJ6ACTGcDfEJ0aE+l2n2El7dsVM7UVHZQ9s2lmYMWlrS21YLy2IR1LUw==",
+      "optional": true,
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/@img/sharp-win32-x64": {
-      "version": "0.34.3",
+      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.34.3.tgz",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.34.5.tgz",
-      "integrity": "sha512-OWwz05d++TxzLEv4VnsTz5CmZ6mI6S05sfQGEMrNrQcOEERbX46332IvE7pO/EUiw7jUrrS40z/M7kPyjfl04g==",
+      "integrity": "sha512-+29YMsqY2/9eFEiW93eqWnuLcWcufowXewwSNIT6UwZdUUCrM3oFjMWH/Z6/TMmb4hlFenmfAVbpWeup2jryCw==",
       "cpu": [
         "x64"
       ],
@@ -1329,119 +1338,14 @@
       }
     },
     "node_modules/@next/env": {
-      "version": "15.5.2",
+      "version": "16.1.1",
-      "resolved": "https://registry.npmjs.org/@next/env/-/env-15.5.2.tgz",
+      "resolved": "https://registry.npmjs.org/@next/env/-/env-16.1.1.tgz",
-      "integrity": "sha512-Qe06ew4zt12LeO6N7j8/nULSOe3fMXE4dM6xgpBQNvdzyK1sv5y4oAP3bq4LamrvGCZtmRYnW8URFCeX5nFgGg=="
+      "integrity": "sha512-3oxyM97Sr2PqiVyMyrZUtrtM3jqqFxOQJVuKclDsgj/L728iZt/GyslkN4NwarledZATCenbk4Offjk1hQmaAA=="
-    },
-    "node_modules/@next/swc-darwin-arm64": {
-      "version": "15.5.2",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-15.5.2.tgz",
-      "integrity": "sha512-8bGt577BXGSd4iqFygmzIfTYizHb0LGWqH+qgIF/2EDxS5JsSdERJKA8WgwDyNBZgTIIA4D8qUtoQHmxIIquoQ==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@next/swc-darwin-x64": {
-      "version": "15.5.2",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-15.5.2.tgz",
-      "integrity": "sha512-2DjnmR6JHK4X+dgTXt5/sOCu/7yPtqpYt8s8hLkHFK3MGkka2snTv3yRMdHvuRtJVkPwCGsvBSwmoQCHatauFQ==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@next/swc-linux-arm64-gnu": {
-      "version": "15.5.2",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-15.5.2.tgz",
-      "integrity": "sha512-3j7SWDBS2Wov/L9q0mFJtEvQ5miIqfO4l7d2m9Mo06ddsgUK8gWfHGgbjdFlCp2Ek7MmMQZSxpGFqcC8zGh2AA==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@next/swc-linux-arm64-musl": {
-      "version": "15.5.2",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-15.5.2.tgz",
-      "integrity": "sha512-s6N8k8dF9YGc5T01UPQ08yxsK6fUow5gG1/axWc1HVVBYQBgOjca4oUZF7s4p+kwhkB1bDSGR8QznWrFZ/Rt5g==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@next/swc-linux-x64-gnu": {
-      "version": "15.5.2",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-15.5.2.tgz",
-      "integrity": "sha512-o1RV/KOODQh6dM6ZRJGZbc+MOAHww33Vbs5JC9Mp1gDk8cpEO+cYC/l7rweiEalkSm5/1WGa4zY7xrNwObN4+Q==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@next/swc-linux-x64-musl": {
-      "version": "15.5.2",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-15.5.2.tgz",
-      "integrity": "sha512-/VUnh7w8RElYZ0IV83nUcP/J4KJ6LLYliiBIri3p3aW2giF+PAVgZb6mk8jbQSB3WlTai8gEmCAr7kptFa1H6g==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@next/swc-win32-arm64-msvc": {
-      "version": "15.5.2",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-15.5.2.tgz",
-      "integrity": "sha512-sMPyTvRcNKXseNQ/7qRfVRLa0VhR0esmQ29DD6pqvG71+JdVnESJaHPA8t7bc67KD5spP3+DOCNLhqlEI2ZgQg==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
     },
     "node_modules/@next/swc-win32-x64-msvc": {
-      "version": "15.5.2",
+      "version": "16.1.1",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.5.2.tgz",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.1.1.tgz",
-      "integrity": "sha512-W5VvyZHnxG/2ukhZF/9Ikdra5fdNftxI6ybeVKYvBPDtyx7x4jPPSNduUkfH5fo3zG0JQ0bPxgy41af2JX5D4Q==",
+      "integrity": "sha512-Ncwbw2WJ57Al5OX0k4chM68DKhEPlrXBaSXDCi2kPi5f4d8b3ejr3RRJGfKBLrn2YJL5ezNS7w2TZLHSti8CMw==",
       "cpu": [
         "x64"
       ],
@@ -2626,6 +2530,14 @@
         "url": "https://github.com/sponsors/wooorm"
       }
     },
+    "node_modules/baseline-browser-mapping": {
+      "version": "2.9.11",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.9.11.tgz",
+      "integrity": "sha512-Sg0xJUNDU1sJNGdfGWhVHX0kkZ+HWcvmVymJbj6NSgZZmW/8S9Y2HQ5euytnIgakgxN6papOAWiwDo1ctFDcoQ==",
+      "bin": {
+        "baseline-browser-mapping": "dist/cli.js"
+      }
+    },
     "node_modules/blurhash": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/blurhash/-/blurhash-2.0.5.tgz",
@@ -2807,37 +2719,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/color": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
-      "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
-      "optional": true,
-      "dependencies": {
-        "color-convert": "^2.0.1",
-        "color-string": "^1.9.0"
-      },
-      "engines": {
-        "node": ">=12.5.0"
-      }
-    },
-    "node_modules/color-convert": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "optional": true,
-      "dependencies": {
-        "color-name": "~1.1.4"
-      },
-      "engines": {
-        "node": ">=7.0.0"
-      }
-    },
-    "node_modules/color-name": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "optional": true
-    },
     "node_modules/color-parse": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/color-parse/-/color-parse-2.0.2.tgz",
@@ -2854,16 +2735,6 @@
         "node": ">=12.20"
       }
     },
-    "node_modules/color-string": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz",
-      "integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==",
-      "optional": true,
-      "dependencies": {
-        "color-name": "^1.0.0",
-        "simple-swizzle": "^0.2.2"
-      }
-    },
     "node_modules/combined-stream": {
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@@ -2968,9 +2839,9 @@
       }
     },
     "node_modules/detect-libc": {
-      "version": "2.0.4",
+      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
-      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+      "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
       "devOptional": true,
       "engines": {
         "node": ">=8"
@@ -3543,12 +3414,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/is-arrayish": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
-      "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==",
-      "optional": true
-    },
     "node_modules/is-core-module": {
       "version": "2.16.1",
       "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
@@ -4561,12 +4426,13 @@
       }
     },
     "node_modules/next": {
-      "version": "15.5.2",
+      "version": "16.1.1",
-      "resolved": "https://registry.npmjs.org/next/-/next-15.5.2.tgz",
+      "resolved": "https://registry.npmjs.org/next/-/next-16.1.1.tgz",
-      "integrity": "sha512-H8Otr7abj1glFhbGnvUt3gz++0AF1+QoCXEBmd/6aKbfdFwrn0LpA836Ed5+00va/7HQSDD+mOoVhn3tNy3e/Q==",
+      "integrity": "sha512-QI+T7xrxt1pF6SQ/JYFz95ro/mg/1Znk5vBebsWwbpejj1T0A23hO7GYEaVac9QUOT2BIMiuzm0L99ooq7k0/w==",
       "dependencies": {
-        "@next/env": "15.5.2",
+        "@next/env": "16.1.1",
         "@swc/helpers": "0.5.15",
+        "baseline-browser-mapping": "^2.8.3",
         "caniuse-lite": "^1.0.30001579",
         "postcss": "8.4.31",
         "styled-jsx": "5.1.6"
@@ -4575,18 +4441,18 @@
         "next": "dist/bin/next"
       },
       "engines": {
-        "node": "^18.18.0 || ^19.8.0 || >= 20.0.0"
+        "node": ">=20.9.0"
       },
       "optionalDependencies": {
-        "@next/swc-darwin-arm64": "15.5.2",
+        "@next/swc-darwin-arm64": "16.1.1",
-        "@next/swc-darwin-x64": "15.5.2",
+        "@next/swc-darwin-x64": "16.1.1",
-        "@next/swc-linux-arm64-gnu": "15.5.2",
+        "@next/swc-linux-arm64-gnu": "16.1.1",
-        "@next/swc-linux-arm64-musl": "15.5.2",
+        "@next/swc-linux-arm64-musl": "16.1.1",
-        "@next/swc-linux-x64-gnu": "15.5.2",
+        "@next/swc-linux-x64-gnu": "16.1.1",
-        "@next/swc-linux-x64-musl": "15.5.2",
+        "@next/swc-linux-x64-musl": "16.1.1",
-        "@next/swc-win32-arm64-msvc": "15.5.2",
+        "@next/swc-win32-arm64-msvc": "16.1.1",
-        "@next/swc-win32-x64-msvc": "15.5.2",
+        "@next/swc-win32-x64-msvc": "16.1.1",
-        "sharp": "^0.34.3"
+        "sharp": "^0.34.4"
       },
       "peerDependencies": {
         "@opentelemetry/api": "^1.1.0",
@@ -4745,9 +4611,9 @@
       "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
     },
     "node_modules/react": {
-      "version": "19.1.0",
+      "version": "19.2.4",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
-      "integrity": "sha512-FS+XFBNvn3GTAWq26joslQgWNoFu08F4kl0J4CgdNKADkdSGXQyTCnKteIAJy96Br6YbpEU1LSzV5dYtjMkMDg==",
+      "integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4799,14 +4665,14 @@
       }
     },
     "node_modules/react-dom": {
-      "version": "19.1.0",
+      "version": "19.2.4",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.4.tgz",
-      "integrity": "sha512-Xs1hdnE+DyKgeHJeJznQmYMIBG3TKIHJJT95Q58nHLSrElKlGQqDTR2HQ9fx5CN/Gk6Vh/kupBTDLU11/nDk/g==",
+      "integrity": "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==",
       "dependencies": {
-        "scheduler": "^0.26.0"
+        "scheduler": "^0.27.0"
       },
       "peerDependencies": {
-        "react": "^19.1.0"
+        "react": "^19.2.4"
       }
     },
     "node_modules/react-dropzone": {
@@ -5107,14 +4973,14 @@
       }
     },
     "node_modules/scheduler": {
-      "version": "0.26.0",
+      "version": "0.27.0",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.26.0.tgz",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
-      "integrity": "sha512-NlHwttCI/l5gCPR3D1nNXtWABUmBwvZpEQiD4IXSbIDq8BzLIK/7Ir5gTFSGZDUu37K5cMNp0hFtzO38sC7gWA=="
+      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q=="
     },
     "node_modules/semver": {
-      "version": "7.7.2",
+      "version": "7.7.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.3.tgz",
-      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
+      "integrity": "sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q==",
       "optional": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -5124,15 +4990,15 @@
       }
     },
     "node_modules/sharp": {
-      "version": "0.34.3",
+      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.34.3.tgz",
+      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.34.5.tgz",
-      "integrity": "sha512-eX2IQ6nFohW4DbvHIOLRB3MHFpYqaqvXd3Tp5e/T/dSH83fxaNJQRvDMhASmkNTsNTVF2/OOopzRCt7xokgPfg==",
+      "integrity": "sha512-Ou9I5Ft9WNcCbXrU9cMgPBcCK8LiwLqcbywW3t4oDV37n1pzpuNLsYiAV8eODnjbtQlSDwZ2cUEeQz4E54Hltg==",
       "hasInstallScript": true,
       "optional": true,
       "dependencies": {
-        "color": "^4.2.3",
+        "@img/colour": "^1.0.0",
-        "detect-libc": "^2.0.4",
+        "detect-libc": "^2.1.2",
-        "semver": "^7.7.2"
+        "semver": "^7.7.3"
       },
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
@@ -5141,37 +5007,30 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-darwin-arm64": "0.34.3",
+        "@img/sharp-darwin-arm64": "0.34.5",
-        "@img/sharp-darwin-x64": "0.34.3",
+        "@img/sharp-darwin-x64": "0.34.5",
-        "@img/sharp-libvips-darwin-arm64": "1.2.0",
+        "@img/sharp-libvips-darwin-arm64": "1.2.4",
-        "@img/sharp-libvips-darwin-x64": "1.2.0",
+        "@img/sharp-libvips-darwin-x64": "1.2.4",
-        "@img/sharp-libvips-linux-arm": "1.2.0",
+        "@img/sharp-libvips-linux-arm": "1.2.4",
-        "@img/sharp-libvips-linux-arm64": "1.2.0",
+        "@img/sharp-libvips-linux-arm64": "1.2.4",
-        "@img/sharp-libvips-linux-ppc64": "1.2.0",
+        "@img/sharp-libvips-linux-ppc64": "1.2.4",
-        "@img/sharp-libvips-linux-s390x": "1.2.0",
+        "@img/sharp-libvips-linux-riscv64": "1.2.4",
-        "@img/sharp-libvips-linux-x64": "1.2.0",
+        "@img/sharp-libvips-linux-s390x": "1.2.4",
-        "@img/sharp-libvips-linuxmusl-arm64": "1.2.0",
+        "@img/sharp-libvips-linux-x64": "1.2.4",
-        "@img/sharp-libvips-linuxmusl-x64": "1.2.0",
+        "@img/sharp-libvips-linuxmusl-arm64": "1.2.4",
-        "@img/sharp-linux-arm": "0.34.3",
+        "@img/sharp-libvips-linuxmusl-x64": "1.2.4",
-        "@img/sharp-linux-arm64": "0.34.3",
+        "@img/sharp-linux-arm": "0.34.5",
-        "@img/sharp-linux-ppc64": "0.34.3",
+        "@img/sharp-linux-arm64": "0.34.5",
-        "@img/sharp-linux-s390x": "0.34.3",
+        "@img/sharp-linux-ppc64": "0.34.5",
-        "@img/sharp-linux-x64": "0.34.3",
+        "@img/sharp-linux-riscv64": "0.34.5",
-        "@img/sharp-linuxmusl-arm64": "0.34.3",
+        "@img/sharp-linux-s390x": "0.34.5",
-        "@img/sharp-linuxmusl-x64": "0.34.3",
+        "@img/sharp-linux-x64": "0.34.5",
-        "@img/sharp-wasm32": "0.34.3",
+        "@img/sharp-linuxmusl-arm64": "0.34.5",
-        "@img/sharp-win32-arm64": "0.34.3",
+        "@img/sharp-linuxmusl-x64": "0.34.5",
-        "@img/sharp-win32-ia32": "0.34.3",
+        "@img/sharp-wasm32": "0.34.5",
-        "@img/sharp-win32-x64": "0.34.3"
+        "@img/sharp-win32-arm64": "0.34.5",
-      }
+        "@img/sharp-win32-ia32": "0.34.5",
-    },
+        "@img/sharp-win32-x64": "0.34.5"
-    "node_modules/simple-swizzle": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
-      "integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==",
-      "optional": true,
-      "dependencies": {
-        "is-arrayish": "^0.3.1"
       }
     },
     "node_modules/source-map": {
@@ -5600,6 +5459,111 @@
         "type": "github",
         "url": "https://github.com/sponsors/wooorm"
       }
+    },
+    "node_modules/@next/swc-darwin-arm64": {
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-16.1.1.tgz",
+      "integrity": "sha512-JS3m42ifsVSJjSTzh27nW+Igfha3NdBOFScr9C80hHGrWx55pTrVL23RJbqir7k7/15SKlrLHhh/MQzqBBYrQA==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-darwin-x64": {
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-16.1.1.tgz",
+      "integrity": "sha512-hbyKtrDGUkgkyQi1m1IyD3q4I/3m9ngr+V93z4oKHrPcmxwNL5iMWORvLSGAf2YujL+6HxgVvZuCYZfLfb4bGw==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-arm64-gnu": {
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-16.1.1.tgz",
+      "integrity": "sha512-/fvHet+EYckFvRLQ0jPHJCUI5/B56+2DpI1xDSvi80r/3Ez+Eaa2Yq4tJcRTaB1kqj/HrYKn8Yplm9bNoMJpwQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-arm64-musl": {
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-16.1.1.tgz",
+      "integrity": "sha512-MFHrgL4TXNQbBPzkKKur4Fb5ICEJa87HM7fczFs2+HWblM7mMLdco3dvyTI+QmLBU9xgns/EeeINSZD6Ar+oLg==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-x64-gnu": {
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-16.1.1.tgz",
+      "integrity": "sha512-20bYDfgOQAPUkkKBnyP9PTuHiJGM7HzNBbuqmD0jiFVZ0aOldz+VnJhbxzjcSabYsnNjMPsE0cyzEudpYxsrUQ==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-x64-musl": {
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-16.1.1.tgz",
+      "integrity": "sha512-9pRbK3M4asAHQRkwaXwu601oPZHghuSC8IXNENgbBSyImHv/zY4K5udBusgdHkvJ/Tcr96jJwQYOll0qU8+fPA==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-win32-arm64-msvc": {
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-16.1.1.tgz",
+      "integrity": "sha512-bdfQkggaLgnmYrFkSQfsHfOhk/mCYmjnrbRCGgkMcoOBZ4n+TRRSLmT/CU5SATzlBJ9TpioUyBW/vWFXTqQRiA==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
     }
   }
 }

package.json

@@ -34,12 +34,12 @@
     "framer-motion": "^12.23.12",
     "js-cookie": "^3.0.5",
     "lucide-react": "^0.542.0",
-    "next": "15.5.2",
+    "next": "^16.1.1",
-    "react": "19.1.0",
+    "react": "^19.2.3",
     "react-apexcharts": "^1.7.0",
     "react-datepicker": "^8.7.0",
     "react-day-picker": "^9.9.0",
-    "react-dom": "19.1.0",
+    "react-dom": "^19.2.4",
     "react-dropzone": "^14.3.8",
     "react-hook-form": "^7.59.0",
     "react-password-checklist": "^1.8.1",

service/http-config/axios-base-instance.ts

@@ -1,6 +1,6 @@
 import axios from "axios";
 
-const baseURL = "https://dev.mikulnews.com/api";
+const baseURL = "https://milenialbersuara.com/api";
 
 const axiosBaseInstance = axios.create({
   baseURL,

service/http-config/axios-interceptor-instance.ts

@@ -2,7 +2,7 @@ import axios from "axios";
 import { postSignIn } from "../master-user";
 import Cookies from "js-cookie";
 
-const baseURL = "https://dev.mikulnews.com/api";
+const baseURL = "https://milenialbersuara.com/api";
 
 const refreshToken = Cookies.get("refresh_token");
 
@@ -28,7 +28,7 @@ axiosInterceptorInstance.interceptors.request.use(
   },
   (error) => {
     return Promise.reject(error);
-  }
+  },
 );
 
 // Response interceptor
@@ -66,7 +66,7 @@ axiosInterceptorInstance.interceptors.response.use(
     }
 
     return Promise.reject(error);
-  }
+  },
 );
 
 export default axiosInterceptorInstance;

styles/custom-editor.css

@@ -0,0 +1,121 @@
+/* ========== CKEditor Wrapper ========== */
+.ckeditor-wrapper {
+  border-radius: 6px;
+  overflow: hidden;
+  box-shadow:
+    0 1px 3px 0 rgba(0, 0, 0, 0.1),
+    0 1px 2px 0 rgba(0, 0, 0, 0.06);
+}
+
+/* ========== Main Editor Container ========== */
+.ckeditor-wrapper .ck.ck-editor__main {
+  min-height: var(--editor-min-height, 400px);
+  max-height: var(--editor-max-height, 600px);
+}
+
+/* ========== Editable Content Area (ClassicEditor) ========== */
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline {
+  min-height: calc(var(--editor-min-height, 400px) - 50px);
+  max-height: calc(var(--editor-max-height, 600px) - 50px);
+  overflow-y: auto !important;
+  scrollbar-width: thin;
+  scrollbar-color: #cbd5e1 #f1f5f9;
+  background: #fff !important;
+  color: #111 !important;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  font-size: 14px;
+  line-height: 1.6;
+  padding: 1rem;
+  border: none !important;
+}
+
+/* ========== Headings and Text Formatting ========== */
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h1,
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h2,
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h3,
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h4,
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h5,
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h6 {
+  margin: 1em 0 0.5em 0;
+  color: inherit !important;
+}
+
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline p {
+  margin: 0.5em 0 !important;
+}
+
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline ul,
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline ol {
+  margin: 0.5em 0;
+  padding-left: 2em;
+}
+
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline blockquote {
+  margin: 1em 0;
+  padding: 0.5em 1em;
+  border-left: 4px solid #d1d5db;
+  background-color: #f9fafb;
+  color: inherit !important;
+}
+
+/* ========== Dark Mode Support ========== */
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline {
+  background: #111 !important;
+  color: #f9fafb !important;
+}
+
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h1,
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h2,
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h3,
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h4,
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h5,
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h6 {
+  color: #f9fafb !important;
+}
+
+.dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline blockquote {
+  background-color: #1f2937 !important;
+  border-left-color: #374151 !important;
+  color: #f3f4f6 !important;
+}
+
+/* ========== Custom Scrollbars (Light & Dark) ========== */
+.ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar {
+  width: 8px;
+}
+
+.ckeditor-wrapper
+  .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-track {
+  background: #f1f5f9;
+  border-radius: 4px;
+}
+
+.ckeditor-wrapper
+  .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb {
+  background: #cbd5e1;
+  border-radius: 4px;
+}
+
+.ckeditor-wrapper
+  .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb:hover {
+  background: #94a3b8;
+}
+
+.dark
+  .ckeditor-wrapper
+  .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-track {
+  background: #1f2937;
+}
+
+.dark
+  .ckeditor-wrapper
+  .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb {
+  background: #4b5563;
+}
+
+.dark
+  .ckeditor-wrapper
+  .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb:hover {
+  background: #6b7280;
+}

tsconfig.json

@@ -1,7 +1,11 @@
 {
   "compilerOptions": {
     "target": "ES2017",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -11,7 +15,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react-jsx",
     "incremental": true,
     "plugins": [
       {
@@ -19,9 +23,19 @@
       }
     ],
     "paths": {
-      "@/*": ["./*"]
+      "@/*": [
+        "./*"
+      ]
     }
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "include": [
-  "exclude": ["node_modules"]
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
 }