import React, { Component } from 'react'
import Widget from '../../../core/components/generics/widget.jsx'
import Overlay from '../../../core/components/generics/overlay.jsx'
import registry from '../../../core/registry'
import config from '../../../core/config'
import { connect } from 'react-redux'
import { shouldFetchEntityIfNeeded } from '../../../core/action/entity'
import iso from '../../../iso'
import ProviderIcons from '../../../core/components/entityRelated/providerIcons.jsx'
import NoEntities from '../../../core/components/entityRelated/NoEntities.jsx'
import { findFromKey } from '../../../core/helpers/properties.jsx'
import FakeSocialMenu from './fakeSocial.jsx'
import RemovableComponent from '../../../core/components/base/RemovableComponent.jsx'

const collectionHelper = iso.collection;

class EntitySocialOverview extends RemovableComponent {

    getMenu() {
        return this.getRemovableActions();
    }

    render() {
        let minHeight       = 'auto';
        let hasTwitterInfo  = true;
        let hasFacebookInfo = false;
        let hasLinkedInfo   = false;
        let fakeHtml;
        let content;

        const { isFetchingEntity, entity, isAdmin } = this.props;

        if ( !isFetchingEntity ) {
            var twitterFriendsCount     = findFromKey( entity.properties, 'twitter-friendscount' );
            var twitterFollowerCount    = findFromKey( entity.properties, 'twitter-followerscount' );
            var twitterNbTweetCount     = findFromKey( entity.properties, 'twitter-statusescount' );
            var twitterNbFavoritesCount = findFromKey( entity.properties, 'twitter-favoritescount' );
            var twitterIsVerifed        = findFromKey( entity.properties, 'twitter-userverified' );

            if ( (!twitterFriendsCount || !twitterFriendsCount.value)
                && ( !twitterFollowerCount || !twitterFollowerCount.value)
                && ( !twitterNbTweetCount || !twitterNbTweetCount.value)
                && ( !twitterNbFavoritesCount || !twitterNbFavoritesCount.value)
                && ( !twitterIsVerifed || !twitterIsVerifed.value) ) {
                hasTwitterInfo = false;
                content        = (<FakeSocialMenu></FakeSocialMenu>);
            } else {
                let twitterFollwersHtml;
                let twitterFollowingHtml;
                let twitterNbTweetHtml;
                let twitterNbFavoriteHtml;
                let twitterIsVerifiedHtml;

                if ( twitterFollowerCount && twitterFollowerCount.value ) {
                    /*
                     <span className="cluedIn_social_overview_number_prev">
                     <span className="cluedIn_social_overview_number_prev_number">387</span>
                     <span className="cluedIn_social_overview_number_prev_period">PREV. WEEK</span>
                     </span>
                     <span className="cluedIn_social_overview_number_indicator">
                     <i className="fa fa-arrow-circle-up"></i>
                     </span>
                     */
                    twitterFollwersHtml = (
                        <li className="cluedIn_social_overview_twitter_followers">
                            <span className="cluedIn_social_overview_title">Followers</span>
                        <span className="cluedIn_social_overview_number">
                            {twitterFollowerCount.value}
                        </span>
                        </li>)
                }

                if ( twitterFriendsCount && twitterFollowerCount.value ) {
                    twitterFollowingHtml = (
                        <li className="cluedIn_social_overview_twitter_following">
                            <span className="cluedIn_social_overview_title">Followings</span>
                        <span className="cluedIn_social_overview_number">
                            {twitterFriendsCount.value}
                        </span>
                        </li>);
                }

                if ( twitterNbTweetCount && twitterNbTweetCount.value ) {
                    twitterNbTweetHtml = (
                        <li className="cluedIn_social_overview_twitter_tweets">
                            <span className="cluedIn_social_overview_title">Tweets</span>
                        <span className="cluedIn_social_overview_number">
                            {twitterNbTweetCount.value}
                        </span>
                        </li>
                    );
                }

                if ( twitterNbFavoritesCount && twitterNbFavoritesCount.value ) {
                    twitterNbFavoriteHtml = (
                        <li className="cluedIn_social_overview_twitter_tweets">
                            <span className="cluedIn_social_overview_title">Favorites</span>
                        <span className="cluedIn_social_overview_number">
                            {twitterNbFavoritesCount.value}
                        </span>
                        </li>
                    );
                }

                if ( twitterIsVerifed && twitterIsVerifed.value ) {
                    twitterIsVerifiedHtml = (
                        <li className="cluedIn_social_overview_twitter_tweets">
                            <span className="cluedIn_social_overview_title">Is Verified account?</span>
                        <span className="cluedIn_social_overview_number">
                            {twitterIsVerifed.value}
                        </span>
                        </li>
                    );
                }

                content = (<ul>
                    <li className="cluedIn_social_overview_header twitter">
                        <i className="fa fa-twitter"></i>Twitter
                    </li>
                    {twitterFollwersHtml}
                    {twitterFollowingHtml}
                    {twitterNbTweetHtml}
                    {twitterNbFavoriteHtml}
                    {twitterIsVerifiedHtml}
                </ul>)
            }

            if ( !hasTwitterInfo && !hasFacebookInfo && !hasLinkedInfo ) {
                fakeHtml = (<Overlay><NoEntities isAdmin={isAdmin}></NoEntities></Overlay>);
            }
        } else {
            minHeight = '200px';
        }

        return (
            <Widget loading={isFetchingEntity} title="Social Overview" menu={this.getMenu()} minHeight={minHeight}>
                {fakeHtml}
                <div className="cluedIn_entity_list">
                    <ul className="cluedIn_social_overview">
                        {content}
                    </ul>
                </div>
            </Widget>
        );

    }
}

function select( state ) {
    return {
        entity: state.entity.selectedEntity,
        isFetchingEntity: state.entity.isFetchingEntity
    };
}

registry.register( 'EntitySocialOverview', connect( select )( EntitySocialOverview ) );