import React, { useEffect, useRef } from "react";

export const WebView = ({ source, allowFullScreen, onURLChange }) => {
  const iframeRef = useRef(null);

  useEffect(() => {
    // Définition de la fonction handleLoad à l'intérieur du useEffect
    const handleLoad = () => {
      try {
        const currentUrl = iframeRef.current?.contentWindow?.location?.href;
        onURLChange(currentUrl); // Appeler la fonction de callback avec l'URL actuelle
      } catch (error) {
        console.error("Erreur d'accès à l'URL de l'iframe:", error);
      }
    };

    const iframeElement = iframeRef.current;
    iframeElement.addEventListener("load", handleLoad);

    return () => {
      iframeElement.removeEventListener("load", handleLoad);
    };
  }, [onURLChange]); // Assurez-vous que cette dépendance est correctement définie pour éviter des appels excessifs

  return (
    <iframe
      ref={iframeRef}
      src={source?.uri}
      style={{
        display: "flex",
        border: "none",
        width: "100%",
        height: "100vh",
      }}
      title="minuit.starter"
      allowFullScreen={allowFullScreen}
    />
  );
};
