From 618b21bb937ad37ed75dae55d943b873516998c9 Mon Sep 17 00:00:00 2001
From: Jeff Avallone <jeff.avallone@gmail.com>
Date: Sun, 6 Jan 2019 13:03:07 -0500
Subject: [PATCH] Implementing translations

---
 .../Footer/__snapshots__/test.js.snap         | 419 +++++----
 src/components/Footer/index.js                |  16 +-
 src/components/Footer/test.js                 |   3 +-
 .../Header/__snapshots__/test.js.snap         | 224 ++++-
 src/components/Header/index.js                |  10 +-
 .../SentryError/__snapshots__/test.js.snap    | 170 ++--
 src/components/SentryError/index.js           |  20 +-
 src/components/SentryError/test.js            |   9 +-
 src/locales/en-AC.yaml                        |  43 +
 src/locales/en.yaml                           |  43 +
 src/pages/404.js                              |  16 +-
 src/pages/404.test.js                         |   5 +-
 src/pages/__snapshots__/404.test.js.snap      |  68 +-
 src/pages/__snapshots__/index.test.js.snap    |  42 +-
 src/pages/__snapshots__/privacy.test.js.snap  | 808 ++++++++++--------
 src/pages/index.js                            |   7 +-
 src/pages/index.test.js                       |   4 +-
 src/pages/privacy.js                          |  89 +-
 src/pages/privacy.test.js                     |   5 +-
 19 files changed, 1296 insertions(+), 705 deletions(-)

diff --git a/src/components/Footer/__snapshots__/test.js.snap b/src/components/Footer/__snapshots__/test.js.snap
index e2567a4..29293d3 100644
--- a/src/components/Footer/__snapshots__/test.js.snap
+++ b/src/components/Footer/__snapshots__/test.js.snap
@@ -11,6 +11,7 @@ ShallowWrapper {
         },
       }
     }
