import PropTypes from "prop-types";
import { useEffect } from "react";
import { useLocation } from "react-router-dom";
import { enqueueSnackbar } from "notistack"; // ✅ import this
import { useSelector } from "react-redux";
import openToast from "./third-party/openToast";

const ScrollTop = ({ children }) => {
  const fcmtoken = useSelector((state) => state.fcm);
  console.log("fcmtoken", fcmtoken);

  const { pathname } = useLocation();

  useEffect(() => {
    // Scroll to top
    window.scrollTo({
      top: 0,
      left: 0,
      behavior: "smooth",
    });

    // ✅ Show toast when route changes
    if (fcmtoken.permission === "denied") {
      enqueueSnackbar("Must enable Notifications to get the orders update", {
        variant: "error",
        anchorOrigin: { vertical: "bottom", horizontal: "right" },
        autoHideDuration: 3000,
      });
    }
  }, [pathname]);

  return children || null;
};

ScrollTop.propTypes = {
  children: PropTypes.node,
};

export default ScrollTop;
