import 'package:flutter/material.dart';

class NavItem {
  final String title;
  final Widget icon;
  final Widget activeIcon;

  const NavItem(
      {required this.title, required this.icon, required this.activeIcon});
}

class NavbarItem extends StatelessWidget {
  const NavbarItem({
    Key? key,
    required this.item,
    required this.active,
    required this.onTap,
  }) : super(key: key);

  final NavItem item;
  final bool active;
  final void Function() onTap;

  @override
  Widget build(BuildContext context) {
    final Widget icon = active ? item.activeIcon : item.icon;

    return SafeArea(
      child: GestureDetector(
        onTap: onTap,
        child: Padding(
          padding: const EdgeInsets.symmetric(vertical: 12.0, horizontal: 6.0),
          child: Container(
            padding: const EdgeInsets.all(12.0),
            decoration: BoxDecoration(
              color: active
                  ? Theme.of(context).colorScheme.secondary.withOpacity(.4)
                  : null,
              borderRadius: BorderRadius.circular(14.0),
            ),
            child: Stack(
              children: [
                IconTheme(
                  data: IconThemeData(
                    color: Theme.of(context).colorScheme.secondary,
                  ),
                  child: icon,
                ),
                IconTheme(
                  data: IconThemeData(
                    color: Theme.of(context).brightness == Brightness.light
                        ? Colors.black.withOpacity(.5)
                        : Colors.white.withOpacity(.3),
                  ),
                  child: icon,
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
