<commit_before>/* eslint-disable */
const React = require('react')
const Uppy = require('uppy/lib/core')
const Tus = require('uppy/lib/plugins/Tus')
const GoogleDrive = require('uppy/lib/plugins/GoogleDrive')
const { Dashboard, DashboardModal, DragDrop, ProgressBar } = require('uppy/lib/react')

module.exports = class App extends React.Component {
  constructor (props) {
    super(props)

    this.state = {
      showInlineDashboard: false,
      open: false
    }

    this.handleModalClick = this.handleModalClick.bind(this)
  }

  componentWillMount () {
    this.uppy = new Uppy({ autoProceed: false })
      .use(Tus, { endpoint: 'https://master.tus.io/files/' })
      .use(GoogleDrive, { host: 'https://server.uppy.io' })
      .run()

    this.uppy2 = new Uppy({ autoProceed: false })
      .use(Tus, { endpoint: 'https://master.tus.io/files/' })
      .run()
  }

  componentWillUnmount () {
    this.uppy.close()
    this.uppy2.close()
  }

  handleModalClick () {
    this.setState({
      open: !this.state.open
    })
  }

  render () {
    const { showInlineDashboard } = this.state
    return (
      <div>
        <h1>React Examples</h1>

        <h2>Inline Dashboard</h2>
        <label>
          <input
            type="checkbox"
            checked={showInlineDashboard}
            onChange={(event) => {
              this.setState({
                showInlineDashboard: event.target.checked
              })
            }}
          />
          Show Dashboard
        </label>
        {showInlineDashboard && (
          <Dashboard
            uppy={this.uppy}
            plugins={['GoogleDrive']}
          />
        )}

        <h2>Modal Dashboard</h2><commit_msg>examples: Add metaFields to inline React example.<commit_after>/* eslint-disable */
const React = require('react')
const Uppy = require('uppy/lib/core')
const Tus = require('uppy/lib/plugins/Tus')
const GoogleDrive = require('uppy/lib/plugins/GoogleDrive')
const { Dashboard, DashboardModal, DragDrop, ProgressBar } = require('uppy/lib/react')

module.exports = class App extends React.Component {
  constructor (props) {
    super(props)

    this.state = {
      showInlineDashboard: false,
      open: false
    }

    this.handleModalClick = this.handleModalClick.bind(this)
  }

  componentWillMount () {
    this.uppy = new Uppy({ autoProceed: false })
      .use(Tus, { endpoint: 'https://master.tus.io/files/' })
      .use(GoogleDrive, { host: 'https://server.uppy.io' })
      .run()

    this.uppy2 = new Uppy({ autoProceed: false })
      .use(Tus, { endpoint: 'https://master.tus.io/files/' })
      .run()
  }

  componentWillUnmount () {
    this.uppy.close()
    this.uppy2.close()
  }

  handleModalClick () {
    this.setState({
      open: !this.state.open
    })
  }

  render () {
    const { showInlineDashboard } = this.state
    return (
      <div>
        <h1>React Examples</h1>

        <h2>Inline Dashboard</h2>
        <label>
          <input
            type="checkbox"
            checked={showInlineDashboard}
            onChange={(event) => {
              this.setState({
                showInlineDashboard: event.target.checked
              })
            }}
          />
          Show Dashboard
        </label>
        {showInlineDashboard && (
          <Dashboard
            uppy={this.uppy}
            plugins={['GoogleDrive']}
            metaFields={[
              { id: 'name', name: 'Name', placeholder: 'File name' }
            ]}
          />
        )}

        <h2>Modal Dashboard</h2>
{'fraction_non_alphanumeric': 0.1423728813559322, 'fraction_numerical': 0.004519774011299435, 'mean_word_length': 2.0447119518486674, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 27, 'https://': 6, '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': '4599650', 'n_tokens_mistral': 1125, 'n_tokens_neox': 1116, 'n_words': 195}