Reduxと反応する-アクションを親にバインドできません

別のJSファイルのアクションをその親コン​​ポーネントにリンクするのに問題があるReduxパターンは初めてです。コンポーネントは次のとおりです。

import React, {Component} from 'react';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import playSample from './sampleActions/clickToPlay';

class SamplesInnerLrg extends Component {  
    render() {
         return <div>
   {
     this.props.samples.map((sample) => {
        return (
                <div key={sample.id} className="sample-comp-lge">
                    <div className="sample-comp-lge-header">
                        <span className="sample-comp-lge-Name">{sample.sampleName}</span>
                        <span className="sample-comp-lge-id">{sample.sampleFamily}</span>
                    </div>
                    <div className="sample-comp-lge-audio" ref={sample.id} onClick={() => this.bind.playSample(sample)}>
                        <audio preload="auto" id="myAudio">
                              <source src={sample.soundSource} type="audio/wav" />
                        </audio>
                    </div>
                    <div className="sample-comp-lge-owner">{sample.uploader}</div>
                </div>
            )
        })
     }
   </div>
    }
}

function mapStateToProps(state) {
    return {
        samples:state.samples
    };
} 

function matchDispatchToProps(dispatch) {
    return bindActionCreators({playSample:playSample},dispatch)
}

export default connect(mapStateToProps,matchDispatchToProps)(SamplesInnerLrg);

具体的には、インポートされたファイル（clickToPlay.js）の関数を呼び出すonClickアクションをこの行に配置しようとしています。

<div className="sample-comp-lge-audio" ref={sample.id} onClick={() => this.bind.playSample(sample)}>

clickToPlayファイルは次のようになります。

import $ from 'jquery';

export const playSample = (sample) => {
    console.log(sample);

        return {
            type:"Play_Sample_clicked",
            payload:sample
        }
    };

クリック時に発生するエラーは、未定義のプロパティ「playSample」を読み取れません。アクションをコンポーネントに正しくバインドしたと思いますが、理由がわかりませんか？

編集：

リクエストに応じて、index.jsファイルを次に示します。

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import {Provider} from 'react-redux';
import { createStore,compose } from 'redux';
import allReducers from './reducers';

const store = createStore(allReducers,compose(
    window.devToolsExtension ? window.devToolsExtension() : f => f
    ));

ReactDOM.render(
    <Provider store={store}>
        <App />
    </Provider>
  ,
  document.getElementById('root')
);