update ckeditor

components/details/details-content.tsx

@@ -20,6 +20,7 @@ import {
 } from "@/service/master-user";
 import { useForm } from "react-hook-form";
 import { Badge } from "../ui/badge";
+import { formatTextToHtmlTag } from "@/utils/global";
 
 type TabKey = "trending" | "comments" | "latest";
 
@@ -316,21 +317,14 @@ export default function DetailContent() {
   //     </div>
   //   );
   // }
-  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 (
@@ -505,11 +499,10 @@ export default function DetailContent() {
             <div className="flex-1 overflow-y-auto">
               <div className="prose max-w-none text-justify">
                 <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"
-                  }}
                 />
               </div>
 

components/editor/custom-editor.js

@@ -1,7 +1,7 @@
-// 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) {
@@ -47,7 +47,7 @@ function CustomEditor(props) {
               padding: 1rem;
             }
             p {
-              margin: 0.5em 0;
+              margin: 0.5em 0 !important;
             }
             h1, h2, h3, h4, h5, h6 {
               margin: 1em 0 0.5em 0;
@@ -72,98 +72,6 @@ function CustomEditor(props) {
           },
         }}
       />
-      <style jsx>{`
-        .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);
-        }
-
-        .ckeditor-wrapper :global(.ck.ck-editor__main) {
-          min-height: ${props.height || 400}px;
-          max-height: ${maxHeight}px;
-        }
-
-        .ckeditor-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: #fff !important;
-          color: #111 !important;
-        }
-
-        /* Dark mode support */
-        :global(.dark) .ckeditor-wrapper :global(.ck.ck-editor__editable) {
-          background: #111 !important;
-          color: #f9fafb !important;
-        }
-
-        :global(.dark) .ckeditor-wrapper :global(.ck.ck-editor__editable h1),
-        :global(.dark) .ckeditor-wrapper :global(.ck.ck-editor__editable h2),
-        :global(.dark) .ckeditor-wrapper :global(.ck.ck-editor__editable h3),
-        :global(.dark) .ckeditor-wrapper :global(.ck.ck-editor__editable h4),
-        :global(.dark) .ckeditor-wrapper :global(.ck.ck-editor__editable h5),
-        :global(.dark) .ckeditor-wrapper :global(.ck.ck-editor__editable h6) {
-          color: #f9fafb !important;
-        }
-
-        :global(.dark)
-          .ckeditor-wrapper
-          :global(.ck.ck-editor__editable blockquote) {
-          background-color: #1f2937 !important;
-          border-left-color: #374151 !important;
-          color: #f3f4f6 !important;
-        }
-
-        /* Custom scrollbar styling for webkit browsers */
-        .ckeditor-wrapper :global(.ck.ck-editor__editable::-webkit-scrollbar) {
-          width: 8px;
-        }
-
-        .ckeditor-wrapper
-          :global(.ck.ck-editor__editable::-webkit-scrollbar-track) {
-          background: #f1f5f9;
-          border-radius: 4px;
-        }
-
-        .ckeditor-wrapper
-          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb) {
-          background: #cbd5e1;
-          border-radius: 4px;
-        }
-
-        .ckeditor-wrapper
-          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb:hover) {
-          background: #94a3b8;
-        }
-
-        /* Dark mode scrollbar */
-        :global(.dark)
-          .ckeditor-wrapper
-          :global(.ck.ck-editor__editable::-webkit-scrollbar-track) {
-          background: #1f2937;
-        }
-
-        :global(.dark)
-          .ckeditor-wrapper
-          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb) {
-          background: #4b5563;
-        }
-
-        :global(.dark)
-          .ckeditor-wrapper
-          :global(.ck.ck-editor__editable::-webkit-scrollbar-thumb:hover) {
-          background: #6b7280;
-        }
-
-        /* Ensure content doesn't overflow */
-        .ckeditor-wrapper :global(.ck.ck-editor__editable .ck-content) {
-          overflow: hidden;
-        }
-      `}</style>
     </div>
   );
 }

components/editor/view-editor.js

@@ -48,7 +48,8 @@ function ViewEditor(props) {
         .ckeditor-view-wrapper {
           border-radius: 6px;
           overflow: hidden;
-          box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
+          box-shadow:
+            0 1px 3px 0 rgba(0, 0, 0, 0.1),
             0 1px 2px 0 rgba(0, 0, 0, 0.06);
         }
 

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>

package-lock.json

@@ -43,7 +43,7 @@
         "react-apexcharts": "^1.7.0",
         "react-datepicker": "^8.4.0",
         "react-day-picker": "^9.7.0",
-        "react-dom": "^19.0.0",
+        "react-dom": "^19.2.4",
         "react-dropzone": "^14.3.8",
         "react-hook-form": "^7.65.0",
         "react-password-checklist": "^1.8.1",
@@ -1045,15 +1045,6 @@
       "resolved": "https://registry.npmjs.org/@date-fns/tz/-/tz-1.4.1.tgz",
       "integrity": "sha512-P5LUNhtbj6YfI3iJjw5EL9eUAG6OitD0W3fWQcpQjDRc/QIsL0tRNuO1PcDvPccWL1fSTXXdE1ds+l95DV/OFA=="
     },
