This repository has been archived on 2024-06-13. You can view files and clone it, but cannot push or open issues or pull requests.
tony f4d76e0060 Modified the prop naming for the videoButton
component so now the passed props are working
with youtube video id.
2023-04-18 09:31:17 -07:00

27 lines
729 B
JavaScript

import React, { useState } from "react";
import ModalVideo from "react-modal-video";
import "react-modal-video/scss/modal-video.scss";
const VideoButton = ({ videoId, buttonOneText }) => {
const [isOpen, setIsOpen] = useState(false);
const openModal = () => {
setIsOpen(true);
};
return (
<div>
<button className="px-20 mt-8 mx-5 py-2 text-white border border-blue-500 rounded hover:border-white transition duration-300 ease-in-out focus:outline-none" onClick={openModal}>
{buttonOneText}
</button>
<ModalVideo
channel="youtube"
isOpen={isOpen}
videoId={videoId}
onClose={() => setIsOpen(false)}
/>
</div>
);
};
export default VideoButton;