import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:geolocator/geolocator.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';

import '../app/constant.dart';
import '../app/route.dart';
import '../provider/current_menu_provider.dart';
import '../provider/current_user_provider.dart';
import '../provider/google_login_provider.dart';
import '../screen/presensi/check_distance_provider.dart';
import 'sankbar_widget.dart';

class CustomGoogleMapWidget extends HookConsumerWidget {
  const CustomGoogleMapWidget({
    super.key,
    required this.positionLastLatitudeParam,
    required this.positionLastLongitudeParam,
  });

  final ValueNotifier<String> positionLastLatitudeParam;
  final ValueNotifier<String> positionLastLongitudeParam;
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final mapController = useState<GoogleMapController?>(null);
    final currentPosition = useState<LatLng?>(null);
    final isLocationSet = useState<bool>(false);
    final customIcon =
        useState<BitmapDescriptor>(BitmapDescriptor.defaultMarker);

    final center = LatLng(
      Constant.positionLatitudeAwal,
      Constant.positionLongitudeAwal,
    );

    final selectedUser = ref.read(currentUserProvider);
    final isLoadingProsesCheckDistance = useState<bool>(false);

    useEffect(() {
      WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
        final staffID = ref.read(currentUserProvider)?.model.staffId ?? "0";
        if (staffID == "0") {
          //not login
          Navigator.of(context)
              .pushNamedAndRemoveUntil(loginRoute, (route) => true);

          //  Navigator.popAndPushNamed(context, loginRoute);
          return;
        }
      });
      return () {};
    }, []);

    useEffect(() {
      Future<void> loadCustomMarker() async {
        final icon = await BitmapDescriptor.asset(
          const ImageConfiguration(size: Size(100, 100)),
          'images/custom_marker1.png',
        );
        customIcon.value = icon;
      }

      loadCustomMarker();
      return null;
    }, []);

    Future<void> getCurrentLocation(context) async {
      try {
        bool serviceEnabled = await Geolocator.isLocationServiceEnabled();
        if (!serviceEnabled) return;

        LocationPermission permission = await Geolocator.checkPermission();
        if (permission == LocationPermission.denied) {
          permission = await Geolocator.requestPermission();
          if (permission == LocationPermission.deniedForever ||
              permission == LocationPermission.denied) {
            return;
          }
        }

        Position position = await Geolocator.getCurrentPosition(
          desiredAccuracy: LocationAccuracy.high,
        );

        currentPosition.value = LatLng(position.latitude, position.longitude);
        isLocationSet.value = true;

        if (mapController.value != null) {
          mapController.value!.animateCamera(
            CameraUpdate.newLatLng(currentPosition.value!),
          );

          // change current position
          final currentLat = currentPosition.value!.latitude;
          final currentLong = currentPosition.value!.longitude;

          // update parameter di home
          positionLastLatitudeParam.value = currentLat.toString();
          positionLastLongitudeParam.value = currentLong.toString();

          // update ke state provider
          ref.read(currentLatitudeProvider.notifier).state = currentLat;
          ref.read(currentLongitudeProvider.notifier).state = currentLong;

          print("LATITUDE PRESENSI ${currentLat.toString()}");
          print("LONGITUDE PRESENSI ${currentLong.toString()}");

          // check distance
          ref.read(checkDistanceProvider.notifier).checkDistance(
                selectedUser?.model.staffId ?? "",
                selectedUser?.model.companyId ?? "",
                currentLat.toString(),
                currentLong.toString(),
              );
        }
      } catch (e) {
        print('Error: $e');
      }
    }

    // check distance provider
    ref.listen(checkDistanceProvider, (prev, next) {
      if (next is CheckDistanceStateLoading) {
        isLoadingProsesCheckDistance.value = true;
      } else if (next is CheckDistanceStateError) {
        isLoadingProsesCheckDistance.value = false;
        SanckbarWidget(context, next.message, snackbarType.warning);
      } else if (next is CheckDistanceStateDone) {
        isLoadingProsesCheckDistance.value = false;

        if (next.model.selfie == "TRUE") {
          ref.read(currentPageProvider.notifier).update((state) => 99);
          // Navigator.of(context).pop();
          Navigator.of(context).restorablePushNamed(presensiSelfieRoute);
        } else {
          if (next.model.selfie == "FALSE") {
            ref.read(currentPageProvider.notifier).update((state) => 99);
            Navigator.of(context).restorablePushNamed(presensiRoute);
          }
        }
      }
    });

    return Scaffold(
      backgroundColor: Constant.textWhite,
      appBar: AppBar(
        title: Text(
          // 'Home Screen',
          'User Location',
          overflow: TextOverflow.ellipsis,
          style: TextStyle(
            color: Constant.textBlack,
          ),
        ),
        backgroundColor: Constant.textWhite,
        iconTheme: IconThemeData(
          color: Constant.textBlack,
        ),
        // elevation: 1.0,
        elevation: 0.5,
      ),
      body: Stack(
        children: <Widget>[
          GoogleMap(
            onMapCreated: (controller) => mapController.value = controller,
            initialCameraPosition: CameraPosition(
              target: center,
              zoom: 11.0,
            ),
            markers: isLocationSet.value && currentPosition.value != null
                ? {
                    Marker(
                      markerId: MarkerId('current_location'),
                      position: currentPosition.value!,
                      icon: customIcon.value,
                      infoWindow: InfoWindow(
                        title:
                            'Posisi : ${currentPosition.value!.latitude}, ${currentPosition.value!.longitude}',
                        snippet:
                            '${currentPosition.value!.latitude}, ${currentPosition.value!.longitude}',
                      ),
                    ),
                  }
                : {},
          ),
          Positioned(
            bottom: 20,
            left: 20,
            child: ElevatedButton(
              onPressed: () async {
                getCurrentLocation(context);
              },
              child: Text('Current Location'),
            ),
          ),
        ],
      ),
    );
  }
}