<commit_before>import { Link } from 'react-router-dom'
import { SearchField } from 'lib/components/search_field';
import SearchItem from './search_item'
import { AjaxPaginate } from 'lib/components/ajax_paginate';
import { Pagination } from 'lib/components/pagination';

export default class Search extends React.Component {
  componentDidMount() {
    this.props.loadTypesOnce()
  }

  highlightSearchTerm = (string) => {
    if(!string) return
    const searchTerm = this.props.objects.searchTerm
    const searchType = this.props.objects.searchType

    if(!searchTerm || searchTerm.length==0) return string

    const index = string.indexOf(searchTerm)

    if(index<0) return string
    const length = searchTerm.length

    return (
      <React.Fragment>
        {string.substring(0, index) }
        <span className='highlight'>
          {string.substring(index,index+length)}
        </span>
        {string.substring(index + string.length)}
      </React.Fragment>
    )
  }

  render() {
    const availableTypes = this.props.types.items.sort()
    return (
      <React.Fragment>

        <div className="toolbar">
          { this.props.types.isFetching ?
            <span>
              <i className="spinner"></i>
              Loading Types...
            </span>
          :
            <select
              onChange={(e) => this.props.search({objectType: e.target.value})}
              value={this.props.objects.objectType}
            >
              <option value="">All</option>
              { availableTypes.map((type,index) =>
                <option value={type} key={index}>{type}</option>
              )}
            </select>
          }
          <span className="toolbar-input-divider"></span>
          <SearchField
            isFetching={this.props.objects.isFetching}
            onChange={(term) => this.props.search({term})}
            value={this.props.objects.searchTerm}
            placeholder='Object ID, name or project ID'
            text='Searches by ID, IP, network, subnet or description in visible IP list only.
                  Entering a search term will automatically start loading the next pages
                  and filter the loaded items using the search term. Emptying the search
                  input field will show all currently loaded items.'
          />
          {this.props.objects.total > 0 &&
            <React.Fragment>
              <span className="toolbar-input-divider"></span>
              total: {this.props.objects.total}
            </React.Fragment>
          }
        </div>
        { this.props.objects.items && this.props.objects.items.length > 0 &&
          <table className="table">
            <thead>
              <tr>
                <th>Type</th>
                <th>Name/ID</th>
                <th>Domain</th>
                <th>(Parent) Project</th>
                <th></th>
              </tr>
            </thead>
            <tbody>
              {
                this.props.objects.items.map((item,index) =>
                  <SearchItem term={this.props.objects.searchTerm} item={item} key={index}/>
                )
              }

            </tbody>
          </table>
        }

<commit_msg>update description for search help<commit_after>import { Link } from 'react-router-dom'
import { SearchField } from 'lib/components/search_field';
import SearchItem from './search_item'
import { AjaxPaginate } from 'lib/components/ajax_paginate';
import { Pagination } from 'lib/components/pagination';

export default class Search extends React.Component {
  componentDidMount() {
    this.props.loadTypesOnce()
  }

  highlightSearchTerm = (string) => {
    if(!string) return
    const searchTerm = this.props.objects.searchTerm
    const searchType = this.props.objects.searchType

    if(!searchTerm || searchTerm.length==0) return string

    const index = string.indexOf(searchTerm)

    if(index<0) return string
    const length = searchTerm.length

    return (
      <React.Fragment>
        {string.substring(0, index) }
        <span className='highlight'>
          {string.substring(index,index+length)}
        </span>
        {string.substring(index + string.length)}
      </React.Fragment>
    )
  }

  render() {
    const availableTypes = this.props.types.items.sort()
    return (
      <React.Fragment>

        <div className="toolbar">
          { this.props.types.isFetching ?
            <span>
              <i className="spinner"></i>
              Loading Types...
            </span>
          :
            <select
              onChange={(e) => this.props.search({objectType: e.target.value})}
              value={this.props.objects.objectType}
            >
              <option value="">All</option>
              { availableTypes.map((type,index) =>
                <option value={type} key={index}>{type}</option>
              )}
            </select>
          }
          <span className="toolbar-input-divider"></span>
          <SearchField
            isFetching={this.props.objects.isFetching}
            onChange={(term) => this.props.search({term})}
            value={this.props.objects.searchTerm}
            placeholder='Object ID, name or description'
            text='Searches by ID, name or description.'
          />
          {this.props.objects.total > 0 &&
            <React.Fragment>
              <span className="toolbar-input-divider"></span>
              total: {this.props.objects.total}
            </React.Fragment>
          }
        </div>
        { this.props.objects.items && this.props.objects.items.length > 0 &&
          <table className="table">
            <thead>
              <tr>
                <th>Type</th>
                <th>Name/ID</th>
                <th>Domain</th>
                <th>(Parent) Project</th>
                <th></th>
              </tr>
            </thead>
            <tbody>
              {
                this.props.objects.items.map((item,index) =>
                  <SearchItem term={this.props.objects.searchTerm} item={item} key={index}/>
                )
              }

            </tbody>
          </table>
        }


{'fraction_non_alphanumeric': 0.1273761169780666, 'fraction_numerical': 0.0016246953696181965, 'mean_word_length': 1.7384341637010676, 'pattern_counts': {'":': 0, '<': 91, '<?xml version=': 0, '>': 103, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4043138', 'n_tokens_mistral': 1673, 'n_tokens_neox': 1636, 'n_words': 321}