<commit_before>import React from 'react';
import ReactDOM from 'react-dom';

import SearchBar from './components/search_bar';

const API_KEY = '<KEY>';
// Create a new component. This component should produce html
const App = () => {
  return (
    <div>
      <SearchBar />
    </div>
  );
}
// take this component's generated html and put in on the page/in the DOM
ReactDOM.render(<App />, document.querySelector('.container'));<commit_msg>yt search in constructor<commit_after>import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import YTSearch from 'youtube-api-search';
import SearchBar from './components/search_bar';
const API_KEY = '<KEY>';

class App extends Component {
  constructor(props) {
    super(props);

    this.state = { videos: [] };

    YTSearch({key: API_KEY, term: 'surfboards'}, (videos) =>{
      this.setState({
        videos
      })
    });
  }

  render() {
      return (
      <div>
        <SearchBar />
      </div>
    )
  };
}

ReactDOM.render(<App />, document.querySelector('.container'));
{'fraction_non_alphanumeric': 0.150997150997151, 'fraction_numerical': 0.0, 'mean_word_length': 3.216, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 15, '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': '3250180', 'n_tokens_mistral': 320, 'n_tokens_neox': 318, 'n_words': 89}