1 files changed, 51 insertions, 8 deletions

diff --git a/src-migrate/modules/product-detail/components/Information.tsx b/src-migrate/modules/product-detail/components/Information.tsx
index 4d54c03c..25ca3709 100644
--- a/src-migrate/modules/product-detail/components/Information.tsx
+++ b/src-migrate/modules/product-detail/components/Information.tsx
@@ -9,6 +9,7 @@ import style from '../styles/information.module.css';
 import dynamic from 'next/dynamic';
 import Link from 'next/link';
 import { useEffect, useRef, useState } from 'react';
+import axios from 'axios'; // <--- 1. TAMBAHAN IMPORT AXIOS
 
 import currencyFormat from '@/core/utils/currencyFormat';
 import { InputGroup, InputRightElement, SimpleGrid, Flex, Text, Box } from '@chakra-ui/react';
@@ -44,6 +45,44 @@ const Information = ({ product }: Props) => {
   const variantId = selectedVariant?.id;
   const { slaVariant, isLoading } = useVariant({ variantId });
 
+  const [warranties, setWarranties] = useState<Record<string, string>>({});
+  const [loadingWarranty, setLoadingWarranty] = useState(false);
+
+  useEffect(() => {
+    const fetchWarrantyDirectly = async () => {
+       if (!product?.variants || product.variants.length === 0) return;
+
+       setLoadingWarranty(true);
+       try {
+         // Ambil semua SKU untuk dikirim ke API
+         const skus = product.variants.map((v) => v.id).join(',');
+         const mainSku = product.variants[0].id;
+         console.log("Fetching warranties for SKUs:", skus);
+         console.log("Main SKU:", mainSku);
+
+         // Panggil API magento-product
+         const res = await axios.get('/api/magento-product', {
+             params: { skus, main_sku: mainSku }
+         });
+
+         // Simpan hasil ke state lokal
+         if (res.data && res.data.warranties) {
+             setWarranties(res.data.warranties);
+         }
+         console.log("Warranties API Response:", res);
+         console.log("Warranties fetched:", res.data.warranties);
+       } catch (error) {
+         console.error("Gagal ambil garansi:", error);
+       } finally {
+         setLoadingWarranty(false);
+       }
+    };
+
+    fetchWarrantyDirectly();
+  }, [product]);
+  // ======================================================
+
+
   useEffect(() => {
     if (selectedVariant) {
       setInputValue(
@@ -239,7 +278,6 @@ const Information = ({ product }: Props) => {
       <div className="mt-6 border-t pt-4">
         <h2 className="font-bold text-gray-800 text-sm mb-4">Detail Informasi Produk</h2>
         
-        {/* Perubahan: Spacing diperbesar menjadi 10 agar estimasi bergeser ke kanan */}
         <SimpleGrid columns={{ base: 1, md: 3 }} spacing={10}>
             {/* 1. Distributor Resmi */}
             <Flex align="center" className="gap-3">
@@ -273,7 +311,7 @@ const Information = ({ product }: Props) => {
                 </Box>
             </Flex>
 
-            {/* 3. Garansi Produk - UPDATED DYNAMIC VALUE */}
+            {/* 3. Garansi Produk */}
             <Flex align="center" className="gap-3">
                 <img 
                     src="/images/garansi.svg" 
@@ -282,12 +320,17 @@ const Information = ({ product }: Props) => {
                 />
                 <Box>
                     <Text fontSize="11px" color="gray.500" lineHeight="short" mb="1px">Garansi Produk</Text>
-                    <Text fontSize="12px" fontWeight="bold" color="gray.800" lineHeight="short">
-                        {/* Mengambil dari selectedVariant.z_warranty */}
-                        {selectedVariant && (selectedVariant as any).z_warranty 
-                            ? (selectedVariant as any).z_warranty 
-                            : '-'}
-                    </Text>
+                    
+                    {/* Menggunakan Loading State & Data dari 'warranties' */}
+                    {loadingWarranty ? (
+                         <Skeleton height="12px" width="80px" mt="2px" />
+                    ) : (
+                        <Text fontSize="12px" fontWeight="bold" color="gray.800" lineHeight="short">
+                            {selectedVariant && warranties[selectedVariant.id] 
+                                ? warranties[selectedVariant.id] 
+                                : '-'}
+                        </Text>
+                    )}
                 </Box>
             </Flex>
         </SimpleGrid>