fix set html

deksrispi:
- fix di bagian tampilan forum diisi bg

src/app_modules/forum/component/detail_component/detail_list_komentar.tsx

@@ -1,10 +1,12 @@
 "use client";
 
-import { Card, Divider, Spoiler, Stack, Text } from "@mantine/core";
+import { Box, Card, Divider, Spoiler, Stack, Text } from "@mantine/core";
 import { MODEL_FORUM_KOMENTAR } from "../../model/interface";
 import ComponentForum_KomentarAuthorNameOnHeader from "../komentar_component/komentar_author_header_name";
 import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
 import { useShallowEffect } from "@mantine/hooks";
+import { Comp_V3_SetInnerHTML } from "@/app_modules/_global/component/new/comp_V3_set_html_with_stiker";
+import { MainColor } from "@/app_modules/_global/color";
 
 export default function ComponentForum_KomentarView({
   data,
@@ -18,7 +20,6 @@ export default function ComponentForum_KomentarView({
   userLoginId: string;
 }) {
   useShallowEffect(() => {
-   
     // Add custom style for stickers inside Quill editor
     const style = document.createElement("style");
     style.textContent = `
@@ -44,34 +45,42 @@ export default function ComponentForum_KomentarView({
   return (
     <>
       <ComponentGlobal_CardStyles>
-        <ComponentForum_KomentarAuthorNameOnHeader
-          tglPublish={data?.createdAt}
-          userId={data?.Author?.id}
-          komentarId={data?.id}
-          isMoreButton={true}
-          setKomentar={setKomentar}
-          postingId={postingId}
-          userLoginId={userLoginId}
-          profile={data.Author.Profile}
-        />
+        <Stack>
+          <ComponentForum_KomentarAuthorNameOnHeader
+            tglPublish={data?.createdAt}
+            userId={data?.Author?.id}
+            komentarId={data?.id}
+            isMoreButton={true}
+            setKomentar={setKomentar}
+            postingId={postingId}
+            userLoginId={userLoginId}
+            profile={data.Author.Profile}
+          />
 
-        <Stack spacing={"xs"} sx={{ zIndex: 0 }} p={"sm"}>
-          <Text fz={"sm"} lineClamp={4} c={"white"}>
-            {data.komentar ? (
-              <Spoiler
-                hideLabel="sembunyikan"
-                maxHeight={100}
-                showLabel="tampilkan"
-              >
-                <div
-                  className="chat-content"
-                  dangerouslySetInnerHTML={{ __html: data.komentar }}
-                />
-              </Spoiler>
-            ) : (
-              ""
-            )}
-          </Text>
+          <Box
+            style={{
+              backgroundColor: MainColor.soft_darkblue,
+              padding: 10,
+              borderRadius: 8,
+            }}
+          >
+            <Text fz={"sm"} lineClamp={4} c={"white"}>
+              {data.komentar ? (
+                <Spoiler
+                  hideLabel="sembunyikan"
+                  maxHeight={100}
+                  showLabel="tampilkan"
+                >
+                  <Comp_V3_SetInnerHTML
+                    props={data?.komentar}
+                    className="chat-content"
+                  />
+                </Spoiler>
+              ) : (
+                ""
+              )}
+            </Text>
+          </Box>
         </Stack>
       </ComponentGlobal_CardStyles>
     </>

src/app_modules/forum/component/detail_component/detail_view.tsx

@@ -6,7 +6,8 @@ import { IconMessageCircle, IconMessageCircleX } from "@tabler/icons-react";
 import { MODEL_FORUM_POSTING } from "../../model/interface";
 import ComponentForum_DetailHeader from "./detail_header";
 import { useShallowEffect } from "@mantine/hooks";
-import { Comp_V3_SetHtmlWithSticker } from "@/app_modules/_global/component/new/comp_V3_set_html_with_stiker";
+import { Comp_V3_SetInnerHTML } from "@/app_modules/_global/component/new/comp_V3_set_html_with_stiker";
+import { MainColor } from "@/app_modules/_global/color";
 
 export default function ComponentForum_DetailForumView({
   data,
@@ -19,21 +20,21 @@ export default function ComponentForum_DetailForumView({
   userLoginId: string;
   onLoadData: (val: any) => void;
 }) {
-  useShallowEffect(() => {
-    // Add custom style for stickers inside Quill editor
-    const style = document.createElement("style");
-    style.textContent = `
-        .chat-content img {
-        max-width: 70px !important;
-        max-height: 70px !important;
-      }
-    `;
-    document.head.appendChild(style);
-    return () => {
-      // Clean up when component unmounts
-      document.head.removeChild(style);
-    };
-  }, []);
+  // useShallowEffect(() => {
+  //   // Add custom style for stickers inside Quill editor
+  //   const style = document.createElement("style");
+  //   style.textContent = `
+  //       .chat-content img {
+  //       max-width: 70px !important;
+  //       max-height: 70px !important;
+  //     }
+  //   `;
+  //   document.head.appendChild(style);
+  //   return () => {
+  //     // Clean up when component unmounts
+  //     document.head.removeChild(style);
+  //   };
+  // }, []);
 
   return (
     <>
@@ -49,12 +50,18 @@ export default function ComponentForum_DetailForumView({
           />
 
           {/* CONTENT */}
-          <Box p={"lg"}>
+          <Box
+            style={{
+              backgroundColor: MainColor.soft_darkblue,
+              padding: 10,
+              borderRadius: 8,
+            }}
+          >
             <Text fz={"sm"} color="white">
               {data?.diskusi ? (
-                <Comp_V3_SetHtmlWithSticker
+                <Comp_V3_SetInnerHTML
                   props={data?.diskusi}
-                  className="chat-content"
+                  // className="chat-content"
                 />
               ) : (
                 ""

src/app_modules/forum/component/forumku_component/forumku_view.tsx

@@ -11,8 +11,9 @@ import { useRouter } from "next/navigation";
 import { useState } from "react";
 import { MODEL_FORUM_POSTING } from "../../model/interface";
 import ComponentForum_ForumkuHeaderCard from "./forumku_header";
-import { Comp_V3_SetHtmlWithSticker } from "@/app_modules/_global/component/new/comp_V3_set_html_with_stiker";
+import { Comp_V3_SetInnerHTML } from "@/app_modules/_global/component/new/comp_V3_set_html_with_stiker";
 import { useShallowEffect } from "@mantine/hooks";
+import { MainColor } from "@/app_modules/_global/color";
 
 export default function ComponentForum_ForumkuMainCardView({
   data,
@@ -57,15 +58,18 @@ export default function ComponentForum_ForumkuMainCardView({
           />
 
           <Box
-            sx={{ zIndex: 0 }}
-            p={"lg"}
+            style={{
+              backgroundColor: MainColor.soft_darkblue,
+              padding: 10,
+              borderRadius: 8,
+            }}
             onClick={() => {
               setVisible(true);
               router.push(RouterForum.main_detail + data?.id);
             }}
           >
             <Text c={"white"} fz={"sm"} lineClamp={4}>
-              <Comp_V3_SetHtmlWithSticker
+              <Comp_V3_SetInnerHTML
                 props={data?.diskusi}
                 className="chat-content"
                 style={{

src/app_modules/forum/component/main_component/card_view.tsx

@@ -11,8 +11,9 @@ import { useRouter } from "next/navigation";
 import { useState } from "react";
 import { MODEL_FORUM_POSTING } from "../../model/interface";
 import ComponentForum_BerandaHeaderCard from "./card_header";
-import { Comp_V3_SetHtmlWithSticker } from "@/app_modules/_global/component/new/comp_V3_set_html_with_stiker";
+import { Comp_V3_SetInnerHTML } from "@/app_modules/_global/component/new/comp_V3_set_html_with_stiker";
 import { useShallowEffect } from "@mantine/hooks";
+import { MainColor } from "@/app_modules/_global/color";
 
 export default function ComponentForum_BerandaCardView({
   data,
@@ -58,13 +59,17 @@ export default function ComponentForum_BerandaCardView({
 
           <Box
             sx={{ zIndex: 0 }}
-            p={"lg"}
+            style={{
+              backgroundColor: MainColor.soft_darkblue,
+              padding: 10,
+              borderRadius: 8,
+            }}
             onClick={() => {
               setVisible(true), router.push(RouterForum.main_detail + data?.id);
             }}
           >
             <Text c={"white"} fz={"sm"} lineClamp={4}>
-              <Comp_V3_SetHtmlWithSticker
+              <Comp_V3_SetInnerHTML
                 props={data?.diskusi}
                 className="chat-content"
                 style={{