<commit_before>import React, {Component} from 'react'
import NoMatches from './components/NoMatches'
import ProfileHeader from './components/ProfileHeader';
import MatchesList from './components/MatchesList'
import muiThemeable from 'material-ui/styles/muiThemeable'
import styled from 'styled-components'
import {graphql} from 'react-apollo'
import {observable, action} from 'mobx'
import {observer} from 'mobx-react'
import RoutedSection from './components/RoutedSection'
import checkDoMatchesExist from './checkMutation.graphql'
import startSubscription from './subscribeMutation.graphql'


const MainContainer = styled.div`
	display: flex;
	flex-direction: row;
	position: relative;
	height: 100vh;
	max-height: 100vh;
	min-height: 100vh;
`;

function BaseSection(el) {
	return (
		el`
			height: 100vh;
			max-height: 100vh;
			position: relative;
			display: flex;
			flex-direction: column;
			overflow-x: hidden;
			&::-webkit-scrollbar {
				display: none;
			}
		`
	)
}

const MatchesSection = styled(BaseSection(styled.aside))`
	background-color: ${props => props.theme.palette.canvasColor}
	border-right: 1px solid ${props => props.theme.palette.borderColor};
	width: 270px;
	min-width: 270px;
`;

@graphql(checkDoMatchesExist, {name: 'check'})
@graphql(startSubscription, {name: 'subscribe'})
@muiThemeable()
@observer
class Main extends Component {
	@observable shouldShowContent = undefined;

	@action changeStatus = (status) => {
		this.shouldShowContent = status;
	}

	async componentDidMount() {
		const status = await this.props.check();
		if (status) {
			this.props.subscribe();
		}
		this.changeStatus(status);
	}

	renderChildren = () => {
		const {muiTheme} = this.props;
		
		if (typeof this.shouldShowContent === 'undefined') {
			return <span>Loading...</span>
		}

		if (!this.shouldShowContent) {
			return <NoMatches/>
		} else {
			return [
				<MatchesSection theme={muiTheme} key="matches">
					<ProfileHeader/>
					<MatchesList/>
				</MatchesSection>,
				<RoutedSection key="routed"/>
			]
		}
	}

	render() {
		return (
			<MainContainer theme={this.props.muiTheme}><commit_msg>Substituded primitive loader with circular<commit_after>import React, {Component} from 'react'
import NoMatches from './components/NoMatches'
import ProfileHeader from './components/ProfileHeader';
import MatchesList from './components/MatchesList'
import muiThemeable from 'material-ui/styles/muiThemeable'
import styled from 'styled-components'
import {graphql} from 'react-apollo'
import {observable, action} from 'mobx'
import {observer} from 'mobx-react'
import RoutedSection from './components/RoutedSection'
import checkDoMatchesExist from './checkMutation.graphql'
import startSubscription from './subscribeMutation.graphql'
import LoadingStub from 'app/components/LoadingStub'


const MainContainer = styled.div`
	display: flex;
	flex-direction: row;
	position: relative;
	height: 100vh;
	max-height: 100vh;
	min-height: 100vh;
`;

function BaseSection(el) {
	return (
		el`
			height: 100vh;
			max-height: 100vh;
			position: relative;
			display: flex;
			flex-direction: column;
			overflow-x: hidden;
			&::-webkit-scrollbar {
				display: none;
			}
		`
	)
}

const MatchesSection = styled(BaseSection(styled.aside))`
	background-color: ${props => props.theme.palette.canvasColor}
	border-right: 1px solid ${props => props.theme.palette.borderColor};
	width: 270px;
	min-width: 270px;
`;

@graphql(checkDoMatchesExist, {name: 'check'})
@graphql(startSubscription, {name: 'subscribe'})
@muiThemeable()
@observer
class Main extends Component {
	@observable shouldShowContent = undefined;

	@action changeStatus = (status) => {
		this.shouldShowContent = status;
	}

	async componentDidMount() {
		const status = await this.props.check();
		if (status) {
			this.props.subscribe();
		}
		this.changeStatus(status);
	}

	renderChildren = () => {
		const {muiTheme} = this.props;
		
		if (typeof this.shouldShowContent === 'undefined') {
			return <LoadingStub size={40}/>
		}

		if (!this.shouldShowContent) {
			return <NoMatches/>
		} else {
			return [
				<MatchesSection theme={muiTheme} key="matches">
					<ProfileHeader/>
					<MatchesList/>
				</MatchesSection>,
				<RoutedSection key="routed"/>
			]
		}
	}

	render() {
		return (
			<MainContainer theme={this.props.muiTheme}>
{'fraction_non_alphanumeric': 0.13342599027102153, 'fraction_numerical': 0.010655547834144082, 'mean_word_length': 4.47275031685678, 'pattern_counts': {'":': 0, '<': 20, '<?xml version=': 0, '>': 28, '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': '5923976', 'n_tokens_mistral': 1602, 'n_tokens_neox': 1394, 'n_words': 322}