1
0
Fork 0
mirror of https://github.com/betagouv/mon-entreprise synced 2025-02-09 02:55:01 +00:00
mon-entreprise/source/components/SearchButton.js
Johan Girod cb1bdb2b5b 🐎 Le build par défaut est conçu pour les navigateurs récents
On compile maintenant pour les navigateurs récents (qui supportent les modules es6.
On ajoute une config de build pour les browser legacy (ie11).

Cela permet :
- De ne plus être dépendant de polyfill.io (qui nous a claqué dans les doigts et a peté la prod)
- D'avoir un JS transpilé plus léger et plus proche du code écrit pour les navigateurs récents
- De pouvoir ajuster le build en fonction du navigateur (on ajoute pas le serviceWorker dans IE par exemple. A l'inverse, on
pourrait multiplier le nombre de bundle pour tirer profit de HTTP2)
2019-03-21 19:57:38 +01:00

59 lines
1.5 KiB
JavaScript

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>
)
}
}
)