diff --git a/src/components/Header/index.js b/src/components/Header/index.js
index 651598d..7633dbb 100644
--- a/src/components/Header/index.js
+++ b/src/components/Header/index.js
@@ -1,8 +1,8 @@
-import React from 'react';
+import React, { useState, useCallback } from 'react';
import PropTypes from 'prop-types';
import Modal from 'react-modal';
import { Link } from 'gatsby';
-import { withTranslation, Trans } from 'react-i18next';
+import { Trans } from 'react-i18next';
import GitlabIcon from 'react-feather/dist/icons/gitlab';
@@ -12,76 +12,66 @@ import PrivacyPolicy from 'components/PrivacyPolicy';
import style from './style.module.css';
-class Header extends React.PureComponent {
- state = {
- showModal: false
- }
-
- static propTypes = {
- banner: PropTypes.oneOfType([
- PropTypes.bool,
- PropTypes.string
- ]).isRequired
- }
-
- handleOpen = event => {
+const Header = ({ banner }) => {
+ const [ showModal, updateShowModal] = useState(false);
+ const handleClose = useCallback(() => {
+ updateShowModal(false);
+ }, [updateShowModal]);
+ const handleOpen = useCallback(event => {
if (event.shiftKey || event.ctrlKey || event.altKey || event.metaKey) {
return;
}
event.preventDefault();
- this.setState({ showModal: true });
- }
+ updateShowModal(true);
+ }, [updateShowModal]);
- handleClose = () => {
- this.setState({ showModal: false });
- }
+ return <>
+
+
+
+
+
+ Regexper
+
- render() {
- const { banner } = this.props;
- const { showModal } = this.state;
+
+
+ >;
+};
- return <>
-
-
-
-
-
- Regexper
-
+Header.propTypes = {
+ banner: PropTypes.oneOfType([
+ PropTypes.bool,
+ PropTypes.string
+ ]).isRequired
+};
-
-
- >;
- }
-}
-
-export { Header };
-export default withTranslation()(Header);
+export default Header;
diff --git a/src/components/Header/test.js b/src/components/Header/test.js
index 00ebf38..bfebf6d 100644
--- a/src/components/Header/test.js
+++ b/src/components/Header/test.js
@@ -12,7 +12,7 @@ jest.mock('components/PrivacyPolicy', () =>
import React from 'react';
import { render, fireEvent } from 'react-testing-library';
-import { Header } from 'components/Header';
+import Header from 'components/Header';
describe('Header', () => {
test('rendering', () => {
diff --git a/src/components/Layout/__snapshots__/test.js.snap b/src/components/Layout/__snapshots__/test.js.snap
index 18c462d..4b2b34a 100644
--- a/src/components/Layout/__snapshots__/test.js.snap
+++ b/src/components/Layout/__snapshots__/test.js.snap
@@ -8,7 +8,7 @@ exports[`Layout rendering 1`] = `
>