-    "node_modules/@emnapi/runtime": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.7.1.tgz",
-      "integrity": "sha512-PVtJr5CmLwYAU9PZDMITZoR5iAOShYREoR45EyyLrbntV50mdePTgUn4AmOw90Ifcj+x2kRjdzr1HP3RrNiHGA==",
-      "optional": true,
-      "dependencies": {
-        "tslib": "^2.4.0"
-      }
-    },
     "node_modules/@emotion/babel-plugin": {
       "version": "11.13.5",
       "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.13.5.tgz",
@@ -1460,420 +1451,6 @@
         "node": ">=18"
       }
     },
-    "node_modules/@img/sharp-darwin-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.34.5.tgz",
-      "integrity": "sha512-imtQ3WMJXbMY4fxb/Ndp6HBTNVtWCUI0WdobyheGf5+ad6xX8VIDO8u2xE4qc/fr08CKG/7dDseFtn6M6g/r3w==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-darwin-arm64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-darwin-x64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.34.5.tgz",
-      "integrity": "sha512-YNEFAF/4KQ/PeW0N+r+aVVsoIY0/qxxikF2SWdp+NRkmMB7y9LBZAVqQ4yhGCm/H3H270OSykqmQMKLBhBJDEw==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-darwin-x64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-libvips-darwin-arm64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.2.4.tgz",
-      "integrity": "sha512-zqjjo7RatFfFoP0MkQ51jfuFZBnVE2pRiaydKJ1G/rHZvnsrHAOcQALIi9sA5co5xenQdTugCvtb1cuf78Vf4g==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-darwin-x64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.2.4.tgz",
-      "integrity": "sha512-1IOd5xfVhlGwX+zXv2N93k0yMONvUlANylbJw1eTah8K/Jtpi15KC+WSiaX/nBmbm2HxRM1gZ0nSdjSsrZbGKg==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-arm": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.2.4.tgz",
-      "integrity": "sha512-bFI7xcKFELdiNCVov8e44Ia4u2byA+l3XtsAj+Q8tfCwO6BQ8iDojYdvoPMqsKDkuoOo+X6HZA0s0q11ANMQ8A==",
-      "cpu": [
-        "arm"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-arm64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.2.4.tgz",
-      "integrity": "sha512-excjX8DfsIcJ10x1Kzr4RcWe1edC9PquDRRPx3YVCvQv+U5p7Yin2s32ftzikXojb1PIFc/9Mt28/y+iRklkrw==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-ppc64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-ppc64/-/sharp-libvips-linux-ppc64-1.2.4.tgz",
-      "integrity": "sha512-FMuvGijLDYG6lW+b/UvyilUWu5Ayu+3r2d1S8notiGCIyYU/76eig1UfMmkZ7vwgOrzKzlQbFSuQfgm7GYUPpA==",
-      "cpu": [
-        "ppc64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-riscv64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-riscv64/-/sharp-libvips-linux-riscv64-1.2.4.tgz",
-      "integrity": "sha512-oVDbcR4zUC0ce82teubSm+x6ETixtKZBh/qbREIOcI3cULzDyb18Sr/Wcyx7NRQeQzOiHTNbZFF1UwPS2scyGA==",
-      "cpu": [
-        "riscv64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-s390x": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.2.4.tgz",
-      "integrity": "sha512-qmp9VrzgPgMoGZyPvrQHqk02uyjA0/QrTO26Tqk6l4ZV0MPWIW6LTkqOIov+J1yEu7MbFQaDpwdwJKhbJvuRxQ==",
-      "cpu": [
-        "s390x"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-x64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.2.4.tgz",
-      "integrity": "sha512-tJxiiLsmHc9Ax1bz3oaOYBURTXGIRDODBqhveVHonrHJ9/+k89qbLl0bcJns+e4t4rvaNBxaEZsFtSfAdquPrw==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linuxmusl-arm64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.2.4.tgz",
-      "integrity": "sha512-FVQHuwx1IIuNow9QAbYUzJ+En8KcVm9Lk5+uGUQJHaZmMECZmOlix9HnH7n1TRkXMS0pGxIJokIVB9SuqZGGXw==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linuxmusl-x64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.2.4.tgz",
-      "integrity": "sha512-+LpyBk7L44ZIXwz/VYfglaX/okxezESc6UxDSoyo2Ks6Jxc4Y7sGjpgU9s4PMgqgjj1gZCylTieNamqA1MF7Dg==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-linux-arm": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.34.5.tgz",
-      "integrity": "sha512-9dLqsvwtg1uuXBGZKsxem9595+ujv0sJ6Vi8wcTANSFpwV/GONat5eCkzQo/1O6zRIkh0m/8+5BjrRr7jDUSZw==",
-      "cpu": [
-        "arm"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-arm": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.34.5.tgz",
-      "integrity": "sha512-bKQzaJRY/bkPOXyKx5EVup7qkaojECG6NLYswgktOZjaXecSAeCWiZwwiFf3/Y+O1HrauiE3FVsGxFg8c24rZg==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-arm64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-ppc64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-ppc64/-/sharp-linux-ppc64-0.34.5.tgz",
-      "integrity": "sha512-7zznwNaqW6YtsfrGGDA6BRkISKAAE1Jo0QdpNYXNMHu2+0dTrPflTLNkpc8l7MUP5M16ZJcUvysVWWrMefZquA==",
-      "cpu": [
-        "ppc64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-ppc64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-riscv64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-riscv64/-/sharp-linux-riscv64-0.34.5.tgz",
-      "integrity": "sha512-51gJuLPTKa7piYPaVs8GmByo7/U7/7TZOq+cnXJIHZKavIRHAP77e3N2HEl3dgiqdD/w0yUfiJnII77PuDDFdw==",
-      "cpu": [
-        "riscv64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-riscv64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-s390x": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.34.5.tgz",
-      "integrity": "sha512-nQtCk0PdKfho3eC5MrbQoigJ2gd1CgddUMkabUj+rBevs8tZ2cULOx46E7oyX+04WGfABgIwmMC0VqieTiR4jg==",
-      "cpu": [
-        "s390x"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-s390x": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-x64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.34.5.tgz",
-      "integrity": "sha512-MEzd8HPKxVxVenwAa+JRPwEC7QFjoPWuS5NZnBt6B3pu7EG2Ge0id1oLHZpPJdn3OQK+BQDiw9zStiHBTJQQQQ==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-x64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linuxmusl-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.34.5.tgz",
-      "integrity": "sha512-fprJR6GtRsMt6Kyfq44IsChVZeGN97gTD331weR1ex1c1rypDEABN6Tm2xa1wE6lYb5DdEnk03NZPqA7Id21yg==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linuxmusl-arm64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linuxmusl-x64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.34.5.tgz",
-      "integrity": "sha512-Jg8wNT1MUzIvhBFxViqrEhWDGzqymo3sV7z7ZsaWbZNDLXRJZoRGrjulp60YYtV4wfY8VIKcWidjojlLcWrd8Q==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linuxmusl-x64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-wasm32": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.34.5.tgz",
-      "integrity": "sha512-OdWTEiVkY2PHwqkbBI8frFxQQFekHaSSkUIJkwzclWZe64O1X4UlUjqqqLaPbUpMOQk6FBu/HtlGXNblIs0huw==",
-      "cpu": [
-        "wasm32"
-      ],
-      "optional": true,
-      "dependencies": {
-        "@emnapi/runtime": "^1.7.0"
-      },
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-win32-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-arm64/-/sharp-win32-arm64-0.34.5.tgz",
-      "integrity": "sha512-WQ3AgWCWYSb2yt+IG8mnC6Jdk9Whs7O0gxphblsLvdhSpSTtmu69ZG1Gkb6NuvxsNACwiPV6cNSZNzt0KPsw7g==",
-      "cpu": [
-        "arm64"
-      ],
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-win32-ia32": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.34.5.tgz",
-      "integrity": "sha512-FV9m/7NmeCmSHDD5j4+4pNI8Cp3aW+JvLoXcTUo0IqyjSfAZJ8dIUmijx1qaJsIiU+Hosw6xM5KijAWRJCSgNg==",
-      "cpu": [
-        "ia32"
-      ],
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
     "node_modules/@img/sharp-win32-x64": {
       "version": "0.34.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.34.5.tgz",
@@ -1962,111 +1539,6 @@
         "next": "*"
       }
     },
-    "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"
-      }
-    },
     "node_modules/@next/swc-win32-x64-msvc": {
       "version": "16.1.1",
       "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.1.1.tgz",
@@ -6777,9 +6249,9 @@
       ]
     },
     "node_modules/react": {
-      "version": "19.2.3",
+      "version": "19.2.4",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.2.3.tgz",
+      "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
-      "integrity": "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA==",
+      "integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -6831,14 +6303,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": {
@@ -7150,9 +6622,9 @@
       }
     },
     "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.3",

package.json

@@ -44,7 +44,7 @@
     "react-apexcharts": "^1.7.0",
     "react-datepicker": "^8.4.0",
     "react-day-picker": "^9.7.0",
-    "react-dom": "^19.0.0",
+    "react-dom": "^19.2.4",
     "react-dropzone": "^14.3.8",
     "react-hook-form": "^7.65.0",
     "react-password-checklist": "^1.8.1",

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;
+}