root/regexper-static
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Implementing translations

Browse Source
This commit is contained in:
Jeff Avallone
2019-01-06 13:03:07 -05:00
parent e1c4cb9068
commit 618b21bb93
19 changed files with 1296 additions and 705 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Footer/__snapshots__/test.js.snap
+257 -162
View File
@@ -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",
},
],
src/components/Footer/index.js
+10 -6
View File
@@ -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;
src/components/Footer/test.js
+2 -1
View File
@@ -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();
});
src/components/Header/__snapshots__/test.js.snap
+184 -40
View File
@@ -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",
src/components/Header/index.js
+7 -3
View File
@@ -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;
src/components/SentryError/__snapshots__/test.js.snap
+107 -63
View File
@@ -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],
src/components/SentryError/index.js
+15 -5
View File
@@ -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);
src/components/SentryError/test.js
+5 -4
View File
@@ -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);