<commit_before>import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { settings } from './settings';
import { Router, Route, browserHistory } from 'react-router';
import { Dashboard } from '../src/ReactDashboard';

// We extend the Dashboard so we can pass Routing info from the App
class MyDashboard extends Component {
  render() {
    let z = {};
    z.appliedFilters = (this.state) ? this.state.appliedFiltersi : {};
    const props = Object.assign({}, this.props, z, settings);
    return <Dashboard {...props}/>
  }
}

// Wrap Dashboard component in router
class App extends Component {
  render() {
    return (
      <div id="router-container">
        <Router history={browserHistory}>
          <Route path='/' component={MyDashboard} />
          <Route path='/react-dashboard' component={MyDashboard} />
        </Router>
      </div>
    )
  }
}

// Now put it in the DOM!
document.addEventListener('DOMContentLoaded', function(event) {
  ReactDOM.render(<App/>, document.getElementById('root'));
});<commit_msg>This loads a settings object from a gist - gist is a json string - and loads a chart<commit_after>import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { settings } from './settings';
import { Router, Route, browserHistory } from 'react-router';
import { Dashboard } from '../src/ReactDashboard';

let _settings = settings;
let url = 'https://gist.githubusercontent.com/starsinmypockets/f6395260c464b4ab49ed552532020c27/raw';

// We extend the Dashboard so we can pass Routing info from the App
class MyDashboard extends Component {
  render() {
    let z = {};
    z.appliedFilters = (this.state) ? this.state.appliedFiltersi : {};
    const props = Object.assign({}, this.props, z, _settings);
    return <Dashboard {...props}/>
  }
}

// Wrap Dashboard component in router
class App extends Component {
  render() {
    return (
      <div id="router-container">
        <Router history={browserHistory}>
          <Route path='/' component={MyDashboard} />
          <Route path='/react-dashboard' component={MyDashboard} />
        </Router>
      </div>
    )
  }
}

// Now put it in the DOM!
document.addEventListener('DOMContentLoaded', function(event) {
  console.log('DOM -0'); 
  fetch(url).then(res => {
    return res.json();
  }).then(json => {
    console.log("GIST", json);
    // now fetch functions
    _settings = json;
    ReactDOM.render(<App/>, document.getElementById('root'));
  });
});
{'fraction_non_alphanumeric': 0.14640994785399117, 'fraction_numerical': 0.010028078620136383, 'mean_word_length': 3.36013986013986, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 21, 'https://': 1, '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': '7080809', 'n_tokens_mistral': 750, 'n_tokens_neox': 747, 'n_words': 211}