import { Tabbar, TabbarItem } from '@cap-rel/smartcommon';
import { useNavigation } from '@cap-rel/smartcommon';
import { useLocation } from 'react-router-dom';
import { FiHome, FiSearch, FiShoppingCart, FiUser } from 'react-icons/fi';

function AppTabbar() {
    const navigate = useNavigation();
    const location = useLocation();

    const tabs = [
        { icon: FiHome, label: 'Accueil', path: '/' },
        { icon: FiSearch, label: 'Recherche', path: '/search' },
        { icon: FiShoppingCart, label: 'Panier', path: '/cart', badge: 3 },
        { icon: FiUser, label: 'Profil', path: '/profile' }
    ];

    return (
        <Tabbar>
            {tabs.map(tab => (
                <TabbarItem
                    key={tab.path}
                    icon={tab.icon}
                    label={tab.label}
                    active={location.pathname === tab.path}
                    badge={tab.badge}
                    onClick={() => navigate(tab.path)}
                />
            ))}
        </Tabbar>
    );
}