cluedin-widget/core/components/entityRelated/FollowWidget.jsx

This project contains all the pages needed for browsing entities and searching them. The aim is to replace the CluedIn.Webapp project with this one when all the pages ( including the Admin page ) will be ported to REACT.

import React, { Component } from 'react';
import FollowStats from './FollowStats.jsx';
import FollowButton from './Follow.jsx';
import { connect } from 'react-redux';
import { follow, unFollow } from '../../action/follow';
import { pushAction } from '../../action/action';

class FollowWidget extends Component {
  handleUnfollow() {
    const { entity } = this.props;

    this.props.dispatch(unFollow(entity));
    this.props.dispatch(pushAction('unfollow', { type: entity.data.entityType, entityId: entity.id }));
  }

  handleFollow() {
    const { entity } = this.props;

    this.props.dispatch(follow(entity));
    this.props.dispatch(pushAction('follow', { type: entity.data.entityType, entityId: entity.id }));
  }

  render() {
    const { entity, allFollowers, isDoingFollowingRequest, shouldAddFollowerEntityId, shouldRemoveFollowerEntityId } = this.props;

    return (<div className="cluedIn_following_area">
      <FollowStats shouldAddFollowerEntityId={shouldAddFollowerEntityId}
                   shouldRemoveFollowerEntityId={shouldRemoveFollowerEntityId} entity={entity}></FollowStats>
      <FollowButton onFollow={this.handleFollow.bind(this)} onUnFollow={this.handleUnfollow.bind(this)}
                    isDoingFollowingRequest={isDoingFollowingRequest} allFollowers={allFollowers}
                    entity={entity}></FollowButton>
    </div>);
  }
}

var select = (state) => {
  return {
    allFollowers: state.follow.allFollowers,
    isDoingFollowingRequest: state.follow.isDoingFollowingRequest,
    shouldAddFollowerEntityId: state.follow.shouldAddFollowerEntityId,
    shouldRemoveFollowerEntityId: state.follow.shouldRemoveFollowerEntityId
  };
};

export default connect(select)(FollowWidget);