update 30/01

src/components/shared/FancyboxWrapper.tsx

@@ -0,0 +1,19 @@
+'use client';
+
+import { useEffect } from 'react';
+import { Fancybox as NativeFancybox } from '@fancyapps/ui';
+
+
+export default function FancyboxWrapper({ children }: { children: React.ReactNode }) {
+    useEffect(() => {
+        NativeFancybox.bind('[data-fancybox]', {
+            // Options
+        });
+
+        return () => {
+            NativeFancybox.destroy();
+        };
+    }, []);
+
+    return <>{children}</>;
+}

src/components/shared/ProductItem.tsx

@@ -1,9 +1,10 @@
 'use client';
 import Link from "next/link";
-import { formatPrice  } from "@/lib/utils";
+import { formatPrice,formatTextList  } from "@/lib/utils";
 import { useProductItem } from "@/hooks/useProductItem"
 import { useCart } from '@/hooks/useCart';
 import { useEffect, useState } from "react";
+import parse from 'html-react-parser';
 
 export default function ProductItem({item}:any){
     const [mounted, setMounted] = useState(false);
@@ -131,8 +132,7 @@ export default function ProductItem({item}:any){
                                 </p>
 
                                 <div className="tooltip-spec">
-                                    <div suppressHydrationWarning 
-                                         dangerouslySetInnerHTML={{ __html: displaySummary }}/>
+                                    {parse(formatTextList(displaySummary, 5))}
                                 </div>
                             </div>
                         }
@@ -145,8 +145,7 @@ export default function ProductItem({item}:any){
                                 </p>
 
                                 <div className="tooltip-offer rounded-[8px] bg-[#FEF2F2] px-2 py-4">
-                                    <div suppressHydrationWarning 
-                                        dangerouslySetInnerHTML={{ __html: displayOffer }}/>
+                                    {parse(formatTextList(displayOffer, 5))}
                                 </div>
                             </div>
                         }