import styles from "@/styles/SessionCard.module.css";

type SessionCardProps = {
    previewUrl: string;
    title?: string;
    sessionId: string;
    callBack?: (sessionId: string) => void;
};

function SessionCard({ previewUrl, title, sessionId, callBack }: SessionCardProps) {
    const handleActivate = () => {
        if (callBack) {
            callBack(sessionId);
            return;
        }
        window.open(previewUrl, "_blank", "noopener");
    };

    return (
        <div
            className={styles.card}
            role="button"
            tabIndex={0}
            onKeyDown={(e) => {
                if (e.key === "Enter" || e.key === " ") {
                    e.preventDefault();
                    handleActivate();
                }
            }}
            onClick={(e) => {
                e.preventDefault();
                handleActivate();
            }}
        >
            <div className={styles.previewWrap}>
                <embed
                    src={`${previewUrl}#page=1&view=FitH&toolbar=0&statusbar=0&navpanes=0&scrollbar=0`}
                    type="application/pdf"
                    className={styles.preview}
                    style={{ pointerEvents: "none" }}
                />
            </div>
            {title && <div className={styles.title}>{title}</div>}
        </div>
    );
};

export default SessionCard;
export type { SessionCardProps };