43 lines
851 B
TypeScript
43 lines
851 B
TypeScript
import { useEffect, useRef } from "react";
|
|
|
|
import useEmbed from "./useEmbed";
|
|
|
|
export default function Cal({
|
|
calLink,
|
|
calOrigin,
|
|
config,
|
|
embedJsUrl,
|
|
}: {
|
|
calOrigin?: string;
|
|
calLink: string;
|
|
config?: any;
|
|
embedJsUrl?: string;
|
|
}) {
|
|
const Cal = useEmbed(embedJsUrl);
|
|
const ref = useRef<HTMLDivElement>(null);
|
|
useEffect(() => {
|
|
if (!Cal) {
|
|
return;
|
|
}
|
|
const element = ref.current;
|
|
let initConfig = {};
|
|
if (calOrigin) {
|
|
(initConfig as any).origin = calOrigin;
|
|
}
|
|
Cal("init", initConfig);
|
|
Cal("inline", {
|
|
elementOrSelector: element,
|
|
calLink,
|
|
config,
|
|
});
|
|
return () => {
|
|
element?.querySelector(".cal-embed")?.remove();
|
|
};
|
|
}, [Cal, calLink, config, calOrigin]);
|
|
|
|
if (!Cal) {
|
|
return <div>Loading {calLink}</div>;
|
|
}
|
|
|
|
return <div ref={ref}></div>;
|
|
}
|