diff --git a/src/components/App/__snapshots__/test.js.snap b/src/components/App/__snapshots__/test.js.snap index 9a95d6c..42d3d2a 100644 --- a/src/components/App/__snapshots__/test.js.snap +++ b/src/components/App/__snapshots__/test.js.snap @@ -10,11 +10,11 @@ exports[`App removing rendered expression 1`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -38,11 +38,11 @@ exports[`App removing rendered expression 2`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -60,11 +60,11 @@ exports[`App rendering 1`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -82,11 +82,11 @@ exports[`App rendering an expression 1`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -104,11 +104,11 @@ exports[`App rendering an expression 2`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -127,11 +127,11 @@ exports[`App rendering an expression 3`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -155,11 +155,11 @@ exports[`App rendering image details 1`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -183,11 +183,11 @@ exports[`App rendering image details 2`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -217,11 +217,11 @@ exports[`App rendering with an invalid syntax 1`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -239,11 +239,11 @@ exports[`App rendering with an invalid syntax 2`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } @@ -262,27 +262,31 @@ exports[`App rendering with an invalid syntax 3`] = ` Array [ Object { "id": "testJS", - "name": "Testing JS", + "label": "Testing JS", }, Object { "id": "other", - "name": "Other", + "label": "Other", }, ] } />

- An error occurred while rendering the regular expression. + + An error occurred while rendering the regular expression. +

- Retry + + Retry +
diff --git a/src/components/App/index.js b/src/components/App/index.js index 3b0405d..d7a951b 100644 --- a/src/components/App/index.js +++ b/src/components/App/index.js @@ -1,5 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; +import { withNamespaces, Trans } from 'react-i18next'; import * as Sentry from '@sentry/browser'; import URLSearchParams from '@ungap/url-search-params'; @@ -16,7 +17,8 @@ class App extends React.PureComponent { syntaxList: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string, label: PropTypes.string - })) + })), + t: PropTypes.func.isRequired } state = { @@ -105,7 +107,8 @@ class App extends React.PureComponent { syntax, expr, permalinkUrl, - syntaxList + syntaxList, + t } = this.props; const { loading, @@ -142,9 +145,11 @@ class App extends React.PureComponent { { loading && } - { loadingError && -

An error occurred while rendering the regular expression.

- Retry + { loadingError && +

+ An error occurred while rendering the regular expression. +

+ Retry
} { doRender && } @@ -152,4 +157,5 @@ class App extends React.PureComponent { } } -export default App; +export { App }; +export default withNamespaces()(App); diff --git a/src/components/App/test.js b/src/components/App/test.js index fa863df..16667d6 100644 --- a/src/components/App/test.js +++ b/src/components/App/test.js @@ -1,24 +1,26 @@ import React from 'react'; import { shallow } from 'enzyme'; -import App from 'components/App'; +import { mockT } from 'i18n'; +import { App } from 'components/App'; const syntaxList = [ - { id: 'testJS', name: 'Testing JS' }, - { id: 'other', name: 'Other' } + { id: 'testJS', label: 'Testing JS' }, + { id: 'other', label: 'Other' } ]; +const commonProps = { syntaxList, t: mockT }; describe('App', () => { test('rendering', () => { const component = shallow( - + ); expect(component).toMatchSnapshot(); }); test('rendering an expression', async () => { const component = shallow( - + ); expect(component).toMatchSnapshot(); @@ -38,7 +40,7 @@ describe('App', () => { jest.spyOn(console, 'error').mockImplementation(() => {}); const component = shallow( - + ); expect(component).toMatchSnapshot(); @@ -56,7 +58,7 @@ describe('App', () => { test('removing rendered expression', async () => { const component = shallow( - + ); // Give a beat for module to load @@ -73,7 +75,7 @@ describe('App', () => { test('rendering image details', async () => { const component = shallow( - + ); // Give a beat for module to load @@ -92,7 +94,7 @@ describe('App', () => { jest.spyOn(console, 'error').mockImplementation(() => {}); const component = shallow( - + ); const instance = component.instance(); @@ -108,7 +110,7 @@ describe('App', () => { test('submitting an expression to render', () => { const component = shallow( - + ); const instance = component.instance(); diff --git a/src/locales/en-AC.yaml b/src/locales/en-AC.yaml index 73ef784..b8c2676 100644 --- a/src/locales/en-AC.yaml +++ b/src/locales/en-AC.yaml @@ -43,3 +43,9 @@ 404 PAGE NOT FOUND "The page you have requested could not be found.": | THE PAGE YOU HAVE REQUESTED COULD NOT BE FOUND. +"Render Failure": | + RENDER FAILURE +"An error occurred while rendering the regular expression.": | + AN ERROR OCCURRED WHILE RENDERING THE REGULAR EXPRESSION. +"Retry": | + RETRY diff --git a/src/locales/en.yaml b/src/locales/en.yaml index 1bdc286..129f0a9 100644 --- a/src/locales/en.yaml +++ b/src/locales/en.yaml @@ -43,3 +43,9 @@ 404 Page Not Found "The page you have requested could not be found.": | The page you have requested could not be found. +"Render Failure": | + Render Failure +"An error occurred while rendering the regular expression.": | + An error occurred while rendering the regular expression. +"Retry": | + Retry diff --git a/src/pages/__snapshots__/index.test.js.snap b/src/pages/__snapshots__/index.test.js.snap index 3a71349..0b3c0fa 100644 --- a/src/pages/__snapshots__/index.test.js.snap +++ b/src/pages/__snapshots__/index.test.js.snap @@ -22,7 +22,7 @@ exports[`Index Page rendering 1`] = `

- -