import { default as React, Component } from 'react';
import { render } from 'react-dom';
var Appbase = require('appbase-js');
var helper = require('./helper.js');
import {List} from './component/List.js';
var Waypoint = require('react-waypoint');

export class AppbaseList extends Component {

  constructor(props) {
    super(props);
    this.state = {
      items: [],
      selectedItems: [],
      streamingStatus: 'Intializing..'
    };
    this.appbaseRef = helper.getAppbaseRef(this.props.config);
    this.streamingInstance;
    this.pageNumber = 0;
  }
  subscribeToUpdates() {
    var requestObject = helper.getMatchAllQuery(this.props.config, this.props.fieldName, 1, this.props.size, true);
    var self = this;
    self.setState({
      streamingStatus: 'Listening...'
    });
    if (this.streamingInstance) {
      this.streamingInstance.stop();
    }
    this.streamingInstance = this.appbaseRef.searchStream(requestObject).on('data', function (stream) {
      var updated = self.state.items;
      updated.unshift(JSON.stringify(stream._source.location));
      self.setState({
        items: updated
      });
    }).on('error', function (error) {
      console.log(error);
    });
  }

  getItems(pageNumber) {
    var requestObject = helper.getMatchAllQuery(this.props.config, this.props.fieldName, pageNumber, this.props.size, false);
    var self = this;
    this.appbaseRef.search(requestObject).on('data', function (data) {
      self.addItemsToList(data.hits.hits);
      self.subscribeToUpdates();
    }).on('error', function (error) {
      console.log(error)
    });
  }
  addItemsToList(newItems) {
    var updated = this.state.items;
    newItems.map(function (item) {
      updated.push(JSON.stringify(item._source));
    });
    this.setState({ items: updated });
  }
  handleWaypointEnter() {
    this.getItems(this.pageNumber);
    this.pageNumber++;
  }

  render() {
    return (
      <div>
        <List items={this.state.items} />
        <Waypoint
          onEnter={this.handleWaypointEnter.bind(this) }
          />
      </div>

    );
  }

}
AppbaseList.defaultProps = {
  size: 60,
};
@@ -1028,46 +1028,53 @@
 ift(
-JSON.stringify(stream._source.location
+eval(%60stream._source.$%7Bself.props.fieldName%7D%60
 ));%0A
@@ -1660,24 +1660,45 @@
 tate.items;%0A
+    var self = this;%0A
     newItems
@@ -1743,35 +1743,51 @@
 ush(
-JSON.stringify(item._source
+eval(%60item._source.$%7Bself.props.fieldName%7D%60
 ));%0A

Make the AppbaseList work on a given field