Routing error

component

import { Reapp, React, View, Button, Tappable } from 'reapp-kit';

var Home = React.createClass({
  contextTypes: {
        router: React.PropTypes.func
      },

  render: function() {
    var router = this.context.router;
    const refineButton =
      <Button onTap={() => router.transitionTo('/search')} >Refine Search</Button>

    return (
      <View title="Clinic Finder" titleRight={refineButton}>
      <ClinicView />
      </View>
    );
  }
});

var ClinicView = React.createClass({

    getInitialState: function() {
      var clinicList;
      var router = this.context.router;
      var query = window.location.search;
      var url = 'http://api.clinicfinder.lab/api/v1.0/clinic'; //@TODO: Url should go in config file.
      if (query !== ""){
        url = url+query; // @TODO: This can potentially be a security flaw. Need to revisit. 
      }
      $.ajax({
        url: url,
        type: 'get',
        data: query, 
        async: false,
        success: function(data) {
          clinicList = data;
        }
      });
      return {
          clinics: clinicList
        }
    },

    contextTypes: {
        router: React.PropTypes.func
      },

    componentDidMount: function(context){
      var res = [];
      var d = '';
      var router = this.context.router;
      for (var i = 0; i < this.state.clinics.count; i++) {
        var ms = '';
        d = this.state.clinics.data[i];
        if (d.medical_scheme) {
          $.map(d.medical_scheme, function(val, i){
            ms += val.label + ' ';
          });
        }
        var path = '/clinic/'+d.id;
        res.push(
          <Tappable className='clinic' onTap={() => router.transitionTo(path, i)}>
            <div id='name'>{d.name}</div>
            <div>{d.address}</div>
            <div>{ms}</div>
            <span>Timings: {d.timings.value_formatted} - {d.timings.value2_formatted}</span>
          </Tappable>
          );
      }

      if (this.isMounted()) {
        this.setState({res: res});
      }
    },
 
    render: function() {
        return (
            <div id="clinic-list"><span>{this.state.res}</span></div>
        );
    }
});
 
export default Reapp(Home);