import { useEffect, useState } from "react";
import { useI18n } from "../i18n";

const CAS_URL = "https://www.cas.cn/";

export function WebIframePage() {
  const { t } = useI18n();
  const [loaded, setLoaded] = useState(false);

  useEffect(() => {
    setLoaded(false);
  }, []);

  return (
    <div className="relative flex min-h-0 w-full flex-1 flex-col overflow-hidden">
      {!loaded ? (
        <div className="absolute inset-0 z-10 flex items-center justify-center bg-black/25 backdrop-blur-sm">
          <div className="rounded-lg border border-white/15 bg-blue-950/60 px-4 py-3 text-sm text-white shadow-lg">
            {t("dialog.loading")}
          </div>
        </div>
      ) : null}
      <iframe
        title="天文馆官网"
        src={CAS_URL}
        className="h-full w-full flex-1 border-0 bg-white"
        onLoad={() => setLoaded(true)}
        referrerPolicy="no-referrer"
        allow="fullscreen"
      />
    </div>
  );
}