import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:provider/provider.dart';
import 'package:tm_app/core/constants/assets.dart';
import 'package:tm_app/core/theme/colors.dart';
import 'package:tm_app/core/utils/size_config.dart';
import 'package:tm_app/view_models/home_view_model.dart';
import 'package:tm_app/view_models/tenders_view_model.dart';
import 'package:tm_app/views/home/strings/home_strings.dart';
import 'package:tm_app/views/profile/strings/profile_strings.dart';
import 'package:tm_app/views/tenders/strings/tenders_strings.dart';

import '../../core/routes/app_routes.dart';
import '../../view_models/notification_view_model.dart';

class DesktopNavigationWidget extends StatelessWidget {
  const DesktopNavigationWidget({
    required this.currentIndex,
    super.key,
    this.haveFilter = false,
  });

  final int currentIndex;
  final bool haveFilter;

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 64,
      decoration: BoxDecoration(
        color: AppColors.backgroundColor,
        border: Border(bottom: BorderSide(color: AppColors.grey30)),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          const SizedBox(width: 40),
          SvgPicture.asset(AssetsManager.logoSmall),
          const Spacer(),
          _navigationItem(
            context: context,
            text: HomeStrings.home,
            isActive: currentIndex == 0,
            onTap: () {
              if (currentIndex == 0) {
                return;
              } else {
                Router.neglect(
                  context,
                  () => const HomeRouteData().go(context),
                );
                context.read<HomeViewModel>().init();
              }
            },
            iconPath: AssetsManager.home,
            activeIconPath: AssetsManager.homeActive,
          ),
          const SizedBox(width: 24),
          _navigationItem(
            context: context,
            text: TendersStrings.tendersTitle,
            isActive: currentIndex == 1,
            onTap: () {
              if (currentIndex == 1) {
                return;
              } else {
                Router.neglect(
                  context,
                  () => const TendersRouteData().go(context),
                );
                context.read<TendersViewModel>().init(context);
              }
            },
            iconPath: AssetsManager.tenders,
            activeIconPath: AssetsManager.tendersActive,
          ),
          const SizedBox(width: 24),
          _navigationItem(
            context: context,
            text: TendersStrings.contracts,
            isActive: currentIndex == 2,
            onTap: () {
              if (currentIndex == 2) {
                return;
              } else {
                //    Router.neglect(context, () => TendersRouteData().go(context));
                //    context.read<TendersViewModel>().getTenders();
              }
            },
            iconPath: AssetsManager.contracts,
            activeIconPath: AssetsManager.contracts,
          ),
          const SizedBox(width: 24),
          _navigationItem(
            context: context,
            text: TendersStrings.notifications,
            isActive: currentIndex == 3,
            onTap: () {
              if (currentIndex == 3) {
                return;
              } else {
                Router.neglect(
                  context,
                  () => const NotificationRouteData().go(context),
                );
                context.read<NotificationViewModel>().init();
              }
            },
            iconPath: AssetsManager.notify,
            activeIconPath: AssetsManager.notifyActive,
          ),
          const SizedBox(width: 24),
          _navigationItem(
            context: context,
            text: ProfileStrings.profileTitle,
            isActive: currentIndex == 4,
            onTap: () {
              if (currentIndex == 4) {
                return;
              } else {
                Router.neglect(
                  context,
                  () => const ProfileRouteData().go(context),
                );
              }
            },
            iconPath: AssetsManager.profile,
            activeIconPath: AssetsManager.profileActive,
          ),
          const Spacer(),
          if (haveFilter)
            Builder(
              builder:
                  (context) => IconButton(
                    icon: SvgPicture.asset(
                      AssetsManager.filter,
                      height: 24.0.w(),
                      width: 24.0.w(),
                    ),
                    onPressed: () {
                      Scaffold.of(context).openEndDrawer();
                    },
                  ),
            ),
          const SizedBox(width: 68),
        ],
      ),
    );
  }

  Widget _navigationItem({
    required BuildContext context,
    required String text,
    required bool isActive,
    required VoidCallback onTap,
    required String iconPath,
    required String activeIconPath,
  }) {
    final hasUnread = context.watch<HomeViewModel>().hasUnreadNotification;

    return InkWell(
      onTap: onTap,
      child: SizedBox(
        width: 115.0,
        height: 64,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Stack(
              clipBehavior: Clip.none,
              children: [
                SvgPicture.asset(isActive ? activeIconPath : iconPath),
                if (text == TendersStrings.notifications && hasUnread)
                  Positioned(
                    right: -5,
                    top: -2,
                    child: Container(
                      width: 8,
                      height: 8,
                      decoration: const BoxDecoration(
                        color: Colors.red,
                        shape: BoxShape.circle,
                      ),
                    ),
                  ),
              ],
            ),
            const SizedBox(width: 8),
            Text(
              text,
              style: TextStyle(
                fontSize: 12.0.sp(),
                fontWeight: FontWeight.w400,
                color: isActive ? AppColors.primaryColor : AppColors.grey60,
              ),
            ),
          ],
        ),
      ),
    );
  }
}
