<commit_before>import React from 'react'
import styled from 'styled-components'

import AvatarName from '../avatarName'
import { viewerName } from '../viewerInfo'

const Main = styled.div`
  background-color: rgb(77, 80, 85);
  color: rgb(255, 255, 255);
  border-radius: 1em;
  padding: 0.8em;
  max-width: 30em;
  margin-top: 2em;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
`

const ViewerNameCapitalizer = styled.span`
  text-transform: capitalize;
`

const ErrorOut = styled.p`
  background-color: rgb(255, 0, 0);
  border-radius: 0.3em;
  margin-top: 0.3em;
  padding: 0.3em;
  display: ${props => props.show ? '' : 'none'};
`

const SavedAvatarsList = styled.div`
  display: flex;
  flex-direction: row;
  justify-content: center;
`

const SavedAvatarLogin = styled.div`
  display: flex;
  flex-direction: column;
  padding: .5em;
  padding-top: 0px;
  margin: .3em;
  border: 1px solid rgb(90, 95, 105);
  border-radius: .3em;
`

// Show the name of the Viewer
document.title = viewerName

export default class LoginForm extends React.Component {
  constructor () {
    super()
    this.state = {<commit_msg>refactor(login): remove old way to set the title<commit_after>import React from 'react'
import styled from 'styled-components'

import AvatarName from '../avatarName'
import { viewerName } from '../viewerInfo'

const Main = styled.div`
  background-color: rgb(77, 80, 85);
  color: rgb(255, 255, 255);
  border-radius: 1em;
  padding: 0.8em;
  max-width: 30em;
  margin-top: 2em;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
`

const ViewerNameCapitalizer = styled.span`
  text-transform: capitalize;
`

const ErrorOut = styled.p`
  background-color: rgb(255, 0, 0);
  border-radius: 0.3em;
  margin-top: 0.3em;
  padding: 0.3em;
  display: ${props => props.show ? '' : 'none'};
`

const SavedAvatarsList = styled.div`
  display: flex;
  flex-direction: row;
  justify-content: center;
`

const SavedAvatarLogin = styled.div`
  display: flex;
  flex-direction: column;
  padding: .5em;
  padding-top: 0px;
  margin: .3em;
  border: 1px solid rgb(90, 95, 105);
  border-radius: .3em;
`

export default class LoginForm extends React.Component {
  constructor () {
    super()
    this.state = {
{'fraction_non_alphanumeric': 0.1366167023554604, 'fraction_numerical': 0.037687366167023555, 'mean_word_length': 3.7287449392712553, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, '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': '6683552', 'n_tokens_mistral': 912, 'n_tokens_neox': 836, 'n_words': 227}