1 files changed, 8 insertions, 3 deletions
diff --git a/frontend/app/views/audio/components/audio.select.js b/frontend/app/views/audio/components/audio.select.js
index 73142f0..cf1dfb2 100644
--- a/frontend/app/views/audio/components/audio.select.js
+++ b/frontend/app/views/audio/components/audio.select.js
@@ -2,6 +2,7 @@ import React, { Component } from 'react'
 import { connect } from 'react-redux'
 
 import { Select } from 'app/common'
+import { unslugify } from 'app/utils'
 
 const NO_AUDIO = 0
 const AUDIO_TOP_OPTIONS = [
@@ -16,14 +17,14 @@ class AudioSelect extends Component {
 
   constructor(props) {
     super(props)
-    this.handleSelect = this.handleSelect.bind(this)
+    this.handleChange = this.handleChange.bind(this)
   }
 
   componentDidMount(){
     const { uploads } = this.props.graph.show.res
     const audioUploads = uploads
       .filter(upload => upload.tag === 'audio')
-      .map(page => ({ name: upload.id, label: page.path }))
+      .map(upload => ({ name: upload.id, label: unslugify(upload.fn) }))
     let audioList = [
       ...AUDIO_TOP_OPTIONS,
       ...audioUploads,
@@ -33,6 +34,10 @@ class AudioSelect extends Component {
     })
   }
 
+  handleChange(name, value) {
+    this.props.onChange(name, parseInt(value))
+  }
+
   render() {
     return (
       <Select
@@ -40,7 +45,7 @@ class AudioSelect extends Component {
         name={this.props.name}
         selected={this.props.selected || NO_AUDIO}
         options={this.state.audioList}
-        onChange={this.props.onChange}
+        onChange={this.handleChange}
       />
     )
   }