import 'package:flutter/material.dart';
import 'package:get/get.dart';

import '../../../constant/colors.dart';
import '../../../controller/home/map_page_controller.dart';
import '../../notification/notification_page.dart';
import '../../widgets/icon_widget_menu.dart';
import '../home_page.dart';
import '../profile/passenger_profile_page.dart';

class MapMenuWidget extends StatelessWidget {
  const MapMenuWidget({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return GetBuilder<MapController>(
      builder: (controller) => Positioned(
        right: 60,
        left: 60,
        child: Padding(
          padding: const EdgeInsets.only(right: 20),
          child: Opacity(
              alwaysIncludeSemantics: false,
              opacity: 0.99, // Adjust the opacity value as needed
              child: AnimatedContainer(
                width: Get.width * .6,
                decoration: const BoxDecoration(
                    borderRadius: BorderRadius.all(Radius.circular(12)),
                    color: AppColor.secondaryColor,
                    boxShadow: [
                      BoxShadow(
                          color: AppColor.primaryColor,
                          offset: Offset(-7, -7),
                          blurRadius: 0,
                          spreadRadius: 0,
                          blurStyle: BlurStyle.outer),
                      BoxShadow(
                          color: AppColor.accentColor,
                          offset: Offset(3, 3),
                          blurRadius: 0,
                          spreadRadius: 0,
                          blurStyle: BlurStyle.outer)
                    ]),
                transform:
                    Matrix4.translationValues(controller.heightMenu * .1, 1, 1),
                curve: Curves.easeOutCubic,
                clipBehavior: Clip.hardEdge,
                duration: const Duration(milliseconds: 300),
                height: controller.heightMenu,
                child: controller.heightMenuBool
                    ? Row(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        children: [
                          IconWidgetMenu(
                              onpressed: () {
                                Get.to(
                                  () => const NotificationPage(),
                                  transition: Transition.circularReveal,
                                );
                              },
                              title: 'Notifications'.tr,
                              icon: Icons.notifications),
                          IconWidgetMenu(
                            onpressed: () {
                              Get.to(
                                () => const PassengerProfilePage(),
                                transition: Transition.zoom,
                              );
                            },
                            icon: Icons.person,
                            title: 'Profile'.tr,
                          ),
                          IconWidgetMenu(
                              title: 'Home'.tr,
                              onpressed: () {
                                Get.to(
                                  () => const HomePage(),
                                  transition: Transition.downToUp,
                                  curve: Curves.easeInOutExpo,
                                );
                              },
                              icon: Icons.home),
                        ],
                      )
                    : const SizedBox(), // Choose the desired overlay color
              )),
        ),
      ),
    );
  }
}