+    t={[Function]}
   />,
   Symbol(enzyme.__renderer__): Object {
     "batchedUpdates": [Function],
@@ -30,25 +31,29 @@ ShallowWrapper {
           className="list"
         >
           <li>
-            Created by 
-            <a
-              href="mailto:jeff.avallone@gmail.com"
-            >
-              Jeff Avallone
-            </a>
+            <WithMergedOptions(TransComponent)>
+              Created by 
+              <a
+                href="mailto:jeff.avallone@gmail.com"
+              >
+                Jeff Avallone
+              </a>
+            </WithMergedOptions(TransComponent)>
           </li>
           <li>
-            Generated images licensed: 
-            <a
-              href="http://creativecommons.org/licenses/by/3.0/"
-              rel="license external noopener noreferrer"
-              target="_blank"
-            >
-              <img
-                alt="Creative Commons CC-BY-3.0 License"
-                src="https://licensebuttons.net/l/by/3.0/80x15.png"
-              />
-            </a>
+            <WithMergedOptions(TransComponent)>
+              Generated images licensed: 
+              <a
+                href="http://creativecommons.org/licenses/by/3.0/"
+                rel="license external noopener noreferrer"
+                target="_blank"
+              >
+                <img
+                  alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                  src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                />
+              </a>
+            </WithMergedOptions(TransComponent)>
           </li>
         </ul>,
         <div
@@ -68,25 +73,29 @@ ShallowWrapper {
         "props": Object {
           "children": Array [
             <li>
-              Created by 
-              <a
-                href="mailto:jeff.avallone@gmail.com"
-              >
-                Jeff Avallone
-              </a>
+              <WithMergedOptions(TransComponent)>
+                Created by 
+                <a
+                  href="mailto:jeff.avallone@gmail.com"
+                >
+                  Jeff Avallone
+                </a>
+              </WithMergedOptions(TransComponent)>
             </li>,
             <li>
-              Generated images licensed: 
-              <a
-                href="http://creativecommons.org/licenses/by/3.0/"
-                rel="license external noopener noreferrer"
-                target="_blank"
-              >
-                <img
-                  alt="Creative Commons CC-BY-3.0 License"
-                  src="https://licensebuttons.net/l/by/3.0/80x15.png"
-                />
-              </a>
+              <WithMergedOptions(TransComponent)>
+                Generated images licensed: 
+                <a
+                  href="http://creativecommons.org/licenses/by/3.0/"
+                  rel="license external noopener noreferrer"
+                  target="_blank"
+                >
+                  <img
+                    alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                    src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                  />
+                </a>
+              </WithMergedOptions(TransComponent)>
             </li>,
           ],
           "className": "list",
@@ -98,31 +107,48 @@ ShallowWrapper {
             "key": undefined,
             "nodeType": "host",
             "props": Object {
-              "children": Array [
-                "Created by ",
+              "children": <WithMergedOptions(TransComponent)>
+                Created by 
                 <a
                   href="mailto:jeff.avallone@gmail.com"
                 >
                   Jeff Avallone
-                </a>,
-              ],
+                </a>
+              </WithMergedOptions(TransComponent)>,
             },
             "ref": null,
-            "rendered": Array [
-              "Created by ",
-              Object {
-                "instance": null,
-                "key": undefined,
-                "nodeType": "host",
-                "props": Object {
-                  "children": "Jeff Avallone",
-                  "href": "mailto:jeff.avallone@gmail.com",
-                },
-                "ref": null,
-                "rendered": "Jeff Avallone",
-                "type": "a",
+            "rendered": Object {
+              "instance": null,
+              "key": undefined,
+              "nodeType": "class",
+              "props": Object {
+                "children": Array [
+                  "Created by ",
+                  <a
+                    href="mailto:jeff.avallone@gmail.com"
+                  >
+                    Jeff Avallone
+                  </a>,
+                ],
               },
-            ],
+              "ref": null,
+              "rendered": Array [
+                "Created by ",
+                Object {
+                  "instance": null,
+                  "key": undefined,
+                  "nodeType": "host",
+                  "props": Object {
+                    "children": "Jeff Avallone",
+                    "href": "mailto:jeff.avallone@gmail.com",
+                  },
+                  "ref": null,
+                  "rendered": "Jeff Avallone",
+                  "type": "a",
+                },
+              ],
+              "type": [Function],
+            },
             "type": "li",
           },
           Object {
@@ -130,52 +156,74 @@ ShallowWrapper {
             "key": undefined,
             "nodeType": "host",
             "props": Object {
-              "children": Array [
-                "Generated images licensed: ",
+              "children": <WithMergedOptions(TransComponent)>
+                Generated images licensed: 
                 <a
                   href="http://creativecommons.org/licenses/by/3.0/"
                   rel="license external noopener noreferrer"
                   target="_blank"
                 >
                   <img
-                    alt="Creative Commons CC-BY-3.0 License"
+                    alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
                     src="https://licensebuttons.net/l/by/3.0/80x15.png"
                   />
-                </a>,
-              ],
+                </a>
+              </WithMergedOptions(TransComponent)>,
             },
             "ref": null,
-            "rendered": Array [
-              "Generated images licensed: ",
-              Object {
-                "instance": null,
-                "key": undefined,
-                "nodeType": "host",
-                "props": Object {
-                  "children": <img
-                    alt="Creative Commons CC-BY-3.0 License"
-                    src="https://licensebuttons.net/l/by/3.0/80x15.png"
-                  />,
-                  "href": "http://creativecommons.org/licenses/by/3.0/",
-                  "rel": "license external noopener noreferrer",
-                  "target": "_blank",
-                },
-                "ref": null,
-                "rendered": Object {
+            "rendered": Object {
+              "instance": null,
+              "key": undefined,
+              "nodeType": "class",
+              "props": Object {
+                "children": Array [
+                  "Generated images licensed: ",
+                  <a
+                    href="http://creativecommons.org/licenses/by/3.0/"
+                    rel="license external noopener noreferrer"
+                    target="_blank"
+                  >
+                    <img
+                      alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                      src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                    />
+                  </a>,
+                ],
+              },
+              "ref": null,
+              "rendered": Array [
+                "Generated images licensed: ",
+                Object {
                   "instance": null,
                   "key": undefined,
                   "nodeType": "host",
                   "props": Object {
-                    "alt": "Creative Commons CC-BY-3.0 License",
-                    "src": "https://licensebuttons.net/l/by/3.0/80x15.png",
+                    "children": <img
+                      alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                      src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                    />,
+                    "href": "http://creativecommons.org/licenses/by/3.0/",
+                    "rel": "license external noopener noreferrer",
+                    "target": "_blank",
                   },
                   "ref": null,
-                  "rendered": null,
-                  "type": "img",
+                  "rendered": Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "host",
+                    "props": Object {
+                      "alt": "TRANSLATE(Creative Commons CC-BY-3.0 License)",
+                      "src": "https://licensebuttons.net/l/by/3.0/80x15.png",
+                    },
+                    "ref": null,
+                    "rendered": null,
+                    "type": "img",
+                  },
+                  "type": "a",
                 },
-                "type": "a",
-              },
-            ],
+              ],
+              "type": [Function],
+            },
             "type": "li",
           },
         ],
@@ -207,25 +255,29 @@ ShallowWrapper {
             className="list"
           >
             <li>
-              Created by 
-              <a
-                href="mailto:jeff.avallone@gmail.com"
-              >
-                Jeff Avallone
-              </a>
+              <WithMergedOptions(TransComponent)>
+                Created by 
+                <a
+                  href="mailto:jeff.avallone@gmail.com"
+                >
+                  Jeff Avallone
+                </a>
+              </WithMergedOptions(TransComponent)>
             </li>
             <li>
-              Generated images licensed: 
-              <a
-                href="http://creativecommons.org/licenses/by/3.0/"
-                rel="license external noopener noreferrer"
-                target="_blank"
-              >
-                <img
-                  alt="Creative Commons CC-BY-3.0 License"
-                  src="https://licensebuttons.net/l/by/3.0/80x15.png"
-                />
-              </a>
+              <WithMergedOptions(TransComponent)>
+                Generated images licensed: 
+                <a
+                  href="http://creativecommons.org/licenses/by/3.0/"
+                  rel="license external noopener noreferrer"
+                  target="_blank"
+                >
+                  <img
+                    alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                    src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                  />
+                </a>
+              </WithMergedOptions(TransComponent)>
             </li>
           </ul>,
           <div
@@ -245,25 +297,29 @@ ShallowWrapper {
           "props": Object {
             "children": Array [
               <li>
-                Created by 
-                <a
-                  href="mailto:jeff.avallone@gmail.com"
-                >
-                  Jeff Avallone
-                </a>
+                <WithMergedOptions(TransComponent)>
+                  Created by 
+                  <a
+                    href="mailto:jeff.avallone@gmail.com"
+                  >
+                    Jeff Avallone
+                  </a>
+                </WithMergedOptions(TransComponent)>
               </li>,
               <li>
-                Generated images licensed: 
-                <a
-                  href="http://creativecommons.org/licenses/by/3.0/"
-                  rel="license external noopener noreferrer"
-                  target="_blank"
-                >
-                  <img
-                    alt="Creative Commons CC-BY-3.0 License"
-                    src="https://licensebuttons.net/l/by/3.0/80x15.png"
-                  />
-                </a>
+                <WithMergedOptions(TransComponent)>
+                  Generated images licensed: 
+                  <a
+                    href="http://creativecommons.org/licenses/by/3.0/"
+                    rel="license external noopener noreferrer"
+                    target="_blank"
+                  >
+                    <img
+                      alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                      src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                    />
+                  </a>
+                </WithMergedOptions(TransComponent)>
               </li>,
             ],
             "className": "list",
@@ -275,31 +331,48 @@ ShallowWrapper {
               "key": undefined,
               "nodeType": "host",
               "props": Object {
-                "children": Array [
-                  "Created by ",
+                "children": <WithMergedOptions(TransComponent)>
+                  Created by 
                   <a
                     href="mailto:jeff.avallone@gmail.com"
                   >
                     Jeff Avallone
-                  </a>,
-                ],
+                  </a>
+                </WithMergedOptions(TransComponent)>,
               },
               "ref": null,
-              "rendered": Array [
-                "Created by ",
-                Object {
-                  "instance": null,
-                  "key": undefined,
-                  "nodeType": "host",
-                  "props": Object {
-                    "children": "Jeff Avallone",
-                    "href": "mailto:jeff.avallone@gmail.com",
-                  },
-                  "ref": null,
-                  "rendered": "Jeff Avallone",
-                  "type": "a",
+              "rendered": Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "class",
+                "props": Object {
+                  "children": Array [
+                    "Created by ",
+                    <a
+                      href="mailto:jeff.avallone@gmail.com"
+                    >
+                      Jeff Avallone
+                    </a>,
+                  ],
                 },
-              ],
+                "ref": null,
+                "rendered": Array [
+                  "Created by ",
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "host",
+                    "props": Object {
+                      "children": "Jeff Avallone",
+                      "href": "mailto:jeff.avallone@gmail.com",
+                    },
+                    "ref": null,
+                    "rendered": "Jeff Avallone",
+                    "type": "a",
+                  },
+                ],
+                "type": [Function],
+              },
               "type": "li",
             },
             Object {
@@ -307,52 +380,74 @@ ShallowWrapper {
               "key": undefined,
               "nodeType": "host",
               "props": Object {
-                "children": Array [
-                  "Generated images licensed: ",
+                "children": <WithMergedOptions(TransComponent)>
+                  Generated images licensed: 
                   <a
                     href="http://creativecommons.org/licenses/by/3.0/"
                     rel="license external noopener noreferrer"
                     target="_blank"
                   >
                     <img
-                      alt="Creative Commons CC-BY-3.0 License"
+                      alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
                       src="https://licensebuttons.net/l/by/3.0/80x15.png"
                     />
-                  </a>,
-                ],
+                  </a>
+                </WithMergedOptions(TransComponent)>,
               },
               "ref": null,
-              "rendered": Array [
-                "Generated images licensed: ",
-                Object {
-                  "instance": null,
-                  "key": undefined,
-                  "nodeType": "host",
-                  "props": Object {
-                    "children": <img
-                      alt="Creative Commons CC-BY-3.0 License"
-                      src="https://licensebuttons.net/l/by/3.0/80x15.png"
-                    />,
-                    "href": "http://creativecommons.org/licenses/by/3.0/",
-                    "rel": "license external noopener noreferrer",
-                    "target": "_blank",
-                  },
-                  "ref": null,
-                  "rendered": Object {
+              "rendered": Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "class",
+                "props": Object {
+                  "children": Array [
+                    "Generated images licensed: ",
+                    <a
+                      href="http://creativecommons.org/licenses/by/3.0/"
+                      rel="license external noopener noreferrer"
+                      target="_blank"
+                    >
+                      <img
+                        alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                        src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                      />
+                    </a>,
+                  ],
+                },
+                "ref": null,
+                "rendered": Array [
+                  "Generated images licensed: ",
+                  Object {
                     "instance": null,
                     "key": undefined,
                     "nodeType": "host",
                     "props": Object {
-                      "alt": "Creative Commons CC-BY-3.0 License",
-                      "src": "https://licensebuttons.net/l/by/3.0/80x15.png",
+                      "children": <img
+                        alt="TRANSLATE(Creative Commons CC-BY-3.0 License)"
+                        src="https://licensebuttons.net/l/by/3.0/80x15.png"
+                      />,
+                      "href": "http://creativecommons.org/licenses/by/3.0/",
+                      "rel": "license external noopener noreferrer",
+                      "target": "_blank",
                     },
                     "ref": null,
-                    "rendered": null,
-                    "type": "img",
+                    "rendered": Object {
+                      "instance": null,
+                      "key": undefined,
+                      "nodeType": "host",
+                      "props": Object {
+                        "alt": "TRANSLATE(Creative Commons CC-BY-3.0 License)",
+                        "src": "https://licensebuttons.net/l/by/3.0/80x15.png",
+                      },
+                      "ref": null,
+                      "rendered": null,
+                      "type": "img",
+                    },
+                    "type": "a",
                   },
-                  "type": "a",
-                },
-              ],
+                ],
+                "type": [Function],
+              },
               "type": "li",
             },
           ],
diff --git a/src/components/Footer/index.js b/src/components/Footer/index.js
index a0ef4c1..d64abb9 100644
--- a/src/components/Footer/index.js
+++ b/src/components/Footer/index.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { StaticQuery, graphql } from 'gatsby';
+import { withNamespaces, Trans } from 'react-i18next';
 
 import style from './style.module.css';
 
@@ -14,20 +15,21 @@ const query = graphql`
   }
 `;
 
-export const FooterImpl = ({ site: { siteMetadata } }) => (
+export const FooterImpl = ({ t, site: { siteMetadata } }) => (
   <footer className={ style.footer }>
     <ul className={ style.list }>
       <li>
-        Created by <a href="mailto:jeff.avallone@gmail.com">Jeff Avallone</a>
+        <Trans>Created by <a
+          href="mailto:jeff.avallone@gmail.com">Jeff Avallone</a></Trans>
       </li>
       <li>
-        Generated images licensed: <a
+        <Trans>Generated images licensed: <a
           href="http://creativecommons.org/licenses/by/3.0/"
           rel="license external noopener noreferrer"
           target="_blank">
           <img src="https://licensebuttons.net/l/by/3.0/80x15.png"
-            alt="Creative Commons CC-BY-3.0 License" />
-        </a>
+            alt={ t('Creative Commons CC-BY-3.0 License') } />
+        </a></Trans>
       </li>
     </ul>
     <div className={ style.buildId }>
@@ -37,6 +39,7 @@ export const FooterImpl = ({ site: { siteMetadata } }) => (
 );
 
 FooterImpl.propTypes = {
+  t: PropTypes.func.isRequired,
   site: PropTypes.shape({
     siteMetadata: PropTypes.shape({
       buildId: PropTypes.string.isRequired
@@ -44,8 +47,9 @@ FooterImpl.propTypes = {
   }).isRequired
 };
 
+const TranslatedFooter = withNamespaces()(FooterImpl);
 const Footer = () => <StaticQuery query={ query } render={ data => (
-  <FooterImpl { ...data } />
+  <TranslatedFooter { ...data } />
 ) } />;
 
 export default Footer;
diff --git a/src/components/Footer/test.js b/src/components/Footer/test.js
index d654b00..7f4becc 100644
--- a/src/components/Footer/test.js
+++ b/src/components/Footer/test.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
+import { mockT } from 'i18n';
 import Footer, { FooterImpl } from 'components/Footer';
 
 describe('Footer', () => {
@@ -13,7 +14,7 @@ describe('Footer', () => {
 
   test('rendering implementation', () => {
     const component = shallow(
-      <FooterImpl site={{ siteMetadata: { buildId: 'abc-123' } }} />
+      <FooterImpl site={{ siteMetadata: { buildId: 'abc-123' } }} t={ mockT } />
     );
     expect(component).toMatchSnapshot();
   });
diff --git a/src/components/Header/__snapshots__/test.js.snap b/src/components/Header/__snapshots__/test.js.snap
index e7e19f7..65e6b86 100644
--- a/src/components/Header/__snapshots__/test.js.snap
+++ b/src/components/Header/__snapshots__/test.js.snap
@@ -46,14 +46,18 @@ ShallowWrapper {
                 color="currentColor"
                 size="24"
               />
-              Source on GitLab
+              <WithMergedOptions(TransComponent)>
+                Source on GitLab
+              </WithMergedOptions(TransComponent)>
             </a>
           </li>
           <li>
             <mockConstructor
               to="/privacy"
             >
-              Privacy Policy
+              <WithMergedOptions(TransComponent)>
+                Privacy Policy
+              </WithMergedOptions(TransComponent)>
             </mockConstructor>
           </li>
           <li>
@@ -108,14 +112,18 @@ ShallowWrapper {
                   color="currentColor"
                   size="24"
                 />
-                Source on GitLab
+                <WithMergedOptions(TransComponent)>
+                  Source on GitLab
+                </WithMergedOptions(TransComponent)>
               </a>
             </li>,
             <li>
               <mockConstructor
                 to="/privacy"
               >
-                Privacy Policy
+                <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>
               </mockConstructor>
             </li>,
             <li>
@@ -140,7 +148,9 @@ ShallowWrapper {
                   color="currentColor"
                   size="24"
                 />
-                Source on GitLab
+                <WithMergedOptions(TransComponent)>
+                  Source on GitLab
+                </WithMergedOptions(TransComponent)>
               </a>,
             },
             "ref": null,
@@ -154,7 +164,9 @@ ShallowWrapper {
                     color="currentColor"
                     size="24"
                   />,
-                  "Source on GitLab",
+                  <WithMergedOptions(TransComponent)>
+                    Source on GitLab
+                  </WithMergedOptions(TransComponent)>,
                 ],
                 "href": "https://gitlab.com/javallone/regexper-static",
                 "rel": "external noopener noreferrer",
@@ -174,7 +186,17 @@ ShallowWrapper {
                   "rendered": null,
                   "type": [Function],
                 },
-                "Source on GitLab",
+                Object {
+                  "instance": null,
+                  "key": undefined,
+                  "nodeType": "class",
+                  "props": Object {
+                    "children": "Source on GitLab",
+                  },
+                  "ref": null,
+                  "rendered": "Source on GitLab",
+                  "type": [Function],
+                },
               ],
               "type": "a",
             },
@@ -188,7 +210,9 @@ ShallowWrapper {
               "children": <mockConstructor
                 to="/privacy"
               >
-                Privacy Policy
+                <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>
               </mockConstructor>,
             },
             "ref": null,
@@ -197,11 +221,23 @@ ShallowWrapper {
               "key": undefined,
               "nodeType": "function",
               "props": Object {
-                "children": "Privacy Policy",
+                "children": <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>,
                 "to": "/privacy",
               },
               "ref": null,
-              "rendered": "Privacy Policy",
+              "rendered": Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "class",
+                "props": Object {
+                  "children": "Privacy Policy",
+                },
+                "ref": null,
+                "rendered": "Privacy Policy",
+                "type": [Function],
+              },
               "type": [MockFunction],
             },
             "type": "li",
@@ -258,14 +294,18 @@ ShallowWrapper {
                   color="currentColor"
                   size="24"
                 />
-                Source on GitLab
+                <WithMergedOptions(TransComponent)>
+                  Source on GitLab
+                </WithMergedOptions(TransComponent)>
               </a>
             </li>
             <li>
               <mockConstructor
                 to="/privacy"
               >
-                Privacy Policy
+                <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>
               </mockConstructor>
             </li>
             <li>
@@ -320,14 +360,18 @@ ShallowWrapper {
                     color="currentColor"
                     size="24"
                   />
-                  Source on GitLab
+                  <WithMergedOptions(TransComponent)>
+                    Source on GitLab
+                  </WithMergedOptions(TransComponent)>
                 </a>
               </li>,
               <li>
                 <mockConstructor
                   to="/privacy"
                 >
-                  Privacy Policy
+                  <WithMergedOptions(TransComponent)>
+                    Privacy Policy
+                  </WithMergedOptions(TransComponent)>
                 </mockConstructor>
               </li>,
               <li>
@@ -352,7 +396,9 @@ ShallowWrapper {
                     color="currentColor"
                     size="24"
                   />
-                  Source on GitLab
+                  <WithMergedOptions(TransComponent)>
+                    Source on GitLab
+                  </WithMergedOptions(TransComponent)>
                 </a>,
               },
               "ref": null,
@@ -366,7 +412,9 @@ ShallowWrapper {
                       color="currentColor"
                       size="24"
                     />,
-                    "Source on GitLab",
+                    <WithMergedOptions(TransComponent)>
+                      Source on GitLab
+                    </WithMergedOptions(TransComponent)>,
                   ],
                   "href": "https://gitlab.com/javallone/regexper-static",
                   "rel": "external noopener noreferrer",
@@ -386,7 +434,17 @@ ShallowWrapper {
                     "rendered": null,
                     "type": [Function],
                   },
-                  "Source on GitLab",
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "class",
+                    "props": Object {
+                      "children": "Source on GitLab",
+                    },
+                    "ref": null,
+                    "rendered": "Source on GitLab",
+                    "type": [Function],
+                  },
                 ],
                 "type": "a",
               },
@@ -400,7 +458,9 @@ ShallowWrapper {
                 "children": <mockConstructor
                   to="/privacy"
                 >
-                  Privacy Policy
+                  <WithMergedOptions(TransComponent)>
+                    Privacy Policy
+                  </WithMergedOptions(TransComponent)>
                 </mockConstructor>,
               },
               "ref": null,
@@ -409,11 +469,23 @@ ShallowWrapper {
                 "key": undefined,
                 "nodeType": "function",
                 "props": Object {
-                  "children": "Privacy Policy",
+                  "children": <WithMergedOptions(TransComponent)>
+                    Privacy Policy
+                  </WithMergedOptions(TransComponent)>,
                   "to": "/privacy",
                 },
                 "ref": null,
-                "rendered": "Privacy Policy",
+                "rendered": Object {
+                  "instance": null,
+                  "key": undefined,
+                  "nodeType": "class",
+                  "props": Object {
+                    "children": "Privacy Policy",
+                  },
+                  "ref": null,
+                  "rendered": "Privacy Policy",
+                  "type": [Function],
+                },
                 "type": [MockFunction],
               },
               "type": "li",
@@ -510,14 +582,18 @@ ShallowWrapper {
                 color="currentColor"
                 size="24"
               />
-              Source on GitLab
+              <WithMergedOptions(TransComponent)>
+                Source on GitLab
+              </WithMergedOptions(TransComponent)>
             </a>
           </li>
           <li>
             <mockConstructor
               to="/privacy"
             >
-              Privacy Policy
+              <WithMergedOptions(TransComponent)>
+                Privacy Policy
+              </WithMergedOptions(TransComponent)>
             </mockConstructor>
           </li>
           <li>
@@ -572,14 +648,18 @@ ShallowWrapper {
                   color="currentColor"
                   size="24"
                 />
-                Source on GitLab
+                <WithMergedOptions(TransComponent)>
+                  Source on GitLab
+                </WithMergedOptions(TransComponent)>
               </a>
             </li>,
             <li>
               <mockConstructor
                 to="/privacy"
               >
-                Privacy Policy
+                <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>
               </mockConstructor>
             </li>,
             <li>
@@ -604,7 +684,9 @@ ShallowWrapper {
                   color="currentColor"
                   size="24"
                 />
-                Source on GitLab
+                <WithMergedOptions(TransComponent)>
+                  Source on GitLab
+                </WithMergedOptions(TransComponent)>
               </a>,
             },
             "ref": null,
@@ -618,7 +700,9 @@ ShallowWrapper {
                     color="currentColor"
                     size="24"
                   />,
-                  "Source on GitLab",
+                  <WithMergedOptions(TransComponent)>
+                    Source on GitLab
+                  </WithMergedOptions(TransComponent)>,
                 ],
                 "href": "https://gitlab.com/javallone/regexper-static",
                 "rel": "external noopener noreferrer",
@@ -638,7 +722,17 @@ ShallowWrapper {
                   "rendered": null,
                   "type": [Function],
                 },
-                "Source on GitLab",
+                Object {
+                  "instance": null,
+                  "key": undefined,
+                  "nodeType": "class",
+                  "props": Object {
+                    "children": "Source on GitLab",
+                  },
+                  "ref": null,
+                  "rendered": "Source on GitLab",
+                  "type": [Function],
+                },
               ],
               "type": "a",
             },
@@ -652,7 +746,9 @@ ShallowWrapper {
               "children": <mockConstructor
                 to="/privacy"
               >
-                Privacy Policy
+                <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>
               </mockConstructor>,
             },
             "ref": null,
@@ -661,11 +757,23 @@ ShallowWrapper {
               "key": undefined,
               "nodeType": "function",
               "props": Object {
-                "children": "Privacy Policy",
+                "children": <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>,
                 "to": "/privacy",
               },
               "ref": null,
-              "rendered": "Privacy Policy",
+              "rendered": Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "class",
+                "props": Object {
+                  "children": "Privacy Policy",
+                },
+                "ref": null,
+                "rendered": "Privacy Policy",
+                "type": [Function],
+              },
               "type": [MockFunction],
             },
             "type": "li",
@@ -722,14 +830,18 @@ ShallowWrapper {
                   color="currentColor"
                   size="24"
                 />
-                Source on GitLab
+                <WithMergedOptions(TransComponent)>
+                  Source on GitLab
+                </WithMergedOptions(TransComponent)>
               </a>
             </li>
             <li>
               <mockConstructor
                 to="/privacy"
               >
-                Privacy Policy
+                <WithMergedOptions(TransComponent)>
+                  Privacy Policy
+                </WithMergedOptions(TransComponent)>
               </mockConstructor>
             </li>
             <li>
@@ -784,14 +896,18 @@ ShallowWrapper {
                     color="currentColor"
                     size="24"
                   />
-                  Source on GitLab
+                  <WithMergedOptions(TransComponent)>
+                    Source on GitLab
+                  </WithMergedOptions(TransComponent)>
                 </a>
               </li>,
               <li>
                 <mockConstructor
                   to="/privacy"
                 >
-                  Privacy Policy
+                  <WithMergedOptions(TransComponent)>
+                    Privacy Policy
+                  </WithMergedOptions(TransComponent)>
                 </mockConstructor>
               </li>,
               <li>
@@ -816,7 +932,9 @@ ShallowWrapper {
                     color="currentColor"
                     size="24"
                   />
-                  Source on GitLab
+                  <WithMergedOptions(TransComponent)>
+                    Source on GitLab
+                  </WithMergedOptions(TransComponent)>
                 </a>,
               },
               "ref": null,
@@ -830,7 +948,9 @@ ShallowWrapper {
                       color="currentColor"
                       size="24"
                     />,
-                    "Source on GitLab",
+                    <WithMergedOptions(TransComponent)>
+                      Source on GitLab
+                    </WithMergedOptions(TransComponent)>,
                   ],
                   "href": "https://gitlab.com/javallone/regexper-static",
                   "rel": "external noopener noreferrer",
@@ -850,7 +970,17 @@ ShallowWrapper {
                     "rendered": null,
                     "type": [Function],
                   },
-                  "Source on GitLab",
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "class",
+                    "props": Object {
+                      "children": "Source on GitLab",
+                    },
+                    "ref": null,
+                    "rendered": "Source on GitLab",
+                    "type": [Function],
+                  },
                 ],
                 "type": "a",
               },
@@ -864,7 +994,9 @@ ShallowWrapper {
                 "children": <mockConstructor
                   to="/privacy"
                 >
-                  Privacy Policy
+                  <WithMergedOptions(TransComponent)>
+                    Privacy Policy
+                  </WithMergedOptions(TransComponent)>
                 </mockConstructor>,
               },
               "ref": null,
@@ -873,11 +1005,23 @@ ShallowWrapper {
                 "key": undefined,
                 "nodeType": "function",
                 "props": Object {
-                  "children": "Privacy Policy",
+                  "children": <WithMergedOptions(TransComponent)>
+                    Privacy Policy
+                  </WithMergedOptions(TransComponent)>,
                   "to": "/privacy",
                 },
                 "ref": null,
-                "rendered": "Privacy Policy",
+                "rendered": Object {
+                  "instance": null,
+                  "key": undefined,
+                  "nodeType": "class",
+                  "props": Object {
+                    "children": "Privacy Policy",
+                  },
+                  "ref": null,
+                  "rendered": "Privacy Policy",
+                  "type": [Function],
+                },
                 "type": [MockFunction],
               },
               "type": "li",
diff --git a/src/components/Header/index.js b/src/components/Header/index.js
index d4703e2..39a2a4c 100644
--- a/src/components/Header/index.js
+++ b/src/components/Header/index.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Link, StaticQuery, graphql } from 'gatsby';
+import { withNamespaces, Trans } from 'react-i18next';
 
 import GitlabIcon from 'react-feather/dist/icons/gitlab';
 
@@ -32,11 +33,13 @@ export const HeaderImpl = ({ site: { siteMetadata } }) => (
           rel="external noopener noreferrer"
           target="_blank">
           <GitlabIcon />
-          Source on GitLab
+          <Trans>Source on GitLab</Trans>
         </a>
       </li>
       <li>
-        <Link to="/privacy">Privacy Policy</Link>
+        <Link to="/privacy">
+          <Trans>Privacy Policy</Trans>
+        </Link>
       </li>
       <li>
         <LocaleSwitcher />
@@ -56,8 +59,9 @@ HeaderImpl.propTypes = {
   }).isRequired
 };
 
+const TranslatedHeader = withNamespaces()(HeaderImpl);
 const Header = () => <StaticQuery query={ query } render={ data => (
-  <HeaderImpl { ...data } />
+  <TranslatedHeader { ...data } />
 ) } />;
 
 export default Header;
diff --git a/src/components/SentryError/__snapshots__/test.js.snap b/src/components/SentryError/__snapshots__/test.js.snap
index d1e23b5..c81fade 100644
--- a/src/components/SentryError/__snapshots__/test.js.snap
+++ b/src/components/SentryError/__snapshots__/test.js.snap
@@ -3,7 +3,9 @@
 exports[`SentryError rendering 1`] = `
 ShallowWrapper {
   Symbol(enzyme.__root__): [Circular],
-  Symbol(enzyme.__unrendered__): <SentryError />,
+  Symbol(enzyme.__unrendered__): <SentryErrorImpl
+    t={[Function]}
+  />,
   Symbol(enzyme.__renderer__): Object {
     "batchedUpdates": [Function],
     "getNode": [Function],
@@ -18,64 +20,7 @@ ShallowWrapper {
     "nodeType": "function",
     "props": Object {
       "children": <p>
-        This error has been logged. You may also 
-        <a
-          href="#error-report"
-          onClick={[Function]}
-        >
-          fill out a report
-        </a>
-        .
-      </p>,
-      "heading": "An error has occurred",
-      "type": "error",
-    },
-    "ref": null,
-    "rendered": Object {
-      "instance": null,
-      "key": undefined,
-      "nodeType": "host",
-      "props": Object {
-        "children": Array [
-          "This error has been logged. You may also ",
-          <a
-            href="#error-report"
-            onClick={[Function]}
-          >
-            fill out a report
-          </a>,
-          ".",
-        ],
-      },
-      "ref": null,
-      "rendered": Array [
-        "This error has been logged. You may also ",
-        Object {
-          "instance": null,
-          "key": undefined,
-          "nodeType": "host",
-          "props": Object {
-            "children": "fill out a report",
-            "href": "#error-report",
-            "onClick": [Function],
-          },
-          "ref": null,
-          "rendered": "fill out a report",
-          "type": "a",
-        },
-        ".",
-      ],
-      "type": "p",
-    },
-    "type": [Function],
-  },
-  Symbol(enzyme.__nodes__): Array [
-    Object {
-      "instance": null,
-      "key": undefined,
-      "nodeType": "function",
-      "props": Object {
-        "children": <p>
+        <WithMergedOptions(TransComponent)>
           This error has been logged. You may also 
           <a
             href="#error-report"
@@ -84,15 +29,33 @@ ShallowWrapper {
             fill out a report
           </a>
           .
-        </p>,
-        "heading": "An error has occurred",
-        "type": "error",
+        </WithMergedOptions(TransComponent)>
+      </p>,
+      "heading": "TRANSLATE(An error has occurred)",
+      "type": "error",
+    },
+    "ref": null,
+    "rendered": Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "host",
+      "props": Object {
+        "children": <WithMergedOptions(TransComponent)>
+          This error has been logged. You may also 
+          <a
+            href="#error-report"
+            onClick={[Function]}
+          >
+            fill out a report
+          </a>
+          .
+        </WithMergedOptions(TransComponent)>,
       },
       "ref": null,
       "rendered": Object {
         "instance": null,
         "key": undefined,
-        "nodeType": "host",
+        "nodeType": "class",
         "props": Object {
           "children": Array [
             "This error has been logged. You may also ",
@@ -123,6 +86,87 @@ ShallowWrapper {
           },
           ".",
         ],
+        "type": [Function],
+      },
+      "type": "p",
+    },
+    "type": [Function],
+  },
+  Symbol(enzyme.__nodes__): Array [
+    Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "function",
+      "props": Object {
+        "children": <p>
+          <WithMergedOptions(TransComponent)>
+            This error has been logged. You may also 
+            <a
+              href="#error-report"
+              onClick={[Function]}
+            >
+              fill out a report
+            </a>
+            .
+          </WithMergedOptions(TransComponent)>
+        </p>,
+        "heading": "TRANSLATE(An error has occurred)",
+        "type": "error",
+      },
+      "ref": null,
+      "rendered": Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "host",
+        "props": Object {
+          "children": <WithMergedOptions(TransComponent)>
+            This error has been logged. You may also 
+            <a
+              href="#error-report"
+              onClick={[Function]}
+            >
+              fill out a report
+            </a>
+            .
+          </WithMergedOptions(TransComponent)>,
+        },
+        "ref": null,
+        "rendered": Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "class",
+          "props": Object {
+            "children": Array [
+              "This error has been logged. You may also ",
+              <a
+                href="#error-report"
+                onClick={[Function]}
+              >
+                fill out a report
+              </a>,
+              ".",
+            ],
+          },
+          "ref": null,
+          "rendered": Array [
+            "This error has been logged. You may also ",
+            Object {
+              "instance": null,
+              "key": undefined,
+              "nodeType": "host",
+              "props": Object {
+                "children": "fill out a report",
+                "href": "#error-report",
+                "onClick": [Function],
+              },
+              "ref": null,
+              "rendered": "fill out a report",
+              "type": "a",
+            },
+            ".",
+          ],
+          "type": [Function],
+        },
         "type": "p",
       },
       "type": [Function],
diff --git a/src/components/SentryError/index.js b/src/components/SentryError/index.js
index 3fb414e..7ca0ad2 100644
--- a/src/components/SentryError/index.js
+++ b/src/components/SentryError/index.js
@@ -1,9 +1,11 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import * as Sentry from '@sentry/browser';
+import { withNamespaces, Trans } from 'react-i18next';
 
 import Message from 'components/Message';
 
-class SentryError extends React.Component {
+export class SentryErrorImpl extends React.Component {
   reportError = event => {
     event.preventDefault();
 
@@ -13,11 +15,19 @@ class SentryError extends React.Component {
   }
 
   render() {
-    return <Message type="error" heading="An error has occurred">
-      <p>This error has been logged. You may also <a href="#error-report"
-        onClick={ this.reportError }>fill out a report</a>.</p>
+    const { t } = this.props;
+
+    return <Message type="error" heading={ t('An error has occurred') }>
+      <p>
+        <Trans>This error has been logged. You may also <a href="#error-report"
+          onClick={ this.reportError }>fill out a report</a>.</Trans>
+      </p>
     </Message>;
   }
 }
 
-export default SentryError;
+SentryErrorImpl.propTypes = {
+  t: PropTypes.func.isRequired
+};
+
+export default withNamespaces()(SentryErrorImpl);
diff --git a/src/components/SentryError/test.js b/src/components/SentryError/test.js
index e01611a..50331c9 100644
--- a/src/components/SentryError/test.js
+++ b/src/components/SentryError/test.js
@@ -4,12 +4,13 @@ import React from 'react';
 import { shallow } from 'enzyme';
 import * as Sentry from '@sentry/browser';
 
-import SentryError from 'components/SentryError';
+import { mockT } from 'i18n';
+import { SentryErrorImpl } from 'components/SentryError';
 
 describe('SentryError', () => {
   test('rendering', () => {
     const component = shallow(
-      <SentryError />
+      <SentryErrorImpl t={ mockT }/>
     );
     expect(component).toMatchSnapshot();
   });
@@ -18,7 +19,7 @@ describe('SentryError', () => {
     test('fill out a report when an event has been logged', () => {
       Sentry.lastEventId.mockReturnValue(1);
       const component = shallow(
-        <SentryError />
+        <SentryErrorImpl t={ mockT } />
       );
       const eventObj = { preventDefault: jest.fn() };
       component.find('a').simulate('click', eventObj);
@@ -30,7 +31,7 @@ describe('SentryError', () => {
     test('fill out a report when an event has not been logged', () => {
       Sentry.lastEventId.mockReturnValue(false);
       const component = shallow(
-        <SentryError />
+        <SentryErrorImpl t={ mockT } />
       );
       const eventObj = { preventDefault: jest.fn() };
       component.find('a').simulate('click', eventObj);
diff --git a/src/locales/en-AC.yaml b/src/locales/en-AC.yaml
index a0213f6..73ef784 100644
--- a/src/locales/en-AC.yaml
+++ b/src/locales/en-AC.yaml
@@ -1,2 +1,45 @@
 "Language": |
   LANGUAGE
+"Source on GitLab": |
+  SOURCE ON GITLAB
+"Privacy Policy": |
+  PRIVACY POLICY
+"Created by <1>Jeff Avallone</1>": |
+  CREATED BY <1>JEFF AVALLONE</1>
+"Generated images licensed: <1><0></0></1>": |
+  GENERATED IMAGES LICENSED: <1><0></0></1>
+"Creative Commons CC-BY-3.0 License": |
+  CREATIVE COMMONS CC-BY-3.0 LICENSE
+"An error has occurred": |
+  AN ERROR HAS OCCURRED
+"This error has been logged. You may also <1>fill out a report</1>.": |
+  THIS ERROR HAS BEEN LOGGED. YOU MAY ALSO <1>FILL OUT A REPORT</1>.
+"Hello world": |
+  HELLO WORLD
+"Privacy policy copy": |
+  <0>REGEXPER AND THE TOOLS USED TO CREATE IT ARE ALL OPEN SOURCE. If you are
+  concerned that the JavaScript being delivered is in any way malicious, please
+  inspect the source in the <1>GitLab repository</1>.</0>
+  <1>There are two data collection tools integrated in the app. These tools are
+  not used to collect personal information:</1>
+  <2>
+    <0><0>Google Analytics</0> is used to track browser usage data and
+    application performance. It is configured to anonymize the client IP
+    address.</0>
+    <1><0>Sentry.io</0> is a tool used to capture and report client-side
+    JavaScript errors. It is configured to not store the client IP address.</1>
+  </2>
+  <3>Regexper honors the browser <1>“Do Not Track”</1> setting and will not
+  enable these data collection tools if that setting is enabled. Also, most
+  popular ad blockers will prevent these tools from sending any tracking data.
+  Disabling or blocking these data collection tools will <3>not</3> impact the
+  performance of this app. The information collected by these tools is used to
+  monitor application performance, determine browser support, and collect error
+  reports.</3>
+  <4>Regexper is not supported by ad revenue or sales of any kind.</4>
+"Page Not Found": |
+  PAGE NOT FOUND
+"404 Page Not Found": |
+  404 PAGE NOT FOUND
+"The page you have requested could not be found.": |
+  THE PAGE YOU HAVE REQUESTED COULD NOT BE FOUND.
diff --git a/src/locales/en.yaml b/src/locales/en.yaml
index b3bad5d..1bdc286 100644
--- a/src/locales/en.yaml
+++ b/src/locales/en.yaml
@@ -1,2 +1,45 @@
 "Language": |
   Language
+"Source on GitLab": |
+  Source on GitLab
+"Privacy Policy": |
+  Privacy Policy
+"Created by <1>Jeff Avallone</1>": |
+  Created by <1>Jeff Avallone</1>
+"Generated images licensed: <1><0></0></1>": |
+  Generated images licensed: <1><0></0></1>
+"Creative Commons CC-BY-3.0 License": |
+  Creative Commons CC-BY-3.0 License
+"An error has occurred": |
+  An error has occurred
+"This error has been logged. You may also <1>fill out a report</1>.": |
+  This error has been logged. You may also <1>fill out a report</1>.
+"Hello world": |
+  Hello world
+"Privacy policy copy": |
+  <0>Regexper and the tools used to create it are all open source. If you are
+  concerned that the JavaScript being delivered is in any way malicious, please
+  inspect the source in the <1>GitLab repository</1>.</0>
+  <1>There are two data collection tools integrated in the app. These tools are
+  not used to collect personal information:</1>
+  <2>
+    <0><0>Google Analytics</0> is used to track browser usage data and
+    application performance. It is configured to anonymize the client IP
+    address.</0>
+    <1><0>Sentry.io</0> is a tool used to capture and report client-side
+    JavaScript errors. It is configured to not store the client IP address.</1>
+  </2>
+  <3>Regexper honors the browser <1>“Do Not Track”</1> setting and will not
+  enable these data collection tools if that setting is enabled. Also, most
+  popular ad blockers will prevent these tools from sending any tracking data.
+  Disabling or blocking these data collection tools will <3>not</3> impact the
+  performance of this app. The information collected by these tools is used to
+  monitor application performance, determine browser support, and collect error
+  reports.</3>
+  <4>Regexper is not supported by ad revenue or sales of any kind.</4>
+"Page Not Found": |
+  Page Not Found
+"404 Page Not Found": |
+  404 Page Not Found
+"The page you have requested could not be found.": |
+  The page you have requested could not be found.
diff --git a/src/pages/404.js b/src/pages/404.js
index 75b2626..37f642f 100644
--- a/src/pages/404.js
+++ b/src/pages/404.js
@@ -1,13 +1,19 @@
 import React from 'react';
+import PropTypes from 'prop-types';
+import { withNamespaces, Trans } from 'react-i18next';
 
 import Metadata from 'components/Metadata';
 import Message from 'components/Message';
 
-const ErrorPage = () => <>
-  <Metadata title="Page Not Found" />
-  <Message type="error" heading="404 Page Not Found">
-    <p>The page you have requrested could not be found.</p>
+export const ErrorPageImpl = ({ t }) => <>
+  <Metadata title={ t('Page Not Found') } />
+  <Message type="error" heading={ t('404 Page Not Found') }>
+    <p><Trans>The page you have requested could not be found.</Trans></p>
   </Message>
 </>;
 
-export default ErrorPage;
+ErrorPageImpl.propTypes = {
+  t: PropTypes.func.isRequired
+};
+
+export default withNamespaces()(ErrorPageImpl);
diff --git a/src/pages/404.test.js b/src/pages/404.test.js
index 4211dae..9971698 100644
--- a/src/pages/404.test.js
+++ b/src/pages/404.test.js
@@ -1,12 +1,13 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import ErrorPage from 'pages/404';
+import { mockT } from 'i18n';
+import { ErrorPageImpl } from 'pages/404';
 
 describe('Error Page', () => {
   test('rendering', () => {
     const component = shallow(
-      <ErrorPage />
+      <ErrorPageImpl t={ mockT } />
     );
     expect(component).toMatchSnapshot();
   });
diff --git a/src/pages/__snapshots__/404.test.js.snap b/src/pages/__snapshots__/404.test.js.snap
index aee03da..857d4d5 100644
--- a/src/pages/__snapshots__/404.test.js.snap
+++ b/src/pages/__snapshots__/404.test.js.snap
@@ -3,7 +3,9 @@
 exports[`Error Page rendering 1`] = `
 ShallowWrapper {
   Symbol(enzyme.__root__): [Circular],
-  Symbol(enzyme.__unrendered__): <ErrorPage />,
+  Symbol(enzyme.__unrendered__): <ErrorPageImpl
+    t={[Function]}
+  />,
   Symbol(enzyme.__renderer__): Object {
     "batchedUpdates": [Function],
     "getNode": [Function],
@@ -19,14 +21,16 @@ ShallowWrapper {
     "props": Object {
       "children": Array [
         <Metadata
-          title="Page Not Found"
+          title="TRANSLATE(Page Not Found)"
         />,
         <Message
-          heading="404 Page Not Found"
+          heading="TRANSLATE(404 Page Not Found)"
           type="error"
         >
           <p>
-            The page you have requrested could not be found.
+            <WithMergedOptions(TransComponent)>
+              The page you have requested could not be found.
+            </WithMergedOptions(TransComponent)>
           </p>
         </Message>,
       ],
@@ -38,7 +42,7 @@ ShallowWrapper {
         "key": undefined,
         "nodeType": "function",
         "props": Object {
-          "title": "Page Not Found",
+          "title": "TRANSLATE(Page Not Found)",
         },
         "ref": null,
         "rendered": null,
@@ -50,9 +54,11 @@ ShallowWrapper {
         "nodeType": "function",
         "props": Object {
           "children": <p>
-            The page you have requrested could not be found.
+            <WithMergedOptions(TransComponent)>
+              The page you have requested could not be found.
+            </WithMergedOptions(TransComponent)>
           </p>,
-          "heading": "404 Page Not Found",
+          "heading": "TRANSLATE(404 Page Not Found)",
           "type": "error",
         },
         "ref": null,
@@ -61,10 +67,22 @@ ShallowWrapper {
           "key": undefined,
           "nodeType": "host",
           "props": Object {
-            "children": "The page you have requrested could not be found.",
+            "children": <WithMergedOptions(TransComponent)>
+              The page you have requested could not be found.
+            </WithMergedOptions(TransComponent)>,
           },
           "ref": null,
-          "rendered": "The page you have requrested could not be found.",
+          "rendered": Object {
+            "instance": null,
+            "key": undefined,
+            "nodeType": "class",
+            "props": Object {
+              "children": "The page you have requested could not be found.",
+            },
+            "ref": null,
+            "rendered": "The page you have requested could not be found.",
+            "type": [Function],
+          },
           "type": "p",
         },
         "type": [Function],
@@ -80,14 +98,16 @@ ShallowWrapper {
       "props": Object {
         "children": Array [
           <Metadata
-            title="Page Not Found"
+            title="TRANSLATE(Page Not Found)"
           />,
           <Message
-            heading="404 Page Not Found"
+            heading="TRANSLATE(404 Page Not Found)"
             type="error"
           >
             <p>
-              The page you have requrested could not be found.
+              <WithMergedOptions(TransComponent)>
+                The page you have requested could not be found.
+              </WithMergedOptions(TransComponent)>
             </p>
           </Message>,
         ],
@@ -99,7 +119,7 @@ ShallowWrapper {
           "key": undefined,
           "nodeType": "function",
           "props": Object {
-            "title": "Page Not Found",
+            "title": "TRANSLATE(Page Not Found)",
           },
           "ref": null,
           "rendered": null,
@@ -111,9 +131,11 @@ ShallowWrapper {
           "nodeType": "function",
           "props": Object {
             "children": <p>
-              The page you have requrested could not be found.
+              <WithMergedOptions(TransComponent)>
+                The page you have requested could not be found.
+              </WithMergedOptions(TransComponent)>
             </p>,
-            "heading": "404 Page Not Found",
+            "heading": "TRANSLATE(404 Page Not Found)",
             "type": "error",
           },
           "ref": null,
@@ -122,10 +144,22 @@ ShallowWrapper {
             "key": undefined,
             "nodeType": "host",
             "props": Object {
-              "children": "The page you have requrested could not be found.",
+              "children": <WithMergedOptions(TransComponent)>
+                The page you have requested could not be found.
+              </WithMergedOptions(TransComponent)>,
             },
             "ref": null,
-            "rendered": "The page you have requrested could not be found.",
+            "rendered": Object {
+              "instance": null,
+              "key": undefined,
+              "nodeType": "class",
+              "props": Object {
+                "children": "The page you have requested could not be found.",
+              },
+              "ref": null,
+              "rendered": "The page you have requested could not be found.",
+              "type": [Function],
+            },
             "type": "p",
           },
           "type": [Function],
diff --git a/src/pages/__snapshots__/index.test.js.snap b/src/pages/__snapshots__/index.test.js.snap
index e937719..2fd80f0 100644
--- a/src/pages/__snapshots__/index.test.js.snap
+++ b/src/pages/__snapshots__/index.test.js.snap
@@ -3,7 +3,7 @@
 exports[`Index Page rendering 1`] = `
 ShallowWrapper {
   Symbol(enzyme.__root__): [Circular],
-  Symbol(enzyme.__unrendered__): <IndexPage />,
+  Symbol(enzyme.__unrendered__): <IndexPageImpl />,
   Symbol(enzyme.__renderer__): Object {
     "batchedUpdates": [Function],
     "getNode": [Function],
@@ -39,7 +39,9 @@ ShallowWrapper {
           </Message>
         </noscript>,
         <div>
-          Hello world
+          <WithMergedOptions(TransComponent)>
+            Hello world
+          </WithMergedOptions(TransComponent)>
         </div>,
       ],
     },
@@ -157,10 +159,22 @@ ShallowWrapper {
         "key": undefined,
         "nodeType": "host",
         "props": Object {
-          "children": "Hello world",
+          "children": <WithMergedOptions(TransComponent)>
+            Hello world
+          </WithMergedOptions(TransComponent)>,
         },
         "ref": null,
-        "rendered": "Hello world",
+        "rendered": Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "class",
+          "props": Object {
+            "children": "Hello world",
+          },
+          "ref": null,
+          "rendered": "Hello world",
+          "type": [Function],
+        },
         "type": "div",
       },
     ],
@@ -194,7 +208,9 @@ ShallowWrapper {
             </Message>
           </noscript>,
           <div>
-            Hello world
+            <WithMergedOptions(TransComponent)>
+              Hello world
+            </WithMergedOptions(TransComponent)>
           </div>,
         ],
       },
@@ -312,10 +328,22 @@ ShallowWrapper {
           "key": undefined,
           "nodeType": "host",
           "props": Object {
-            "children": "Hello world",
+            "children": <WithMergedOptions(TransComponent)>
+              Hello world
+            </WithMergedOptions(TransComponent)>,
           },
           "ref": null,
-          "rendered": "Hello world",
+          "rendered": Object {
+            "instance": null,
+            "key": undefined,
+            "nodeType": "class",
+            "props": Object {
+              "children": "Hello world",
+            },
+            "ref": null,
+            "rendered": "Hello world",
+            "type": [Function],
+          },
           "type": "div",
         },
       ],
diff --git a/src/pages/__snapshots__/privacy.test.js.snap b/src/pages/__snapshots__/privacy.test.js.snap
index 38b2b78..b25bf22 100644
--- a/src/pages/__snapshots__/privacy.test.js.snap
+++ b/src/pages/__snapshots__/privacy.test.js.snap
@@ -3,7 +3,9 @@
 exports[`Privacy Page rendering 1`] = `
 ShallowWrapper {
   Symbol(enzyme.__root__): [Circular],
-  Symbol(enzyme.__unrendered__): <PrivacyPage />,
+  Symbol(enzyme.__unrendered__): <PrivacyPageImpl
+    t={[Function]}
+  />,
   Symbol(enzyme.__renderer__): Object {
     "batchedUpdates": [Function],
     "getNode": [Function],
@@ -19,333 +21,14 @@ ShallowWrapper {
     "props": Object {
       "children": Array [
         <Metadata
-          title="Privacy Policy"
+          title="TRANSLATE(Privacy Policy)"
         />,
         <Message
-          heading="Privacy Policy"
+          heading="TRANSLATE(Privacy Policy)"
           type="info"
         >
-          <p>
-            Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the 
-            <a
-              href="https://gitlab.com/javallone/regexper-static"
-              rel="external noopener noreferrer"
-              target="_blank"
-            >
-              GitLab repository
-            </a>
-            .
-          </p>
-          <p>
-            There are two data collection tools integrated in the app. These tools are not used to collect personal information:
-          </p>
-          <ul>
-            <li>
-              <b>
-                Google Analytics
-              </b>
-               is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
-            </li>
-            <li>
-              <b>
-                Sentry.io
-              </b>
-               is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
-            </li>
-          </ul>
-          <p>
-            Regexper honors the browser 
-            <b>
-              “Do Not Track”
-            </b>
-             setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will 
-            <b>
-              not
-            </b>
-             impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
-          </p>
-          <p>
-            Regexper is not supported by ad revenue or sales of any kind.
-          </p>
-        </Message>,
-      ],
-    },
-    "ref": null,
-    "rendered": Array [
-      Object {
-        "instance": null,
-        "key": undefined,
-        "nodeType": "function",
-        "props": Object {
-          "title": "Privacy Policy",
-        },
-        "ref": null,
-        "rendered": null,
-        "type": [Function],
-      },
-      Object {
-        "instance": null,
-        "key": undefined,
-        "nodeType": "function",
-        "props": Object {
-          "children": Array [
-            <p>
-              Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the 
-              <a
-                href="https://gitlab.com/javallone/regexper-static"
-                rel="external noopener noreferrer"
-                target="_blank"
-              >
-                GitLab repository
-              </a>
-              .
-            </p>,
-            <p>
-              There are two data collection tools integrated in the app. These tools are not used to collect personal information:
-            </p>,
-            <ul>
-              <li>
-                <b>
-                  Google Analytics
-                </b>
-                 is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
-              </li>
-              <li>
-                <b>
-                  Sentry.io
-                </b>
-                 is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
-              </li>
-            </ul>,
-            <p>
-              Regexper honors the browser 
-              <b>
-                “Do Not Track”
-              </b>
-               setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will 
-              <b>
-                not
-              </b>
-               impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
-            </p>,
-            <p>
-              Regexper is not supported by ad revenue or sales of any kind.
-            </p>,
-          ],
-          "heading": "Privacy Policy",
-          "type": "info",
-        },
-        "ref": null,
-        "rendered": Array [
-          Object {
-            "instance": null,
-            "key": undefined,
-            "nodeType": "host",
-            "props": Object {
-              "children": Array [
-                "Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the ",
-                <a
-                  href="https://gitlab.com/javallone/regexper-static"
-                  rel="external noopener noreferrer"
-                  target="_blank"
-                >
-                  GitLab repository
-                </a>,
-                ".",
-              ],
-            },
-            "ref": null,
-            "rendered": Array [
-              "Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the ",
-              Object {
-                "instance": null,
-                "key": undefined,
-                "nodeType": "host",
-                "props": Object {
-                  "children": "GitLab repository",
-                  "href": "https://gitlab.com/javallone/regexper-static",
-                  "rel": "external noopener noreferrer",
-                  "target": "_blank",
-                },
-                "ref": null,
-                "rendered": "GitLab repository",
-                "type": "a",
-              },
-              ".",
-            ],
-            "type": "p",
-          },
-          Object {
-            "instance": null,
-            "key": undefined,
-            "nodeType": "host",
-            "props": Object {
-              "children": "There are two data collection tools integrated in the app. These tools are not used to collect personal information:",
-            },
-            "ref": null,
-            "rendered": "There are two data collection tools integrated in the app. These tools are not used to collect personal information:",
-            "type": "p",
-          },
-          Object {
-            "instance": null,
-            "key": undefined,
-            "nodeType": "host",
-            "props": Object {
-              "children": Array [
-                <li>
-                  <b>
-                    Google Analytics
-                  </b>
-                   is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
-                </li>,
-                <li>
-                  <b>
-                    Sentry.io
-                  </b>
-                   is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
-                </li>,
-              ],
-            },
-            "ref": null,
-            "rendered": Array [
-              Object {
-                "instance": null,
-                "key": undefined,
-                "nodeType": "host",
-                "props": Object {
-                  "children": Array [
-                    <b>
-                      Google Analytics
-                    </b>,
-                    " is used to track browser usage data and application performance. It is configured to anonymize the client IP address.",
-                  ],
-                },
-                "ref": null,
-                "rendered": Array [
-                  Object {
-                    "instance": null,
-                    "key": undefined,
-                    "nodeType": "host",
-                    "props": Object {
-                      "children": "Google Analytics",
-                    },
-                    "ref": null,
-                    "rendered": "Google Analytics",
-                    "type": "b",
-                  },
-                  " is used to track browser usage data and application performance. It is configured to anonymize the client IP address.",
-                ],
-                "type": "li",
-              },
-              Object {
-                "instance": null,
-                "key": undefined,
-                "nodeType": "host",
-                "props": Object {
-                  "children": Array [
-                    <b>
-                      Sentry.io
-                    </b>,
-                    " is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.",
-                  ],
-                },
-                "ref": null,
-                "rendered": Array [
-                  Object {
-                    "instance": null,
-                    "key": undefined,
-                    "nodeType": "host",
-                    "props": Object {
-                      "children": "Sentry.io",
-                    },
-                    "ref": null,
-                    "rendered": "Sentry.io",
-                    "type": "b",
-                  },
-                  " is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.",
-                ],
-                "type": "li",
-              },
-            ],
-            "type": "ul",
-          },
-          Object {
-            "instance": null,
-            "key": undefined,
-            "nodeType": "host",
-            "props": Object {
-              "children": Array [
-                "Regexper honors the browser ",
-                <b>
-                  “Do Not Track”
-                </b>,
-                " setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will ",
-                <b>
-                  not
-                </b>,
-                " impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.",
-              ],
-            },
-            "ref": null,
-            "rendered": Array [
-              "Regexper honors the browser ",
-              Object {
-                "instance": null,
-                "key": undefined,
-                "nodeType": "host",
-                "props": Object {
-                  "children": "“Do Not Track”",
-                },
-                "ref": null,
-                "rendered": "“Do Not Track”",
-                "type": "b",
-              },
-              " setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will ",
-              Object {
-                "instance": null,
-                "key": undefined,
-                "nodeType": "host",
-                "props": Object {
-                  "children": "not",
-                },
-                "ref": null,
-                "rendered": "not",
-                "type": "b",
-              },
-              " impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.",
-            ],
-            "type": "p",
-          },
-          Object {
-            "instance": null,
-            "key": undefined,
-            "nodeType": "host",
-            "props": Object {
-              "children": "Regexper is not supported by ad revenue or sales of any kind.",
-            },
-            "ref": null,
-            "rendered": "Regexper is not supported by ad revenue or sales of any kind.",
-            "type": "p",
-          },
-        ],
-        "type": [Function],
-      },
-    ],
-    "type": Symbol(react.fragment),
-  },
-  Symbol(enzyme.__nodes__): Array [
-    Object {
-      "instance": null,
-      "key": undefined,
-      "nodeType": "function",
-      "props": Object {
-        "children": Array [
-          <Metadata
-            title="Privacy Policy"
-          />,
-          <Message
-            heading="Privacy Policy"
-            type="info"
+          <WithMergedOptions(TransComponent)
+            i18nKey="Privacy policy copy"
           >
             <p>
               Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the 
@@ -389,26 +72,82 @@ ShallowWrapper {
             <p>
               Regexper is not supported by ad revenue or sales of any kind.
             </p>
-          </Message>,
-        ],
-      },
-      "ref": null,
-      "rendered": Array [
-        Object {
-          "instance": null,
-          "key": undefined,
-          "nodeType": "function",
-          "props": Object {
-            "title": "Privacy Policy",
-          },
-          "ref": null,
-          "rendered": null,
-          "type": [Function],
+          </WithMergedOptions(TransComponent)>
+        </Message>,
+      ],
+    },
+    "ref": null,
+    "rendered": Array [
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "function",
+        "props": Object {
+          "title": "TRANSLATE(Privacy Policy)",
         },
-        Object {
+        "ref": null,
+        "rendered": null,
+        "type": [Function],
+      },
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "function",
+        "props": Object {
+          "children": <WithMergedOptions(TransComponent)
+            i18nKey="Privacy policy copy"
+          >
+            <p>
+              Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the 
+              <a
+                href="https://gitlab.com/javallone/regexper-static"
+                rel="external noopener noreferrer"
+                target="_blank"
+              >
+                GitLab repository
+              </a>
+              .
+            </p>
+            <p>
+              There are two data collection tools integrated in the app. These tools are not used to collect personal information:
+            </p>
+            <ul>
+              <li>
+                <b>
+                  Google Analytics
+                </b>
+                 is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
+              </li>
+              <li>
+                <b>
+                  Sentry.io
+                </b>
+                 is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
+              </li>
+            </ul>
+            <p>
+              Regexper honors the browser 
+              <b>
+                “Do Not Track”
+              </b>
+               setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will 
+              <b>
+                not
+              </b>
+               impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
+            </p>
+            <p>
+              Regexper is not supported by ad revenue or sales of any kind.
+            </p>
+          </WithMergedOptions(TransComponent)>,
+          "heading": "TRANSLATE(Privacy Policy)",
+          "type": "info",
+        },
+        "ref": null,
+        "rendered": Object {
           "instance": null,
           "key": undefined,
-          "nodeType": "function",
+          "nodeType": "class",
           "props": Object {
             "children": Array [
               <p>
@@ -454,8 +193,7 @@ ShallowWrapper {
                 Regexper is not supported by ad revenue or sales of any kind.
               </p>,
             ],
-            "heading": "Privacy Policy",
-            "type": "info",
+            "i18nKey": "Privacy policy copy",
           },
           "ref": null,
           "rendered": Array [
@@ -652,6 +390,390 @@ ShallowWrapper {
           ],
           "type": [Function],
         },
+        "type": [Function],
+      },
+    ],
+    "type": Symbol(react.fragment),
+  },
+  Symbol(enzyme.__nodes__): Array [
+    Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "function",
+      "props": Object {
+        "children": Array [
+          <Metadata
+            title="TRANSLATE(Privacy Policy)"
+          />,
+          <Message
+            heading="TRANSLATE(Privacy Policy)"
+            type="info"
+          >
+            <WithMergedOptions(TransComponent)
+              i18nKey="Privacy policy copy"
+            >
+              <p>
+                Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the 
+                <a
+                  href="https://gitlab.com/javallone/regexper-static"
+                  rel="external noopener noreferrer"
+                  target="_blank"
+                >
+                  GitLab repository
+                </a>
+                .
+              </p>
+              <p>
+                There are two data collection tools integrated in the app. These tools are not used to collect personal information:
+              </p>
+              <ul>
+                <li>
+                  <b>
+                    Google Analytics
+                  </b>
+                   is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
+                </li>
+                <li>
+                  <b>
+                    Sentry.io
+                  </b>
+                   is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
+                </li>
+              </ul>
+              <p>
+                Regexper honors the browser 
+                <b>
+                  “Do Not Track”
+                </b>
+                 setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will 
+                <b>
+                  not
+                </b>
+                 impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
+              </p>
+              <p>
+                Regexper is not supported by ad revenue or sales of any kind.
+              </p>
+            </WithMergedOptions(TransComponent)>
+          </Message>,
+        ],
+      },
+      "ref": null,
+      "rendered": Array [
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "function",
+          "props": Object {
+            "title": "TRANSLATE(Privacy Policy)",
+          },
+          "ref": null,
+          "rendered": null,
+          "type": [Function],
+        },
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "function",
+          "props": Object {
+            "children": <WithMergedOptions(TransComponent)
+              i18nKey="Privacy policy copy"
+            >
+              <p>
+                Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the 
+                <a
+                  href="https://gitlab.com/javallone/regexper-static"
+                  rel="external noopener noreferrer"
+                  target="_blank"
+                >
+                  GitLab repository
+                </a>
+                .
+              </p>
+              <p>
+                There are two data collection tools integrated in the app. These tools are not used to collect personal information:
+              </p>
+              <ul>
+                <li>
+                  <b>
+                    Google Analytics
+                  </b>
+                   is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
+                </li>
+                <li>
+                  <b>
+                    Sentry.io
+                  </b>
+                   is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
+                </li>
+              </ul>
+              <p>
+                Regexper honors the browser 
+                <b>
+                  “Do Not Track”
+                </b>
+                 setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will 
+                <b>
+                  not
+                </b>
+                 impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
+              </p>
+              <p>
+                Regexper is not supported by ad revenue or sales of any kind.
+              </p>
+            </WithMergedOptions(TransComponent)>,
+            "heading": "TRANSLATE(Privacy Policy)",
+            "type": "info",
+          },
+          "ref": null,
+          "rendered": Object {
+            "instance": null,
+            "key": undefined,
+            "nodeType": "class",
+            "props": Object {
+              "children": Array [
+                <p>
+                  Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the 
+                  <a
+                    href="https://gitlab.com/javallone/regexper-static"
+                    rel="external noopener noreferrer"
+                    target="_blank"
+                  >
+                    GitLab repository
+                  </a>
+                  .
+                </p>,
+                <p>
+                  There are two data collection tools integrated in the app. These tools are not used to collect personal information:
+                </p>,
+                <ul>
+                  <li>
+                    <b>
+                      Google Analytics
+                    </b>
+                     is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
+                  </li>
+                  <li>
+                    <b>
+                      Sentry.io
+                    </b>
+                     is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
+                  </li>
+                </ul>,
+                <p>
+                  Regexper honors the browser 
+                  <b>
+                    “Do Not Track”
+                  </b>
+                   setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will 
+                  <b>
+                    not
+                  </b>
+                   impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
+                </p>,
+                <p>
+                  Regexper is not supported by ad revenue or sales of any kind.
+                </p>,
+              ],
+              "i18nKey": "Privacy policy copy",
+            },
+            "ref": null,
+            "rendered": Array [
+              Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "host",
+                "props": Object {
+                  "children": Array [
+                    "Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the ",
+                    <a
+                      href="https://gitlab.com/javallone/regexper-static"
+                      rel="external noopener noreferrer"
+                      target="_blank"
+                    >
+                      GitLab repository
+                    </a>,
+                    ".",
+                  ],
+                },
+                "ref": null,
+                "rendered": Array [
+                  "Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the ",
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "host",
+                    "props": Object {
+                      "children": "GitLab repository",
+                      "href": "https://gitlab.com/javallone/regexper-static",
+                      "rel": "external noopener noreferrer",
+                      "target": "_blank",
+                    },
+                    "ref": null,
+                    "rendered": "GitLab repository",
+                    "type": "a",
+                  },
+                  ".",
+                ],
+                "type": "p",
+              },
+              Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "host",
+                "props": Object {
+                  "children": "There are two data collection tools integrated in the app. These tools are not used to collect personal information:",
+                },
+                "ref": null,
+                "rendered": "There are two data collection tools integrated in the app. These tools are not used to collect personal information:",
+                "type": "p",
+              },
+              Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "host",
+                "props": Object {
+                  "children": Array [
+                    <li>
+                      <b>
+                        Google Analytics
+                      </b>
+                       is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
+                    </li>,
+                    <li>
+                      <b>
+                        Sentry.io
+                      </b>
+                       is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
+                    </li>,
+                  ],
+                },
+                "ref": null,
+                "rendered": Array [
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "host",
+                    "props": Object {
+                      "children": Array [
+                        <b>
+                          Google Analytics
+                        </b>,
+                        " is used to track browser usage data and application performance. It is configured to anonymize the client IP address.",
+                      ],
+                    },
+                    "ref": null,
+                    "rendered": Array [
+                      Object {
+                        "instance": null,
+                        "key": undefined,
+                        "nodeType": "host",
+                        "props": Object {
+                          "children": "Google Analytics",
+                        },
+                        "ref": null,
+                        "rendered": "Google Analytics",
+                        "type": "b",
+                      },
+                      " is used to track browser usage data and application performance. It is configured to anonymize the client IP address.",
+                    ],
+                    "type": "li",
+                  },
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "host",
+                    "props": Object {
+                      "children": Array [
+                        <b>
+                          Sentry.io
+                        </b>,
+                        " is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.",
+                      ],
+                    },
+                    "ref": null,
+                    "rendered": Array [
+                      Object {
+                        "instance": null,
+                        "key": undefined,
+                        "nodeType": "host",
+                        "props": Object {
+                          "children": "Sentry.io",
+                        },
+                        "ref": null,
+                        "rendered": "Sentry.io",
+                        "type": "b",
+                      },
+                      " is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.",
+                    ],
+                    "type": "li",
+                  },
+                ],
+                "type": "ul",
+              },
+              Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "host",
+                "props": Object {
+                  "children": Array [
+                    "Regexper honors the browser ",
+                    <b>
+                      “Do Not Track”
+                    </b>,
+                    " setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will ",
+                    <b>
+                      not
+                    </b>,
+                    " impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.",
+                  ],
+                },
+                "ref": null,
+                "rendered": Array [
+                  "Regexper honors the browser ",
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "host",
+                    "props": Object {
+                      "children": "“Do Not Track”",
+                    },
+                    "ref": null,
+                    "rendered": "“Do Not Track”",
+                    "type": "b",
+                  },
+                  " setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will ",
+                  Object {
+                    "instance": null,
+                    "key": undefined,
+                    "nodeType": "host",
+                    "props": Object {
+                      "children": "not",
+                    },
+                    "ref": null,
+                    "rendered": "not",
+                    "type": "b",
+                  },
+                  " impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.",
+                ],
+                "type": "p",
+              },
+              Object {
+                "instance": null,
+                "key": undefined,
+                "nodeType": "host",
+                "props": Object {
+                  "children": "Regexper is not supported by ad revenue or sales of any kind.",
+                },
+                "ref": null,
+                "rendered": "Regexper is not supported by ad revenue or sales of any kind.",
+                "type": "p",
+              },
+            ],
+            "type": [Function],
+          },
+          "type": [Function],
+        },
       ],
       "type": Symbol(react.fragment),
     },
diff --git a/src/pages/index.js b/src/pages/index.js
index a5d2a99..083211a 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,10 +1,11 @@
 import React from 'react';
 import { Link } from 'gatsby';
+import { withNamespaces, Trans } from 'react-i18next';
 
 import Metadata from 'components/Metadata';
 import Message from 'components/Message';
 
-const IndexPage = () => <>
+export const IndexPageImpl = () => <>
   <Metadata/>
   <noscript>
     <Message type="error" heading="JavaScript Required">
@@ -13,7 +14,7 @@ const IndexPage = () => <>
         please see the <Link to="/privacy">Privacy Policy</Link>.</p>
     </Message>
   </noscript>
-  <div>Hello world</div>
+  <div><Trans>Hello world</Trans></div>
 </>;
 
-export default IndexPage;
+export default withNamespaces()(IndexPageImpl);
diff --git a/src/pages/index.test.js b/src/pages/index.test.js
index 83cf276..1e06a60 100644
--- a/src/pages/index.test.js
+++ b/src/pages/index.test.js
@@ -1,12 +1,12 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import IndexPage from 'pages/index';
+import { IndexPageImpl } from 'pages/index';
 
 describe('Index Page', () => {
   test('rendering', () => {
     const component = shallow(
-      <IndexPage />
+      <IndexPageImpl />
     );
     expect(component).toMatchSnapshot();
   });
diff --git a/src/pages/privacy.js b/src/pages/privacy.js
index adb9935..15cfe01 100644
--- a/src/pages/privacy.js
+++ b/src/pages/privacy.js
@@ -1,47 +1,56 @@
 import React from 'react';
+import PropTypes from 'prop-types';
+import { withNamespaces, Trans } from 'react-i18next';
 
 import Metadata from 'components/Metadata';
 import Message from 'components/Message';
 
-const PrivacyPage = () => <>
-  <Metadata title="Privacy Policy" />
-  <Message type="info" heading="Privacy Policy">
-    <p>
-      Regexper and the tools used to create it are all open source. If you are
-      concerned that the JavaScript being delivered is in any way malicious,
-      please inspect the source in the <a
-        href="https://gitlab.com/javallone/regexper-static"
-        rel="external noopener noreferrer"
-        target="_blank">GitLab repository</a>.
-    </p>
-    <p>
-      There are two data collection tools integrated in the app. These tools
-      are not used to collect personal information:
-    </p>
-    <ul>
-      <li>
-        <b>Google Analytics</b> is used to track browser usage data and
-        application performance. It is configured to anonymize the client IP
-        address.
-      </li>
-      <li>
-        <b>Sentry.io</b> is a tool used to capture and report client-side
-        JavaScript errors. It is configured to not store the client IP address.
-      </li>
-    </ul>
-    <p>
-      Regexper honors the browser <b>&ldquo;Do Not Track&rdquo;</b> setting and
-      will not enable these data collection tools if that setting is enabled.
-      Also, most popular ad blockers will prevent these tools from sending any
-      tracking data. Disabling or blocking these data collection tools
-      will <b>not</b> impact the performance of this app. The information
-      collected by these tools is used to monitor application performance,
-      determine browser support, and collect error reports.
-    </p>
-    <p>
-      Regexper is not supported by ad revenue or sales of any kind.
-    </p>
+export const PrivacyPageImpl = ({ t }) => <>
+  <Metadata title={ t('Privacy Policy') } />
+  <Message type="info" heading={ t('Privacy Policy') }>
+    <Trans i18nKey="Privacy policy copy">
+      <p>
+        Regexper and the tools used to create it are all open source. If you are
+        concerned that the JavaScript being delivered is in any way malicious,
+        please inspect the source in the <a
+          href="https://gitlab.com/javallone/regexper-static"
+          rel="external noopener noreferrer"
+          target="_blank">GitLab repository</a>.
+      </p>
+      <p>
+        There are two data collection tools integrated in the app. These tools
+        are not used to collect personal information:
+      </p>
+      <ul>
+        <li>
+          <b>Google Analytics</b> is used to track browser usage data and
+          application performance. It is configured to anonymize the client IP
+          address.
+        </li>
+        <li>
+          <b>Sentry.io</b> is a tool used to capture and report client-side
+          JavaScript errors. It is configured to not store the client IP
+          address.
+        </li>
+      </ul>
+      <p>
+        Regexper honors the browser <b>&ldquo;Do Not Track&rdquo;</b> setting
+        and will not enable these data collection tools if that setting is
+        enabled. Also, most popular ad blockers will prevent these tools from
+        sending any tracking data. Disabling or blocking these data collection
+        tools will <b>not</b> impact the performance of this app. The
+        information collected by these tools is used to monitor application
+        performance, determine browser support, and collect error reports.
+      </p>
+      <p>
+        Regexper is not supported by ad revenue or sales of any kind.
+      </p>
+    </Trans>
   </Message>
-</>;
+  </>;
 
-export default PrivacyPage;
+PrivacyPageImpl.propTypes = {
+  t: PropTypes.func.isRequired
+};
+
+export default withNamespaces()(PrivacyPageImpl);
diff --git a/src/pages/privacy.test.js b/src/pages/privacy.test.js
index d53c988..62f47b3 100644
--- a/src/pages/privacy.test.js
+++ b/src/pages/privacy.test.js
@@ -1,12 +1,13 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import PrivacyPage from 'pages/privacy';
+import { mockT } from 'i18n';
+import { PrivacyPageImpl } from 'pages/privacy';
 
 describe('Privacy Page', () => {
   test('rendering', () => {
     const component = shallow(
-      <PrivacyPage />
+      <PrivacyPageImpl t={ mockT } />
     );
     expect(component).toMatchSnapshot();
   });