import React from 'react';
import { MEDIA_URL } from '../../../../../utils/Constant';

const ExerciseMedia = ({ image, audio, video  }) => {
  const mediaPath = `${MEDIA_URL}/exercise`;

  return (
    <div>
      {image !== null && (
          <div className='my-1'>
            <img src={`${mediaPath}/image/${image}`} alt="" />
            {/* <h3>{`${MEDIA_URL}/exercise/image/${image}`}</h3> */}
          </div>
      )}
      {audio !== null && (
          <div className='my-1'>
            {/* <audio controls>
              <source src={audio} type="audio/mpeg" />
              Your browser does not support the audio element.
            </audio> */}
            <h3>{`${mediaPath}/audio/${audio}`}</h3>
          </div>
      )}
      {video !== null && (
        // <video src={video} controls className='my-1'></video>
        <div className="my-1">
          <h3>{video}</h3>
        </div>
      )}
    </div>
  );
};

export default ExerciseMedia;