<commit_before>import cn from 'classnames';
import React from 'react';
import { Route } from 'react-router';

import Icon from './Icon';
import NavigationSlider from './NavigationSlider';
import Search from './Search';

export default class AppHeader extends React.PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      translucent: false,
      open: false,
    };
  }

  componentDidMount() {
    window.addEventListener('scroll', () => {
      const translucent = document.body.scrollTop > 5;
      if (this.state.translucent !== translucent) {
        this.setState({
          translucent
        });
      }
    });
  }

  handleNavigationSliderToggle = () => {
    this.setState({
      open: !this.state.open,
    });
  }

  handleNavigationSliderHide = () => {
    this.setState({
      open: false
    });
  }

  render() {
    const className = cn('mb-app-header', { translucent: this.state.translucent });

    return (
      <header className={className}>
        <div className="header-left">
          <div className="header-icons">
            <Icon
              className="nav-show-btn"
              iconName="three-bars"
              onClick={this.handleNavigationSliderToggle}
            />
            <div className="mb-logo" />
          </div>
          <div
            className={cn('background', { active: this.state.open })}
            onClick={() => this.handleNavigationSliderHide()}
          />
          <Route path="*" render={(props) => <NavigationSlider {...props} open={this.state.open} toggle={this.handleNavigationSliderToggle} />} />
        </div>
        <Search className="mb-header-search" placeholder="搜索" />
      </header>
    );
  }
}<commit_msg>Update header<commit_after>import cn from 'classnames';
import React from 'react';
import { Route } from 'react-router';

import Icon from './Icon';
import NavigationSlider from './NavigationSlider';
import Search from './Search';

export default class AppHeader extends React.PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      translucent: false,
      open: false,
    };
  }

  componentDidMount() {
    window.addEventListener('scroll', () => {
      const translucent = document.body.scrollTop > 5;
      if (this.state.translucent !== translucent) {
        this.setState({
          translucent
        });
      }
    });
  }

  handleNavigationSliderToggle = () => {
    this.setState({
      open: !this.state.open,
    });
  }

  handleNavigationSliderHide = () => {
    this.setState({
      open: false
    });
  }

  renderSlider = (props) => {
    return (
      <NavigationSlider {...props} open={this.state.open} toggle={this.handleNavigationSliderToggle} />
    );
  }

  render() {
    const className = cn('mb-app-header', { translucent: this.state.translucent });

    return (
      <header className={className}>
        <div className="header-left">
          <div className="header-icons">
            <Icon
              className="nav-show-btn"
              iconName="three-bars"
              onClick={this.handleNavigationSliderToggle}
            />
            <div className="mb-logo" />
          </div>
          <div
            className={cn('background', { active: this.state.open })}
            onClick={() => this.handleNavigationSliderHide()}
          />
          <Route path="*" render={this.renderSlider} />
        </div>
        <Search className="mb-header-search" placeholder="搜索" />
      </header>
    );
  }
}
{'fraction_non_alphanumeric': 0.14752700397953383, 'fraction_numerical': 0.0005685048322910744, 'mean_word_length': 2.264378478664193, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 39, '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': '2246478', 'n_tokens_mistral': 991, 'n_tokens_neox': 1006, 'n_words': 192}