dont show procons if there is nothing + ...

src/app/product/components/BaseInformation.tsx

@@ -147,9 +147,13 @@ const BaseInformation: FC<BaseInformationProps> = ({ product, stats }) => {
                 </div>
             </div>
 
+            {
+                product.specifications.length > 0 ?
                     <div className='mt-6 sm:mt-7 text-base sm:text-lg text-[#333333]'>
                         ویژگی های کلیدی
                     </div>
+                    : null
+            }
 
             <div className='mt-6 sm:mt-10 flex flex-col gap-4 sm:gap-8'>
                 {product.specifications.slice(0, 3).map((spec, index) => (

src/app/product/components/ProsCons.tsx

@@ -8,6 +8,13 @@ interface ProsConsProps {
 }
 
 const ProsCons: FC<ProsConsProps> = ({ product }) => {
+    const hasAdvantages = product.advantages && product.advantages.length > 0
+    const hasDisAdvantages = product.disAdvantages && product.disAdvantages.length > 0
+
+    if (!hasAdvantages && !hasDisAdvantages) {
+        return null
+    }
+
     return (
         <div className="mt-12 sm:mt-16 w-full">
             <div className="flex items-center justify-end gap-3 flex-row-reverse">
@@ -16,6 +23,7 @@ const ProsCons: FC<ProsConsProps> = ({ product }) => {
             </div>
 
             <div className="mt-4 sm:mt-6 rounded-xl bg-white">
+                {hasAdvantages && (
                     <div className="grid grid-cols-12 items-start px-4 sm:px-6 py-4 sm:py-5">
                         <div className="col-span-12 md:col-span-3 flex items-center justify-end gap-2 text-[#7F7F7F] flex-row-reverse">
                             <span className="text-xs sm:text-sm">نقاط مثبت</span>
@@ -23,19 +31,17 @@ const ProsCons: FC<ProsConsProps> = ({ product }) => {
                         </div>
                         <div className="col-span-12 md:col-span-9 mt-2 md:mt-0">
                             <div className="flex flex-col gap-2 sm:gap-3 text-xs sm:text-sm text-[#333333] text-right">
-                            {product.advantages.length > 0 ? (
+                                {product.advantages.map((advantage, index) => (
-                                product.advantages.map((advantage, index) => (
                                     <div key={index}>{advantage}</div>
-                                ))
+                                ))}
-                            ) : (
+                            </div>
-                                <div className="text-[#999999]">نقطه مثبتی ثبت نشده است</div>
+                        </div>
+                    </div>
                 )}
-                        </div>
-                    </div>
-                </div>
 
-                <Separator />
+                {hasAdvantages && hasDisAdvantages && <Separator />}
 
+                {hasDisAdvantages && (
                     <div className="grid grid-cols-12 items-start px-4 sm:px-6 py-4 sm:py-5">
                         <div className="col-span-12 md:col-span-3 flex items-center justify-end gap-2 text-[#7F7F7F] flex-row-reverse">
                             <span className="text-xs sm:text-sm">نقاط منفی</span>
@@ -43,18 +49,15 @@ const ProsCons: FC<ProsConsProps> = ({ product }) => {
                         </div>
                         <div className="col-span-12 md:col-span-9 mt-2 md:mt-0">
                             <div className="flex flex-col gap-2 sm:gap-3 text-xs sm:text-sm text-[#333333] text-right">
-                            {product.disAdvantages.length > 0 ? (
+                                {product.disAdvantages.map((disadvantage, index) => (
-                                product.disAdvantages.map((disadvantage, index) => (
                                     <div key={index}>{disadvantage}</div>
-                                ))
+                                ))}
-                            ) : (
+                            </div>
-                                <div className="text-[#999999]">نقطه منفی ثبت نشده است</div>
+                        </div>
+                    </div>
                 )}
             </div>
         </div>
-                </div>
-            </div>
-        </div>
     )
 }