import 'package:eva_icons_flutter/eva_icons_flutter.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:mitra_corporate/provider/menu_provider.dart';

import '../app/constant.dart';

class sideBarMenuBtnWidget extends HookConsumerWidget {
  const sideBarMenuBtnWidget({
    super.key,
    required this.currentMenu,
    required this.value,
    required this.selectedColor,
    required this.onTap,
    required this.title,
    required this.selectedColorText,
    this.iconMenu,
  });

  final int currentMenu;
  final String title;
  final List<int> value;
  final Color selectedColor;
  final Color selectedColorText;
  final Function onTap;
  final IconData? iconMenu;

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final isExpand = ref.watch(sideBarExpandProvider);
    final isSelected = useState(false);
    useEffect(() {
      WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
        isSelected.value = value.any((element) => element == currentMenu);
      });
      return () {};
    }, [currentMenu, value]);
    return Container(
      child: ListTile(
        shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.all(Radius.circular(8))),
        selected: isSelected.value ? true : false,
        selectedTileColor: selectedColor,
        title: Text(title,
            style: Constant.body3_400(context: context).copyWith(
                color: isSelected.value ? selectedColorText : Colors.grey)),
        leading: Icon(iconMenu ?? EvaIcons.grid,
            color: isSelected.value ? selectedColorText : Colors.grey,
            size: 24.0),
        onTap: () {
          onTap();
        },
      ),
    );
  }
}

class SideBarBtnSmallWidget extends StatelessWidget {
  const SideBarBtnSmallWidget({
    super.key,
    required this.currentMenu,
    required this.value,
    required this.selectedColor,
    required this.onTap,
    required this.title,
    required this.selectedColorText,
    this.iconMenu,
  });

  final int currentMenu;
  final List<int> value;
  final Color selectedColor;
  final Color selectedColorText;
  final String title;
  final Function onTap;
  final IconData? iconMenu;

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(5),
      margin:
          EdgeInsets.only(bottom: Constant.getActualY(context: context, y: 24)),
      decoration: BoxDecoration(
          color: value.any((element) => element == currentMenu)
              ? selectedColor
              : null,
          borderRadius: BorderRadius.circular(8)),
      child: IconButton(
        onPressed: () {
          onTap();
        },
        icon: Tooltip(
          message: title,
          child: Icon(iconMenu ?? EvaIcons.grid,
              color: value.any((element) => element == currentMenu)
                  ? selectedColorText
                  : Colors.grey,
              size: 24),
        ),
      ),
    );
  }
}
