import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';

class AppBottomNavigationBar extends StatelessWidget {
  final Function(int index) onPressed;
  final int selectedIndex;

  const AppBottomNavigationBar({Key key, @required this.onPressed, @required this.selectedIndex}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    bool isEngineer = (Provider.of<UserProvider>(context, listen: false).user.type) == UsersTypes.engineer;
    return ClipRRect(
      borderRadius: const BorderRadius.only(topLeft: Radius.circular(20.0), topRight: Radius.circular(20.0)),
      child: Container(
        height: 120.toScreenHeight,
        decoration: BoxDecoration(
          color: AppColor.background(context),
          boxShadow: [boxShadowR14],
        ),
        child: BottomNavigationBar(
          items: <BottomNavigationBarItem>[
            navBarItem(context, index: 0, iconName: "overview", label: context.translation.overview),
            navBarItem(context, index: 1, iconName: "requests", label: context.translation.myRequests),
            navBarItem(context, index: 2, iconName: "assets", label: context.translation.myAssets),
            if (isEngineer) navBarItem(context, index: 3, iconName: "calender_bottom", label: context.translation.calendar),
            navBarItem(context, index: isEngineer ? 4 : 3, iconName: "message", label: context.translation.contactUs),
          ],
          currentIndex: selectedIndex,
          onTap: onPressed,
          selectedLabelStyle: AppTextStyles.tinyFont,
          unselectedLabelStyle: AppTextStyles.tinyFont,
          selectedItemColor: Theme.of(context).bottomNavigationBarTheme.selectedItemColor,
          unselectedItemColor: Theme.of(context).bottomNavigationBarTheme.unselectedItemColor,
        ),
      ),
    );
  }

  BottomNavigationBarItem navBarItem(BuildContext context, {@required int index, @required String iconName, @required String label}) {
    return BottomNavigationBarItem(
      icon: iconName
          ?.toSvgAsset(
            width: 24,
            color: selectedIndex == index ? Theme.of(context).bottomNavigationBarTheme.selectedItemColor : Theme.of(context).bottomNavigationBarTheme.unselectedItemColor,
          )
          ?.paddingOnly(top: 10, bottom: 10),
      label: label,
    );
  }
}
