{"size": 1552, "ext": "js", "max_stars_repo_path": "source/components/SearchButton.js", "max_stars_repo_name": "revolunet/syso", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "source/components/SearchButton.js", "max_issues_repo_name": "revolunet/syso", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "source/components/SearchButton.js", "max_forks_repo_name": "revolunet/syso", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 25.8666666667, "max_line_length": 68, "alphanum_fraction": 0.6636597938}
import { compose } from 'ramda'
import React, { Component } from 'react'
import emoji from 'react-easy-emoji'
import { Trans, withTranslation } from 'react-i18next'
import { connect } from 'react-redux'
import { flatRulesSelector } from 'Selectors/analyseSelectors'
import Overlay from './Overlay'
import SearchBar from './SearchBar'

export default compose(
	connect(state => ({
		flatRules: flatRulesSelector(state)
	})),
	withTranslation()
)(
	class SearchButton extends Component {
		componentDidMount() {
			// removeEventListener will need the exact same function instance
			this.boundHandleKeyDown = this.handleKeyDown.bind(this)

			window.addEventListener('keydown', this.boundHandleKeyDown)
		}
		handleKeyDown(e) {
			if (!(e.ctrlKey && e.key === 'k')) return
			this.setState({ visible: true })
			e.preventDefault()
			e.stopPropagation()
			return false
		}
		componentWillUnmount() {
			window.removeEventListener('keydown', this.boundHandleKeyDown)
		}
		state = {
			visible: false
		}
		close = () => this.setState({ visible: false })
		render() {
			let { flatRules } = this.props
			return this.state.visible ? (
				<Overlay onClose={this.close}>
					<h2>
						<Trans>Chercher dans la documentation</Trans>
					</h2>
					<SearchBar
						showDefaultList={false}
						finally={this.close}
						rules={flatRules}
					/>
				</Overlay>
			) : (
				<button
					className="ui__ simple small button"
					onClick={() => this.setState({ visible: true })}>
					{emoji('🔍')} <Trans>Rechercher</Trans>
				</button>
			)
		}
	}
)
