audio component updated

Author: abdurrahmanekr

src/AudioMessage/AudioMessage.js

@@ -4,12 +4,16 @@ import './AudioMessage.css';
 
 export default class AudioMessage extends React.PureComponent {
     render() {
+        const audioURL = this.props.data.audioURL;
+        const controlsList = this.props.data.controlsList;
+
         return (
             <div className={'rce-mbox-audio'}>
-                <audio controls controlsList={this.props.download ? "download" : "nodownload"}>
-                    <source src={this.props.audioURL} type="audio/mp3"/>
+                <audio controls controlsList={controlsList ? controlsList : "nodownload"}>
+                    <source src={audioURL} type="audio/mp3"/>
                     Your browser does not support the audio element.
                 </audio>
+
                 {
                     this.props.text &&
                     <div className='rce-mbox-text'>
@@ -22,6 +26,5 @@ export default class AudioMessage extends React.PureComponent {
 }
 
 AudioMessage.defaultProps = {
-    audioURL: null,
-    download: false,
+    data: {},
 };

src/AudioMessage/__tests__/__snapshots__/AudioMessage.js.snap

@@ -9,7 +9,6 @@ exports[`AudioMessage component should render without issues 1`] = `
     controlsList="nodownload"
   >
     <source
-      src={null}
       type="audio/mp3"
     />
     Your browser does not support the audio element.

src/MessageBox/MessageBox.js

@@ -220,8 +220,11 @@ export class MessageBox extends React.PureComponent {
                                 }
                                 {
                                     this.props.type === 'audio' &&
-                                    <AudioMessage 
-                                        audioURL={this.props.data.audioURL}
+                                    <AudioMessage
+                                        onOpen={this.props.onOpen}
+                                        onDownload={this.props.onDownload}
+                                        onLoad={this.props.onLoad}
+                                        data={this.props.data}
                                         text={this.props.text} />
                                 }