import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';

class NavBarItem {
  final String iconPath;
  final String label;

  NavBarItem({required this.iconPath, required this.label});
}

class Floatingnavbar extends StatelessWidget {
  final List<NavBarItem> items;
  final int selectedIndex;
  final ValueChanged<int> onTap;

  const Floatingnavbar({
    super.key,
    required this.items,
    required this.selectedIndex,
    required this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    // Get the bottom padding to account for system navigation bar
    final bottomPadding = MediaQuery.of(context).padding.bottom;
    
    return Container(
      height: 85,
      margin: EdgeInsets.only(
        bottom: 10 + bottomPadding, // Add system padding to our margin
        left: 25,
        right: 25,
      ),
      decoration: BoxDecoration(
        color: (const Color(0xFFE9E9E9)),
        borderRadius: BorderRadius.circular(45),
       
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: items.asMap().entries.map((entry) {
          final index = entry.key;
          final item = entry.value;
          final isSelected = selectedIndex == index;

          return _NavBarItemTile(
            item: item,
            isSelected: isSelected,
            onTap: () => onTap(index),
          );
        }).toList(),
      ),
    );
  }
}

class _NavBarItemTile extends StatelessWidget {
  final NavBarItem item;
  final bool isSelected;
  final VoidCallback onTap;

  const _NavBarItemTile({
    Key? key,
    required this.item,
    required this.isSelected,
    required this.onTap,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: InkWell(
        onTap: onTap,
        borderRadius: BorderRadius.circular(45),
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 5),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              SvgPicture.asset(
                item.iconPath,
                width: 37,
                height: 37,
                colorFilter: ColorFilter.mode(
                 isSelected ? const Color(0xFF177046) : Colors.black,
                  BlendMode.srcIn,
                ),
              ),
              const SizedBox(height: 6),
              Text(
                item.label,
                style: TextStyle(
                  color:  isSelected ? const Color(0xFF177046) : Colors.black,
                  fontSize: 15,
                  fontFamily: 'AbdEriady', // Using the custom font family
                  fontWeight: isSelected ? FontWeight.w700 : FontWeight.w400, // Using specific weights
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}