Commit d48b48bf authored by Jeff Avallone's avatar Jeff Avallone

Translating FormActions component

parent c4a74ad2
......@@ -19,7 +19,7 @@ exports[`App removing rendered expression 1`] = `
]
}
>
<FormActions />
<LoadNamespace(FormActions) />
</LoadNamespace(Form)>
<RenderJS
expr="test expression"
......@@ -136,7 +136,7 @@ exports[`App rendering an expression 3`] = `
]
}
>
<FormActions />
<LoadNamespace(FormActions) />
</LoadNamespace(Form)>
<RenderJS
expr="test expression"
......@@ -164,7 +164,7 @@ exports[`App rendering image details 1`] = `
]
}
>
<FormActions />
<LoadNamespace(FormActions) />
</LoadNamespace(Form)>
<RenderJS
expr="test expression"
......@@ -192,7 +192,7 @@ exports[`App rendering image details 2`] = `
]
}
>
<FormActions
<LoadNamespace(FormActions)
imageDetails={
Object {
"svg": "test svg content",
......
......@@ -20,7 +20,7 @@ exports[`FormActions rendering download links 1`] = `
color="currentColor"
size="24"
/>
Example PNG Link
TRANSLATE(Example PNG Link)
</a>
</li>
<li>
......@@ -33,7 +33,7 @@ exports[`FormActions rendering download links 1`] = `
color="currentColor"
size="24"
/>
Example SVG Link
TRANSLATE(Example SVG Link)
</a>
</li>
</ul>
......@@ -51,7 +51,9 @@ exports[`FormActions rendering download links with data after mounting 1`] = `
color="currentColor"
size="24"
/>
Permalink
<WithMergedOptions(TransComponent)>
Permalink
</WithMergedOptions(TransComponent)>
</a>
</li>
</ul>
......@@ -71,7 +73,7 @@ exports[`FormActions rendering download links with data after mounting 2`] = `
color="currentColor"
size="24"
/>
Example PNG Link
TRANSLATE(Example PNG Link)
</a>
</li>
<li>
......@@ -84,7 +86,7 @@ exports[`FormActions rendering download links with data after mounting 2`] = `
color="currentColor"
size="24"
/>
Example SVG Link
TRANSLATE(Example SVG Link)
</a>
</li>
<li>
......@@ -95,7 +97,9 @@ exports[`FormActions rendering download links with data after mounting 2`] = `
color="currentColor"
size="24"
/>
Permalink
<WithMergedOptions(TransComponent)>
Permalink
</WithMergedOptions(TransComponent)>
</a>
</li>
</ul>
......@@ -115,7 +119,7 @@ exports[`FormActions rendering download links with data after mounting 3`] = `
color="currentColor"
size="24"
/>
Example PNG Link
TRANSLATE(Example PNG Link)
</a>
</li>
<li>
......@@ -128,7 +132,7 @@ exports[`FormActions rendering download links with data after mounting 3`] = `
color="currentColor"
size="24"
/>
Example SVG Link
TRANSLATE(Example SVG Link)
</a>
</li>
<li>
......@@ -139,7 +143,9 @@ exports[`FormActions rendering download links with data after mounting 3`] = `
color="currentColor"
size="24"
/>
Permalink
<WithMergedOptions(TransComponent)>
Permalink
</WithMergedOptions(TransComponent)>
</a>
</li>
</ul>
......@@ -157,7 +163,9 @@ exports[`FormActions rendering with a permalink 1`] = `
color="currentColor"
size="24"
/>
Permalink
<WithMergedOptions(TransComponent)>
Permalink
</WithMergedOptions(TransComponent)>
</a>
</li>
</ul>
......
import React from 'react';
import PropTypes from 'prop-types';
import { withNamespaces, Trans } from 'react-i18next';
import DownloadIcon from 'react-feather/dist/icons/download';
import LinkIcon from 'react-feather/dist/icons/link';
......@@ -15,7 +16,8 @@ class FormActions extends React.PureComponent {
svg: PropTypes.string,
width: PropTypes.number,
height: PropTypes.number
})
}),
t: PropTypes.func.isRequired
}
state = {
......@@ -63,9 +65,11 @@ class FormActions extends React.PureComponent {
}
downloadLink({ url, filename, type, label }) {
const { t } = this.props;
return <li>
<a href={ url } download={ filename } type={ type }>
<DownloadIcon />{ label }
<DownloadIcon />{ t(label) }
</a>
</li>;
}
......@@ -83,10 +87,11 @@ class FormActions extends React.PureComponent {
{ pngLink && this.downloadLink(pngLink) }
{ svgLink && this.downloadLink(svgLink) }
{ permalinkUrl && <li>
<a href={ permalinkUrl }><LinkIcon />Permalink</a>
<a href={ permalinkUrl }><LinkIcon /><Trans>Permalink</Trans></a>
</li> }
</ul>;
}
}
export default FormActions;
export { FormActions };
export default withNamespaces()(FormActions);
......@@ -3,7 +3,8 @@ jest.mock('./links');
import React from 'react';
import { shallow } from 'enzyme';
import FormActions from 'components/FormActions';
import { mockT } from 'i18n';
import { FormActions } from 'components/FormActions';
import { createPngLink, createSvgLink } from './links';
createPngLink.mockResolvedValue({
......@@ -22,14 +23,14 @@ createSvgLink.mockResolvedValue({
describe('FormActions', () => {
test('rendering', () => {
const component = shallow(
<FormActions />
<FormActions t={ mockT } />
);
expect(component).toMatchSnapshot();
});
test('rendering with a permalink', () => {
const component = shallow(
<FormActions permalinkUrl="http://example.com" />
<FormActions permalinkUrl="http://example.com" t={ mockT } />
);
expect(component).toMatchSnapshot();
});
......@@ -42,7 +43,7 @@ describe('FormActions', () => {
};
const component = shallow(
<FormActions imageDetails={ imageDetails }/>
<FormActions imageDetails={ imageDetails } t={ mockT } />
);
// Give a beat for mocked promises to resolve
......@@ -53,7 +54,7 @@ describe('FormActions', () => {
test('rendering download links with data after mounting', async () => {
const component = shallow(
<FormActions />
<FormActions t={ mockT } />
);
component.setProps({ permalinkUrl: 'http://example.com' });
......
......@@ -57,3 +57,9 @@
JAVASCRIPT
"PCRE": |
PCRE
"Permalink": |
PERMALINK
"Download SVG": |
DOWNLOAD SVG
"Download PNG": |
DOWNLOAD PNG
......@@ -57,3 +57,9 @@
JavaScript
"PCRE": |
PCRE
"Permalink": |
Permalink
"Download SVG": |
Download SVG
"Download PNG": |
Download PNG
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment