<commit_before>import { Link } from 'react-router-dom';
import { DefeatableLink } from 'lib/components/defeatable_link';
import { SearchField } from 'lib/components/search_field';
import SecurityGroupItem from './item';
import { AjaxPaginate } from 'lib/components/ajax_paginate';

export default class List extends React.Component {
  componentWillReceiveProps(nextProps) {
    // load dependencies unless already loaded
    this.loadDependencies(nextProps)
  }

  componentDidMount() {
    // load dependencies unless already loaded
    this.loadDependencies(this.props)
  }

  loadDependencies = (props) => {
    props.loadSecurityGroupsOnce()
  }

  filterItems = () => {
    return this.props.securityGroups.items || []
  }


  render() {
    if(!policy.isAllowed("networking:security_group_list")) {
      return <span>You are not allowed to see this page</span>
    }

    const items = this.filterItems()
    const {isFetching,hasNext,loadNext} = this.props.securityGroups

    return (
      <React.Fragment>
        <div className='toolbar'>
          <SearchField
            onChange={(term) => console.log('search for',term)}
            placeholder='ID, name or description'
            text='Searches by ID, name or description in visible security group 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.'/>

          <div className="main-buttons">
            {policy.isAllowed("networking:security_group_create") &&
              <DefeatableLink
                to='/new'
                className='btn btn-primary'>
                New Security Group
              </DefeatableLink>
            }
          </div>
        </div>

        <table className='table shares'>
          <thead><commit_msg>networking#security_groups: fix bug in search fiels<commit_after>import { Link } from 'react-router-dom';
import { DefeatableLink } from 'lib/components/defeatable_link';
import { SearchField } from 'lib/components/search_field';
import SecurityGroupItem from './item';
import { AjaxPaginate } from 'lib/components/ajax_paginate';

export default class List extends React.Component {
  state = {searchTerm: ''}

  componentWillReceiveProps(nextProps) {
    // load dependencies unless already loaded
    this.loadDependencies(nextProps)
  }

  componentDidMount() {
    // load dependencies unless already loaded
    this.loadDependencies(this.props)
  }

  loadDependencies = (props) => {
    props.loadSecurityGroupsOnce()
  }

  filterItems = () => {
    let items = this.props.securityGroups.items || []

    if(this.state.searchTerm && this.state.searchTerm.replace(/\s/g, '').length>0) {
      const regex = new RegExp(this.state.searchTerm.trim(), "i");

      items = items.filter(i =>
        `${i.id} ${i.name} ${i.description} `.search(regex) >= 0
      )
    }
    return items
  }


  render() {
    if(!policy.isAllowed("networking:security_group_list")) {
      return <span>You are not allowed to see this page</span>
    }

    const items = this.filterItems()
    const {isFetching,hasNext,loadNext} = this.props.securityGroups

    return (
      <React.Fragment>
        <div className='toolbar'>
          {this.props.securityGroups.items && this.props.securityGroups.items.length>=10 &&
            <SearchField
              onChange={(term) => this.setState({searchTerm: term})}
              placeholder='ID, name or description'
              text='Searches by ID, name or description in visible security group 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.'/>
          }

          <div className="main-buttons">
            {policy.isAllowed("networking:security_group_create") &&
              <DefeatableLink
                to='/new'
                className='btn btn-primary'>
                New Security Group
              </DefeatableLink>
            }
          </div>
        </div>

        <table className='table shares'>
          <thead>
{'fraction_non_alphanumeric': 0.10638297872340426, 'fraction_numerical': 0.0009250693802035153, 'mean_word_length': 2.496362166531932, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 37, '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': '1698736', 'n_tokens_mistral': 1159, 'n_tokens_neox': 1125, 'n_words': 296}