import Document, { DocumentContext, Head, Html, Main, NextScript, DocumentProps } from "next/document"; type Props = Record & DocumentProps; function toRunBeforeReactOnClient() { const calEmbedMode = location.search.includes("embed=") || /* Iframe Name */ window.name.includes("cal-embed"); window.isEmbed = () => { // Once an embed mode always an embed mode return calEmbedMode; }; window.resetEmbedStatus = () => { try { // eslint-disable-next-line @calcom/eslint/avoid-web-storage window.sessionStorage.removeItem("calEmbedMode"); } catch (e) {} }; window.getEmbedTheme = () => { const url = new URL(document.URL); return url.searchParams.get("theme") as "dark" | "light"; }; window.getEmbedNamespace = () => { const url = new URL(document.URL); const namespace = url.searchParams.get("embed"); return namespace; }; window.isPageOptimizedForEmbed = () => { // Those pages are considered optimized, which know at backend that they are rendering for embed. // Such pages can be shown straightaway without a loader for a better embed experience return location.pathname.includes("forms/"); }; } class MyDocument extends Document { static async getInitialProps(ctx: DocumentContext) { const isEmbed = ctx.asPath?.includes("/embed") || ctx.asPath?.includes("embedType="); const initialProps = await Document.getInitialProps(ctx); return { isEmbed, ...initialProps }; } render() { const { locale } = this.props.__NEXT_DATA__; const dir = locale === "ar" || locale === "he" ? "rtl" : "ltr"; return ( {/* Define isEmbed here so that it can be shared with App(embed-iframe) as well as the following code to change background and hide body Persist the embed mode in sessionStorage because query param might get lost during browsing. */}