InternetProgramming/src/components/Button/Button100.jsx

import PropTypes from 'prop-types';
import { useNavigate } from 'react-router-dom';

function Button100({ line }) {
    const navigator = useNavigate();
    const RedirectVideo = () => {
        navigator(`/Watch/${line.id}`);
    };
    return (
        <>

            <button onClick={RedirectVideo} className="vid" style={{ width: '100%' }}>
                <img src={line.image} style={{ maxWidth: '100%', maxHeight: '50%' }} />
                <h1 className="text-center">{line.title}</h1>
            </button>
        </>

    );
}

Button100.propTypes = {
    line: PropTypes.object,
};

export default Button100;