"use client";
import React, { useEffect } from "react";
import Head from "next/head";

const CalendlyWidget = () => {
    useEffect(() => {
        const script = document.createElement("script");
        script.src = "https://assets.calendly.com/assets/external/widget.js";
        script.async = true;
        document.body.appendChild(script);

        return () => {
            document.body.removeChild(script);
        };
    }, []);

    return (
        <>
            <Head>
                <script
                    type="text/javascript"
                    src="https://assets.calendly.com/assets/external/widget.js"
                    async
                ></script>
            </Head>
            <div
                className="calendly-inline-widget"
                data-url="https://calendly.com/rankrunners-sales/30min"
                style={{ minWidth: "320px", height: "700px" }}
            />
        </>
    );
};

export default CalendlyWidget;
