Unable to use sound,react-sound in code pen!

Unable to use sound,react-sound in code pen!
0
#1

Hi All,
I working on drum machine project,I used sound from react-sound which is not working in codepen can someone help me to rectify the error.

class App extends React.Component {
constructor() {
super();
this.state ={
sound: “‘https://s3.amazonaws.com/freecodecamp/drums/Chord_1.mp3’”,
value: “Songs”
}
this.handlebuttonclick = this.handlebuttonclick.bind(this);
}
handlebuttonclick(e){
let soundfile = “”
switch(e.target.value){
case ‘Q’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Heater-4_1.mp3
break;
case ‘W’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Heater-1.mp3
break;
case ‘E’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Kick_n_Hat.mp3
break;
case ‘A’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/punchy_kick_1.mp3
break;
case ‘S’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Chord_1.mp3
break;
case ‘D’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Brk_Snr.mp3
break;
case ‘Z’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Dry_Ohh.mp3
break;
case ‘X’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Heater-3.mp3
break;
case ‘C’:
soundfile = ‘https://s3.amazonaws.com/freecodecamp/drums/Dsc_Oh.mp3
break;
}
this.setState(
{
sound: soundfile,
value: soundfile
}
)
}
render(){
return(

  <div id="drum-machine">
      <div id="display">
        <input className = "drum-pad" type = "button" id = 'Q' value = "Q" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'W' value = "W" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'E' value = "E" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'A' value = "A" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'S' value = "S" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'D' value = "D" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'Z' value = "Z" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'X' value = "X" onClick = {this.handlebuttonclick} />
        <input className = "drum-pad" type = "button" id = 'C' value = "C" onClick = {this.handlebuttonclick} />
                <input id = "inputText" type = "text" value = {this.state.value}/>
      </div>
      <Sound
        url={'https://s3.amazonaws.com/freecodecamp/drums/Chord_1.mp3'}
        playStatus={Sound.status.PLAYING}
        />
  </div>
);

}
}
ReactDOM.render(, document.getElementById(‘root’));

I think the issue must be ,I tried to run the code without the tab,the code works fine.