Reorganizing components into directories

src/components/Header/__snapshots__/test.js.snap

@@ -0,0 +1,30 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Header rendering 1`] = `
+<header
+  data-banner="testing"
+  id="main"
+>
+  <h1>
+    <a
+      href="/"
+    >
+      Regexper
+    </a>
+  </h1>
+  <ul
+    className="inline"
+  >
+    <li>
+      <a
+        href="https://github.com/javallone/regexper-static"
+      >
+        <Component />
+        <Trans>
+          Source on GitHub
+        </Trans>
+      </a>
+    </li>
+  </ul>
+</header>
+`;

src/components/Header/index.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { translate, Trans } from 'react-i18next';
+
+import GithubIcon from 'feather-icons/dist/icons/github.svg';
+
+const Header = () => (
+  <header id="main" data-banner={ process.env.BANNER }>
+    <h1>
+      <a href="/">Regexper</a>
+    </h1>
+
+    <ul className="inline">
+      <li><a href="https://github.com/javallone/regexper-static">
+        <GithubIcon/><Trans>Source on GitHub</Trans>
+      </a></li>
+    </ul>
+  </header>
+);
+
+export default translate()(Header);
+export { Header };

src/components/Header/test.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import { Header } from './index';
+
+const env = { ...process.env };
+
+afterEach(() => {
+  process.env = env;
+});
+
+beforeEach(() => {
+  process.env = {
+    ...process.env,
+    BANNER: 'testing'
+  };
+});
+
+test('Header rendering', () => {
+  const component = shallow(
+    <Header>
+      <p>Content</p>
+    </Header>
+  );
+  expect(component).toMatchSnapshot();
+});