import React, { useEffect, useRef, useState } from 'react';
import './ListaProduse.css';

const ListaProduse = ({ products, handleRemoveProduct, updateProductQuantity }) => {
    const tableRef = useRef(null);
    const [productList, setProductList] = useState([]);

    // Sincronizare lista produse
    useEffect(() => {
        setProductList(products);
    }, [products]);

    // Focus pe ultimul produs adăugat
    useEffect(() => {
        if (tableRef.current) {
            tableRef.current.scrollTop = tableRef.current.scrollHeight;
        }
    }, [productList]);

    // Funcție pentru a elimina un produs și a recalcula garanția
    const handleRemoveWithWarranty = (productId) => {
        setProductList((prevProducts) => {
            // Ștergem produsul principal
            let updatedProducts = prevProducts.filter(p => p.id !== productId);
        
            // Căutăm produsul principal în lista de produse pentru a extrage id-ul garanției
            const product = prevProducts.find(p => p.id === productId && !p.isWarranty);
            
            if (product) {
                // Construim ID-ul garanției utilizând `product.id_garantie` și `product.id`
                const warrantyProductId = `7782${product.id_garantie}${product.id}`;
        
                // Găsim produsul de garanție asociat și îl eliminăm
                updatedProducts = updatedProducts.filter(p => p.id !== warrantyProductId);  // Eliminăm produsul de garanție
            }
        
            // Salvăm lista actualizată în localStorage
            localStorage.setItem('products', JSON.stringify(updatedProducts));
        
            // Apelează funcția handleRemoveProduct pentru a șterge produsul și din starea părintele
            handleRemoveProduct(productId);
    
            return updatedProducts;  // Returnăm lista actualizată
        });
    };
    const calculateTotal = (price, quantity) => {
      
        const total = price * quantity;  // Calculăm totalul exact
    
        
        // Rotunjim la 3 zecimale pentru precizie internă
        const preciseTotal = Math.round(total * 1000) / 1000;
     
        // Rotunjim doar la 2 zecimale pentru rezultatul final
        const finalTotal = Math.round(preciseTotal * 100) / 100;
       
      
        return finalTotal;
      };
   
    return (
        <div className="produse-table-container" ref={tableRef}>
            <table className="produse-table">
                <thead>
                    <tr>
                        <th>Produs</th>
                        <th>Cantitate</th>
                        <th>Pret/UM</th>
                        <th>Total</th>
                        <th>Operatie</th>
                    </tr>
                </thead>
                <tbody>
                    {productList.map((product, index) => (
                        <tr key={`${product.id}-${index}`} className={product.isWarranty ? "garantie-row" : ""}>
                            <td><strong>{product.name}</strong></td>
                            <td>
                                <span className="quantity-container">
                                    {!product.isWarranty && (
                                        <>
                                            <button 
                                                className="button-minus" 
                                                onClick={() => updateProductQuantity(product.id, -1)}
                                            >
                                                -
                                            </button>
                                            <span className="quantity-display">{parseFloat(product.quantity).toFixed(3)}</span>
                                            <button 
                                                className="button-plus" 
                                                onClick={() => updateProductQuantity(product.id, 1)}
                                            >
                                                +
                                            </button>
                                        </>
                                    )}
                                    {product.isWarranty && (
                                        <span className="quantity-display">{parseFloat(product.quantity).toFixed(3)}</span>
                                    )}
                                </span>
                            </td>
                            <td>{parseFloat(product.price).toFixed(2)}</td>
                            <td>{calculateTotal(parseFloat(product.price), parseFloat(product.quantity))}</td>

                            <td>
                                {!product.isWarranty && (
                                    <button 
                                        className="button-delete" 
                                        onClick={() => handleRemoveWithWarranty(product.id)}
                                    >
                                        Sterge
                                    </button>
                                )}
                            </td>
                        </tr>
                    ))}
                </tbody>
            </table>
        </div>
    );
};

export default ListaProduse;
