import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';

import '../../models/enums/translation_keys.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) {
    return ClipRRect(
      borderRadius: const BorderRadius.only(topLeft: Radius.circular(20.0), topRight: Radius.circular(20.0)),
      child: Container(
        height: 100.toScreenHeight,
        decoration: BoxDecoration(
          boxShadow: [BoxShadow(color: Colors.black.withOpacity(0.05), blurRadius: 14)],
        ),
        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),
            navBarItem(context, index: 3, iconName: "message", label: context.translation.contactUs),
          ],
          currentIndex: selectedIndex,
          selectedFontSize: 12,
          onTap: onPressed,
        ),
      ),
    );
  }

  BottomNavigationBarItem navBarItem(BuildContext context, {@required int index, @required String iconName, @required String label}) {
    return BottomNavigationBarItem(
      icon: Padding(
        padding: EdgeInsets.symmetric(vertical: 10.toScreenHeight),
        child: SvgPicture.asset(
          'assets/images/$iconName.svg',
          width: 24.toScreenWidth,
          color: selectedIndex == index ? Theme.of(context).bottomNavigationBarTheme.selectedItemColor : Theme.of(context).bottomNavigationBarTheme.unselectedItemColor,
        ),
      ),
      label: label,
    );
  }
}