diff --git a/src/ui/public/share/components/__snapshots__/share_context_menu.test.js.snap b/src/ui/public/share/components/__snapshots__/share_context_menu.test.js.snap
index cd291871ae71a..d92769d3101f7 100644
--- a/src/ui/public/share/components/__snapshots__/share_context_menu.test.js.snap
+++ b/src/ui/public/share/components/__snapshots__/share_context_menu.test.js.snap
@@ -7,7 +7,7 @@ exports[`should only render permalink panel when there are no other panels 1`] =
panels={
Array [
Object {
- "content": ,
@@ -26,7 +26,7 @@ exports[`should render context menu panel when there are more than one panel 1`]
panels={
Array [
Object {
- "content": ,
@@ -34,7 +34,7 @@ exports[`should render context menu panel when there are more than one panel 1`]
"title": "Permalink",
},
Object {
- "content":
+ }
+ label={
+
+ }
>
- Snapshot
+
+ }
position="bottom"
type="questionInCircle"
/>
@@ -66,7 +96,11 @@ exports[`render 1`] = `
component="div"
grow={true}
>
- Saved object
+
+ }
position="bottom"
type="questionInCircle"
/>
@@ -106,7 +150,13 @@ exports[`render 1`] = `
+ }
onChange={[Function]}
/>
@@ -116,10 +166,16 @@ exports[`render 1`] = `
>
+ }
position="bottom"
type="questionInCircle"
/>
@@ -143,7 +199,13 @@ exports[`should enable saved object export option when objectId is provided 1`]
describedByIds={Array []}
fullWidth={false}
hasEmptyLabelSpace={false}
- label="Generate the link as"
+ label={
+
+ }
>
- Snapshot
+
+ }
position="bottom"
type="questionInCircle"
/>
@@ -199,7 +275,11 @@ exports[`should enable saved object export option when objectId is provided 1`]
component="div"
grow={true}
>
- Saved object
+
+ }
position="bottom"
type="questionInCircle"
/>
@@ -239,7 +329,13 @@ exports[`should enable saved object export option when objectId is provided 1`]
+ }
onChange={[Function]}
/>
@@ -249,10 +345,16 @@ exports[`should enable saved object export option when objectId is provided 1`]
>
+ }
position="bottom"
type="questionInCircle"
/>
diff --git a/src/ui/public/share/components/share_context_menu.test.js b/src/ui/public/share/components/share_context_menu.test.js
index 385441fef5d8a..175c6bd9952f8 100644
--- a/src/ui/public/share/components/share_context_menu.test.js
+++ b/src/ui/public/share/components/share_context_menu.test.js
@@ -20,14 +20,14 @@
jest.mock('../lib/url_shortener', () => ({}));
import React from 'react';
-import { shallow } from 'enzyme';
+import { shallowWithIntl } from 'test_utils/enzyme_helpers';
import {
ShareContextMenu,
} from './share_context_menu';
test('should render context menu panel when there are more than one panel', () => {
- const component = shallow( {}}
@@ -36,7 +36,7 @@ test('should render context menu panel when there are more than one panel', () =
});
test('should only render permalink panel when there are no other panels', () => {
- const component = shallow( {}}
diff --git a/src/ui/public/share/components/share_context_menu.tsx b/src/ui/public/share/components/share_context_menu.tsx
index 3093fe33ae2b6..b68d75b40bc56 100644
--- a/src/ui/public/share/components/share_context_menu.tsx
+++ b/src/ui/public/share/components/share_context_menu.tsx
@@ -23,6 +23,7 @@ import './share_panel_content.less';
import { EuiContextMenuPanelDescriptor } from '@elastic/eui';
import { EuiContextMenu } from '@elastic/eui';
+import { InjectedIntl, injectI18n } from '@kbn/i18n/react';
import { ShareAction, ShareActionProvider, ShareContextMenuPanelItem } from 'ui/share/share_action';
import { UrlPanelContent } from './url_panel_content';
@@ -35,9 +36,10 @@ interface Props {
sharingData: any;
isDirty: boolean;
onClose: () => void;
+ intl: InjectedIntl;
}
-export class ShareContextMenu extends Component {
+class ShareContextMenuUI extends Component {
public render() {
const { panels, initialPanelId } = this.getPanels();
return (
@@ -52,10 +54,14 @@ export class ShareContextMenu extends Component {
private getPanels = () => {
const panels: EuiContextMenuPanelDescriptor[] = [];
const menuItems: ShareContextMenuPanelItem[] = [];
+ const { intl } = this.props;
const permalinkPanel = {
id: panels.length + 1,
- title: 'Permalink',
+ title: intl.formatMessage({
+ id: 'common.ui.share.contextMenu.permalinkPanelTitle',
+ defaultMessage: 'Permalink',
+ }),
content: (
{
),
};
menuItems.push({
- name: 'Permalinks',
+ name: intl.formatMessage({
+ id: 'common.ui.share.contextMenu.permalinksLabel',
+ defaultMessage: 'Permalinks',
+ }),
icon: 'link',
panel: permalinkPanel.id,
sortOrder: 0,
@@ -75,7 +84,10 @@ export class ShareContextMenu extends Component {
if (this.props.allowEmbed) {
const embedPanel = {
id: panels.length + 1,
- title: 'Embed Code',
+ title: intl.formatMessage({
+ id: 'common.ui.share.contextMenu.embedCodePanelTitle',
+ defaultMessage: 'Embed Code',
+ }),
content: (
{
};
panels.push(embedPanel);
menuItems.push({
- name: 'Embed code',
+ name: intl.formatMessage({
+ id: 'common.ui.share.contextMenu.embedCodeLabel',
+ defaultMessage: 'Embed code',
+ }),
icon: 'console',
panel: embedPanel.id,
sortOrder: 0,
@@ -130,7 +145,15 @@ export class ShareContextMenu extends Component {
if (menuItems.length > 1) {
const topLevelMenuPanel = {
id: panels.length + 1,
- title: `Share this ${this.props.objectType}`,
+ title: intl.formatMessage(
+ {
+ id: 'common.ui.share.contextMenuTitle',
+ defaultMessage: 'Share this {objectType}',
+ },
+ {
+ objectType: this.props.objectType,
+ }
+ ),
items: menuItems
.map(menuItem => {
menuItem['data-test-subj'] = `sharePanel-${menuItem.name.replace(' ', '')}`;
@@ -161,3 +184,5 @@ export class ShareContextMenu extends Component {
return { panels, initialPanelId };
};
}
+
+export const ShareContextMenu = injectI18n(ShareContextMenuUI);
diff --git a/src/ui/public/share/components/url_panel_content.test.js b/src/ui/public/share/components/url_panel_content.test.js
index 025c282c83bc8..550631a47b02c 100644
--- a/src/ui/public/share/components/url_panel_content.test.js
+++ b/src/ui/public/share/components/url_panel_content.test.js
@@ -20,14 +20,14 @@
jest.mock('../lib/url_shortener', () => ({}));
import React from 'react';
-import { shallow } from 'enzyme';
+import { shallowWithIntl } from 'test_utils/enzyme_helpers';
import {
UrlPanelContent,
} from './url_panel_content';
test('render', () => {
- const component = shallow( {}}
/>);
@@ -35,7 +35,7 @@ test('render', () => {
});
test('should enable saved object export option when objectId is provided', () => {
- const component = shallow( {}}
diff --git a/src/ui/public/share/components/url_panel_content.tsx b/src/ui/public/share/components/url_panel_content.tsx
index 9e781ceb0f673..6b0109e3967fe 100644
--- a/src/ui/public/share/components/url_panel_content.tsx
+++ b/src/ui/public/share/components/url_panel_content.tsx
@@ -37,6 +37,8 @@ import { format as formatUrl, parse as parseUrl } from 'url';
import { unhashUrl } from '../../state_management/state_hashing';
import { shortenUrl } from '../lib/url_shortener';
+import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react';
+
// TODO: Remove once EuiIconTip supports "content" prop
const FixedEuiIconTip = EuiIconTip as React.SFC;
@@ -45,6 +47,7 @@ interface Props {
objectId?: string;
objectType: string;
getUnhashableStates: () => object[];
+ intl: InjectedIntl;
}
enum ExportUrlAsType {
@@ -60,7 +63,7 @@ interface State {
shortUrlErrorMsg?: string;
}
-export class UrlPanelContent extends Component {
+class UrlPanelContentUI extends Component {
private mounted?: boolean;
private shortUrlCache?: string;
@@ -108,7 +111,17 @@ export class UrlPanelContent extends Component {
data-test-subj="copyShareUrlButton"
size="s"
>
- Copy {this.props.isEmbedded ? 'iFrame code' : 'link'}
+ {this.props.isEmbedded ? (
+
+ ) : (
+
+ )}
)}
@@ -250,7 +263,15 @@ export class UrlPanelContent extends Component {
{
useShortUrl: false,
isCreatingShortUrl: false,
- shortUrlErrorMsg: `Unable to create short URL. Error: ${fetchError.message}`,
+ shortUrlErrorMsg: this.props.intl.formatMessage(
+ {
+ id: 'common.ui.share.urlPanel.unableCreateShortUrlErrorMessage',
+ defaultMessage: 'Unable to create short URL. Error: {errorMessage}',
+ },
+ {
+ errorMessage: fetchError.message,
+ }
+ ),
},
this.setUrl
);
@@ -263,9 +284,16 @@ export class UrlPanelContent extends Component {
{
id: ExportUrlAsType.EXPORT_URL_AS_SNAPSHOT,
label: this.renderWithIconTip(
- 'Snapshot',
- `Snapshot URLs encode the current state of the ${this.props.objectType} in the URL itself.
- Edits to the saved ${this.props.objectType} won't be visible via this URL.`
+ ,
+
),
['data-test-subj']: 'exportAsSnapshot',
},
@@ -273,10 +301,15 @@ export class UrlPanelContent extends Component {
id: ExportUrlAsType.EXPORT_URL_AS_SAVED_OBJECT,
disabled: this.isNotSaved(),
label: this.renderWithIconTip(
- 'Saved object',
- `You can share this URL with people to let them load the most recent saved version of this ${
- this.props.objectType
- }.`
+ ,
+
),
['data-test-subj']: 'exportAsSavedObject',
},
@@ -295,11 +328,25 @@ export class UrlPanelContent extends Component {
};
private renderExportAsRadioGroup = () => {
- const generateLinkAsHelp = this.isNotSaved()
- ? `Can't share as saved object until the ${this.props.objectType} has been saved.`
- : undefined;
+ const generateLinkAsHelp = this.isNotSaved() ? (
+
+ ) : (
+ undefined
+ );
return (
-
+
+ }
+ helpText={generateLinkAsHelp}
+ >
{
if (this.state.exportUrlAs === ExportUrlAsType.EXPORT_URL_AS_SAVED_OBJECT) {
return;
}
-
+ const shortUrlLabel = (
+
+ );
const switchLabel = this.state.isCreatingShortUrl ? (
- Short URL
+ {shortUrlLabel}
) : (
- 'Short URL'
+ shortUrlLabel
);
const switchComponent = (
{
data-test-subj="useShortUrl"
/>
);
- const tipContent = `We recommend sharing shortened snapshot URLs for maximum compatibility.
- Internet Explorer has URL length restrictions,
- and some wiki and markup parsers don't do well with the full-length version of the snapshot URL,
- but the short URL should work great.`;
+ const tipContent = (
+
+ );
return (
@@ -341,3 +395,5 @@ export class UrlPanelContent extends Component {
);
};
}
+
+export const UrlPanelContent = injectI18n(UrlPanelContentUI);