import React, { Component } from 'react';
import Widget from '../generics/widget.jsx';
import config from '../../../core/config';
import iso from '../../../iso';
import { connect } from 'react-redux';
import SearchResult from './searchResult.jsx';
import SearchFilterByEntityType from './searchFilterByEntityType.jsx';

class SearchPage extends Component {

    render() {
        let content;

        const { searchResult, isFetchingSearch } = this.props;

        if ( isFetchingSearch ) {
            content = 'searching....';
        } else if ( !searchResult || searchResult.length === 0 ) {
            content = 'nothing...';
        } else {
            content = (
                <div className="cluedIn_container">
                    <div className="cluedIn_col s3">
                        <SearchFilterByEntityType facets={searchResult.Facets.entityType}></SearchFilterByEntityType>
                    </div>
                    <div className="cluedIn_col s9">
                        <SearchResult searchResult={searchResult} isFetchingSearch={isFetchingSearch}></SearchResult>
                    </div>
                </div>
            );
        }
        return (
            <div>{ content }</div>
        );
    }
}

var select = ( state ) => {
    return {
        searchResult: state.search.searchResult,
        isFetchingSearch: state.search.isFetchingSearch
    };
};

export default connect( select )( SearchPage );