From 1511eb8d12575666bfad1db1f5faa16ebc357e30 Mon Sep 17 00:00:00 2001 From: Catherine Liu Date: Tue, 17 Sep 2019 15:58:20 -0700 Subject: [PATCH 1/4] This is a combination of 5 commits. Extracts i18n strings from sidebar_content Extracts i18n strings from element_settings Extracted i18n strings from workpad_config Extracts i18n strings from page_config Extracts i18n strings from group_settings Extracts i18n strings from element_config and multi_element_settings Extracted remaining strings from element_config Extracts i18n strings from sidebar_header Extracts i18n strings from custom_element_modal Fixed file picker placeholder Fixed i18n ids --- .../legacy/plugins/canvas/i18n/components.ts | 316 ++++++++++++++++++ .../custom_element_modal.tsx | 28 +- .../element_config/element_config.js | 13 +- .../public/components/page_config/index.js | 5 +- .../components/page_config/page_config.js | 14 +- .../element_settings/element_settings.tsx | 7 +- .../components/sidebar/group_settings.tsx | 7 +- .../sidebar/multi_element_settings.tsx | 10 +- .../components/sidebar/sidebar_content.js | 12 +- .../sidebar_header/sidebar_header.tsx | 92 ++--- .../workpad_config/workpad_config.js | 27 +- 11 files changed, 444 insertions(+), 87 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/i18n/components.ts b/x-pack/legacy/plugins/canvas/i18n/components.ts index cac44ddbe23e..17937dcec5db 100644 --- a/x-pack/legacy/plugins/canvas/i18n/components.ts +++ b/x-pack/legacy/plugins/canvas/i18n/components.ts @@ -129,6 +129,104 @@ export const ComponentStrings = { defaultMessage: 'Remove Color', }), }, + CustomElementModal: { + getNameInputLabel: () => + i18n.translate('xpack.canvas.customElementModal.nameInputLabel', { + defaultMessage: 'Name', + }), + getDescriptionInputLabel: () => + i18n.translate('xpack.canvas.customElementModal.descriptionInputLabel', { + defaultMessage: 'Description', + }), + getImageInputLabel: () => + i18n.translate('xpack.canvas.customElementModal.imageInputLabel', { + defaultMessage: 'Thumbnail image', + }), + getImageFilePickerPlaceholder: () => + i18n.translate('xpack.canvas.customElementModal.imageFilePickerPlaceholder', { + defaultMessage: 'Select or drag and drop an image', + }), + getImageInputDescription: () => + i18n.translate('xpack.canvas.customElementModal.imageInputDescription', { + defaultMessage: + 'Take a screenshot of your element and upload it here. This can also be done after saving.', + }), + getCharactersRemainingDescription: (numberOfRemainingCharacter: number) => + i18n.translate('xpack.canvas.customElementModal.remainingCharactersDescription', { + defaultMessage: '{numberOfRemainingCharacter} characters remaining', + values: { + numberOfRemainingCharacter, + }, + }), + getElementPreviewTitle: () => + i18n.translate('xpack.canvas.customElementModal.elementPreviewTitle', { + defaultMessage: 'Element preview', + }), + getCancelButtonLabel: () => + i18n.translate('xpack.canvas.customElementModal.cancelButtonLabel', { + defaultMessage: 'Cancel', + }), + getSaveButtonLabel: () => + i18n.translate('xpack.canvas.customElementModal.cancelButtonLabel', { + defaultMessage: 'Cancel', + }), + }, + ElementConfig: { + getTitle: () => + i18n.translate('xpack.canvas.elementConfig.title', { + defaultMessage: 'Elements', + description: + '"Elements" refers to the individual text, images, or visualizations that you can add to a Canvas workpad', + }), + getTotalLabel: () => + i18n.translate('xpack.canvas.elementConfig.totalLabel', { + defaultMessage: 'Total', + description: 'The label for the total number of elements in a workpad', + }), + getLoadedLabel: () => + i18n.translate('xpack.canvas.elementConfig.loadedLabel', { + defaultMessage: 'Loaded', + description: 'The label for the number of elements in a workpad that have loaded', + }), + getFailedLabel: () => + i18n.translate('xpack.canvas.elementConfig.failedLabel', { + defaultMessage: 'Failed', + description: + 'The label for the total number of elements in a workpad that have thrown an error or failed to load', + }), + getProgressLabel: () => + i18n.translate('xpack.canvas.elementConfig.progressLabel', { + defaultMessage: 'Progress', + description: 'The label for the percentage of elements that have finished loading', + }), + }, + ElementSettings: { + getDataTabLabel: () => + i18n.translate('xpack.canvas.elementSettings.dataTabLabel', { + defaultMessage: 'Data', + description: + 'This tab contains the settings for the data (i.e. Elasticsearch query) used as ' + + 'the source for a Canvas element', + }), + getDisplayTabLabel: () => + i18n.translate('xpack.canvas.elementSettings.displayTabLabel', { + defaultMessage: 'Display', + description: 'This tab contains the settings for how data is displayed in a Canvas element', + }), + }, + GroupSettings: { + getUngroupDescription: () => + i18n.translate('xpack.canvas.groupSettings.ungroupDescription', { + defaultMessage: 'Ungroup ({uKey}) to edit individual element settings.', + values: { + uKey: 'U', + }, + }), + getSaveGroupDescription: () => + i18n.translate('xpack.canvas.groupSettings.saveGroupDescription', { + defaultMessage: 'Save this group as a new element to re-use it throughout your workpad.', + }), + }, HelpMenu: { getHelpMenuDescription: () => i18n.translate('xpack.canvas.helpMenu.description', { @@ -165,6 +263,224 @@ export const ComponentStrings = { defaultMessage: 'Closes keyboard shortcuts reference', }), }, + MultiElementSettings: { + getMultipleElementsDescription: () => + i18n.translate('xpack.canvas.groupSettings.multipleElementsDescription', { + defaultMessage: 'Multiple elements are currently selected.', + }), + getMultipleElementsActionsDescription: () => + i18n.translate('xpack.canvas.groupSettings.multipleElementsActionsDescription', { + defaultMessage: + 'Deselect these elements to edit their individual settings, press ({gKey}) to group them, or save this selection as a new ' + + 'element to re-use it throughout your workpad.', + values: { + gKey: 'G', + }, + }), + }, + PageConfig: { + getBackgroundColorDescription: () => + i18n.translate('xpack.canvas.pageConfig.backgroundColorDescription', { + defaultMessage: 'Accepts HEX, RGB or HTML color names', + }), + getBackgroundColorLabel: () => + i18n.translate('xpack.canvas.pageConfig.backgroundColorLabel', { + defaultMessage: 'Background Color', + }), + getNoTransitionDropDownOptionLabel: () => + i18n.translate('xpack.canvas.pageConfig.transitions.noneDropDownOptionLabel', { + defaultMessage: 'None', + description: + 'This is the option the user should choose if they do not want any page transition (i.e. fade in, fade out, etc) to ' + + 'be applied to the current page.', + }), + getTitle: () => + i18n.translate('xpack.canvas.pageConfig.title', { + defaultMessage: 'Page', + }), + getTransitionLabel: () => + i18n.translate('xpack.canvas.pageConfig.transitionLabel', { + defaultMessage: 'Transition', + description: + 'This refers to the transition effect, such as fade in or rotate, applied to a page in presentation mode.', + }), + getTransitionPreviewLabel: () => + i18n.translate('xpack.canvas.pageConfig.transitionPreviewLabel', { + defaultMessage: 'Preview', + description: 'This is the label for a preview of the transition effect selected.', + }), + }, + SidebarContent: { + getGroupedElementSidebarTitle: () => + i18n.translate('xpack.canvas.sidebarContent.groupedElementSidebarTitle', { + defaultMessage: 'Grouped element', + description: + 'The title displayed when a grouped element is selected. "elements" refer to the different visualizations, images, ' + + 'text, etc that can be added in a Canvas workpad. These elements can be grouped into a larger "grouped element" ' + + 'that contains multiple individual elements.', + }), + getMultiElementSidebarTitle: () => + i18n.translate('xpack.canvas.sidebarContent.multiElementSidebarTitle', { + defaultMessage: 'Multiple elements', + description: + 'The title displayed when multiple elements are selected. "elements" refer to the different visualizations, images, ' + + 'text, etc that can be added in a Canvas workpad.', + }), + getSingleElementSidebarTitle: () => + i18n.translate('xpack.canvas.sidebarContent.singleElementSidebarTitle', { + defaultMessage: 'Selected element', + description: + 'The title displayed when a single element are selected. "element" refer to the different visualizations, images, ' + + 'text, etc that can be added in a Canvas workpad.', + }), + }, + SidebarHeader: { + getBringForwardAriaLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.bringForwardArialLabel', { + defaultMessage: 'Move element up one layer', + }), + getBringToFrontAriaLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.bringToFrontArialLabel', { + defaultMessage: 'Move element to top layer', + }), + getSendBackwardAriaLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.sendBackwardArialLabel', { + defaultMessage: 'Move element down one layer', + }), + getSendToBackAriaLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.sendToBackArialLabel', { + defaultMessage: 'Move element to bottom layer', + }), + getContextMenuTitle: () => + i18n.translate('xpack.canvas.sidebarHeader.contextMenuAriaLabel', { + defaultMessage: 'Element options', + }), + getOrderMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.orderMenuItemLabel', { + defaultMessage: 'Order', + description: 'Refers to the order of the elements displayed on the page from front to back', + }), + getAlignmentMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.alignmentMenuItemLabel', { + defaultMessage: 'Alignment', + description: + 'This refers to the vertical (i.e. left, center, right) and horizontal (i.e. top, middle, bottom) ' + + 'alignment options of the selected elements', + }), + getLeftAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.leftAlignMenuItemLabel', { + defaultMessage: 'Left', + }), + getCenterAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.centerAlignMenuItemLabel', { + defaultMessage: 'Center', + description: 'This refers to alignment centered horizontally.', + }), + getRightAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.rightAlignMenuItemLabel', { + defaultMessage: 'Right', + }), + getTopAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.topAlignMenuItemLabel', { + defaultMessage: 'Top', + }), + getMiddleAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.middleAlignMenuItemLabel', { + defaultMessage: 'Middle', + description: 'This refers to alignment centered vertically.', + }), + getBottomAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.bottomAlignMenuItemLabel', { + defaultMessage: 'Bottom', + }), + getDistributionMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.distributionMenutItemLabel', { + defaultMessage: 'Distribution', + description: + 'This refers to the options to evenly spacing the selected elements horizontall or vertically.', + }), + getHorizontalDistributionMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.horizontalDistributionMenutItemLabel', { + defaultMessage: 'Horizontal', + }), + getVerticalDistributionMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.verticalDistributionMenutItemLabel', { + defaultMessage: 'Vertical', + }), + getUngroupMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.ungroupMenuItemLabel', { + defaultMessage: 'Ungroup', + description: 'This refers to ungrouping a grouped element', + }), + getGroupMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.groupMenuItemLabel', { + defaultMessage: 'Group', + description: 'This refers to grouping multiple selected elements.', + }), + getSaveElementMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.savedElementMenuItemLabel', { + defaultMessage: 'Save as new element', + }), + getCreateElementModalTitle: () => + i18n.translate('xpack.canvas.sidebarHeader.createElementModalTitle', { + defaultMessage: 'Create new element', + }), + }, + WorkpadConfig: { + getApplyStylesheetButtonLabel: () => + i18n.translate('xpack.canvas.workpadConfig.applyStylesheetButtonLabel', { + defaultMessage: `Apply stylesheet`, + description: + '"stylesheet" refers to the collection of CSS style rules entered by the user.', + }), + getFlipDimensionTooltip: () => + i18n.translate('xpack.canvas.workpadConfig.swapDimensionsTooltip', { + defaultMessage: 'Swap the width and height', + }), + getFlipDimensionAriaLabel: () => + i18n.translate('xpack.canvas.workpadConfig.swapDimensionsAriaLabel', { + defaultMessage: `Swap the page's width and height`, + }), + getGlobalCSSLabel: () => + i18n.translate('xpack.canvas.workpadConfig.globalCSSLabel', { + defaultMessage: `Global CSS overrides`, + }), + getGlobalCSSTooltip: () => + i18n.translate('xpack.canvas.workpadConfig.globalCSSTooltip', { + defaultMessage: `Apply styles to all pages in this workpad`, + }), + getPageHeightLabel: () => + i18n.translate('xpack.canvas.workpadConfig.heightLabel', { + defaultMessage: 'Height', + }), + getPageSizeBadgeAriaLabel: (sizeName: string) => + i18n.translate('xpack.canvas.workpadConfig.pageSizeBadgeAriaLabel', { + defaultMessage: `Preset page size: {sizeName}`, + values: { + sizeName, + }, + }), + getPageSizeBadgeOnClickAriaLabel: (sizeName: string) => + i18n.translate('xpack.canvas.workpadConfig.pageSizeBadgeOnClickAriaLabel', { + defaultMessage: `Set page size to {sizeName}`, + values: { + sizeName, + }, + }), + getPageWidthLabel: () => + i18n.translate('xpack.canvas.workpadConfig.widthLabel', { + defaultMessage: 'Width', + }), + getTitle: () => + i18n.translate('xpack.canvas.workpadConfig.title', { + defaultMessage: 'Workpad', + }), + getUSLetterButtonLabel: () => + i18n.translate('xpack.canvas.workpadConfig.USLetterButtonLabel', { + defaultMessage: 'US Letter', + description: 'This is referring to the dimentions of U.S. standard letter paper.', + }), + }, WorkpadCreate: { getWorkpadCreateButtonLabel: () => i18n.translate('xpack.canvas.workpadCreate.createButtonLabel', { diff --git a/x-pack/legacy/plugins/canvas/public/components/custom_element_modal/custom_element_modal.tsx b/x-pack/legacy/plugins/canvas/public/components/custom_element_modal/custom_element_modal.tsx index 5f6e0fc9e7bc..b5d08d98072a 100644 --- a/x-pack/legacy/plugins/canvas/public/components/custom_element_modal/custom_element_modal.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/custom_element_modal/custom_element_modal.tsx @@ -31,10 +31,13 @@ import { import { VALID_IMAGE_TYPES } from '../../../common/lib/constants'; import { encode } from '../../../common/lib/dataurl'; import { ElementCard } from '../element_card'; +import { ComponentStrings } from '../../../i18n'; const MAX_NAME_LENGTH = 40; const MAX_DESCRIPTION_LENGTH = 100; +const { CustomElementModal: strings } = ComponentStrings; + interface Props { /** * initial value of the name of the custom element @@ -126,8 +129,8 @@ export class CustomElementModal extends PureComponent { { /> { -

- Take a screenshot of your element and upload it here. This can also be done after - saving. -

+

{strings.getImageInputDescription()}

 { grow={1} > -

Element preview

+

{strings.getElementPreviewTitle()}

 @@ -187,7 +189,7 @@ export class CustomElementModal extends PureComponent { - Cancel + {strings.getCancelButtonLabel()} { onSave(name, description, image); }} > - Save + {strings.getSaveButtonLabel()} diff --git a/x-pack/legacy/plugins/canvas/public/components/element_config/element_config.js b/x-pack/legacy/plugins/canvas/public/components/element_config/element_config.js index e5ae93365580..76007994e56b 100644 --- a/x-pack/legacy/plugins/canvas/public/components/element_config/element_config.js +++ b/x-pack/legacy/plugins/canvas/public/components/element_config/element_config.js @@ -7,6 +7,9 @@ import { EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiStat, EuiTitle } from '@elastic/eui'; import PropTypes from 'prop-types'; import React, { Fragment } from 'react'; +import { ComponentStrings } from '../../../i18n'; + +const { ElementConfig: strings } = ComponentStrings; export const ElementConfig = ({ elementStats }) => { if (!elementStats) { @@ -19,21 +22,21 @@ export const ElementConfig = ({ elementStats }) => { return ( -

Elements

+

{strings.getTitle()}

 - + - + - + - + diff --git a/x-pack/legacy/plugins/canvas/public/components/page_config/index.js b/x-pack/legacy/plugins/canvas/public/components/page_config/index.js index fb216af66763..a0692584d498 100644 --- a/x-pack/legacy/plugins/canvas/public/components/page_config/index.js +++ b/x-pack/legacy/plugins/canvas/public/components/page_config/index.js @@ -9,8 +9,11 @@ import { get } from 'lodash'; import { transitionsRegistry } from '../../lib/transitions_registry'; import { getSelectedPageIndex, getPages } from '../../state/selectors/workpad'; import { stylePage, setPageTransition } from '../../state/actions/pages'; +import { ComponentStrings } from '../../../i18n'; import { PageConfig as Component } from './page_config'; +const { PageConfig: strings } = ComponentStrings; + const mapStateToProps = state => { const pageIndex = getSelectedPageIndex(state); const page = getPages(state)[pageIndex]; @@ -28,7 +31,7 @@ const mergeProps = (stateProps, dispatchProps) => { }, background: get(stateProps, 'page.style.background'), transition: transitionsRegistry.get(get(stateProps, 'page.transition.name')), - transitions: [{ value: '', text: 'None' }].concat( + transitions: [{ value: '', text: strings.getNoTransitionDropDownOptionLabel() }].concat( transitionsRegistry.toArray().map(({ name, displayName }) => ({ value: name, text: displayName, diff --git a/x-pack/legacy/plugins/canvas/public/components/page_config/page_config.js b/x-pack/legacy/plugins/canvas/public/components/page_config/page_config.js index 276aad3c2786..618e3d74b86f 100644 --- a/x-pack/legacy/plugins/canvas/public/components/page_config/page_config.js +++ b/x-pack/legacy/plugins/canvas/public/components/page_config/page_config.js @@ -8,6 +8,9 @@ import React, { Fragment } from 'react'; import PropTypes from 'prop-types'; import { EuiCard, EuiFormRow, EuiTitle, EuiSpacer, EuiSelect } from '@elastic/eui'; import { WorkpadColorPicker } from '../workpad_color_picker'; +import { ComponentStrings } from '../../../i18n'; + +const { PageConfig: strings } = ComponentStrings; export const PageConfig = ({ pageIndex, @@ -20,10 +23,13 @@ export const PageConfig = ({ return ( -

Page

+

{strings.getTitle()}

 - + {/* No need to show the transition for the first page because transitions occur when @@ -31,7 +37,7 @@ export const PageConfig = ({ page, we use the second page's transition) */} {pageIndex > 0 ? ( - + {transition ? ( - + = ({ element }) => { const tabs = [ { id: 'edit', - name: 'Display', + name: strings.getDisplayTabLabel(), content: (
@@ -36,7 +39,7 @@ export const ElementSettings: FunctionComponent = ({ element }) => { }, { id: 'data', - name: 'Data', + name: strings.getDataTabLabel(), content: (
diff --git a/x-pack/legacy/plugins/canvas/public/components/sidebar/group_settings.tsx b/x-pack/legacy/plugins/canvas/public/components/sidebar/group_settings.tsx index a514ef15b661..b46465d9ec77 100644 --- a/x-pack/legacy/plugins/canvas/public/components/sidebar/group_settings.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/sidebar/group_settings.tsx @@ -6,10 +6,13 @@ import React, { FunctionComponent } from 'react'; import { EuiText } from '@elastic/eui'; +import { ComponentStrings } from '../../../i18n'; + +const { GroupSettings: strings } = ComponentStrings; export const GroupSettings: FunctionComponent = () => ( -

Ungroup (U) to edit individual element settings.

-

Save this group as a new element to re-use it throughout your workpad.

+

{strings.getUngroupDescription()}

+

{strings.getSaveGroupDescription()}

 ); diff --git a/x-pack/legacy/plugins/canvas/public/components/sidebar/multi_element_settings.tsx b/x-pack/legacy/plugins/canvas/public/components/sidebar/multi_element_settings.tsx index a3922aaac864..2de3a805c95e 100644 --- a/x-pack/legacy/plugins/canvas/public/components/sidebar/multi_element_settings.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/sidebar/multi_element_settings.tsx @@ -6,13 +6,13 @@ import React, { FunctionComponent } from 'react'; import { EuiText } from '@elastic/eui'; +import { ComponentStrings } from '../../../i18n'; + +const { MultiElementSettings: strings } = ComponentStrings; export const MultiElementSettings: FunctionComponent = () => ( -

Multiple elements are currently selected.

-

- Deselect these elements to edit their individual settings, press (G) to group them, or save - this selection as a new element to re-use it throughout your workpad. -

+

{strings.getMultipleElementsDescription()}

+

{strings.getMultipleElementsActionsDescription()}

 ); diff --git a/x-pack/legacy/plugins/canvas/public/components/sidebar/sidebar_content.js b/x-pack/legacy/plugins/canvas/public/components/sidebar/sidebar_content.js index fe53203684f5..825ea8a4f249 100644 --- a/x-pack/legacy/plugins/canvas/public/components/sidebar/sidebar_content.js +++ b/x-pack/legacy/plugins/canvas/public/components/sidebar/sidebar_content.js @@ -11,11 +11,14 @@ import { EuiSpacer } from '@elastic/eui'; import { getSelectedToplevelNodes, getSelectedElementId } from '../../state/selectors/workpad'; import { SidebarHeader } from '../sidebar_header'; import { globalStateUpdater } from '../workpad_page/integration_utils'; +import { ComponentStrings } from '../../../i18n'; import { MultiElementSettings } from './multi_element_settings'; import { GroupSettings } from './group_settings'; import { GlobalConfig } from './global_config'; import { ElementSettings } from './element_settings'; +const { SidebarContent: strings } = ComponentStrings; + const mapStateToProps = state => ({ selectedToplevelNodes: getSelectedToplevelNodes(state), selectedElementId: getSelectedElementId(state), @@ -42,7 +45,10 @@ const withGlobalState = (commit, updateGlobalState) => (type, payload) => { const MultiElementSidebar = ({ commit, updateGlobalState }) => ( - + @@ -51,7 +57,7 @@ const MultiElementSidebar = ({ commit, updateGlobalState }) => ( const GroupedElementSidebar = ({ commit, updateGlobalState }) => ( @@ -62,7 +68,7 @@ const GroupedElementSidebar = ({ commit, updateGlobalState }) => ( const SingleElementSidebar = ({ selectedElementId }) => ( - + ); diff --git a/x-pack/legacy/plugins/canvas/public/components/sidebar_header/sidebar_header.tsx b/x-pack/legacy/plugins/canvas/public/components/sidebar_header/sidebar_header.tsx index d505cbc9d71b..0ac4c1e41cea 100644 --- a/x-pack/legacy/plugins/canvas/public/components/sidebar_header/sidebar_header.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/sidebar_header/sidebar_header.tsx @@ -21,9 +21,13 @@ import { import { Popover } from '../popover'; import { CustomElementModal } from '../custom_element_modal'; import { ToolTipShortcut } from '../tool_tip_shortcut/'; +import { ComponentStrings, ShortcutStrings } from '../../../i18n'; const topBorderClassName = 'canvasContextMenu--topBorder'; +const { SidebarHeader: strings } = ComponentStrings; +const shortcutHelp = ShortcutStrings.getShortcutHelp(); + interface Props { /** * title to display in the header @@ -140,7 +144,7 @@ const contextMenuButton = (handleClick: (event: MouseEvent) => void) => ( color="text" iconType="boxesVertical" onClick={handleClick} - aria-label="Element options" + aria-label={strings.getContextMenuTitle()} /> ); @@ -203,7 +207,7 @@ export class SidebarHeader extends Component { position="bottom" content={ - Bring to front + {shortcutHelp.BRING_TO_FRONT} } @@ -212,7 +216,7 @@ export class SidebarHeader extends Component { color="text" iconType="sortUp" onClick={bringToFront} - aria-label="Move element to top layer" + aria-label={strings.getBringToFrontAriaLabel()} /> @@ -221,7 +225,7 @@ export class SidebarHeader extends Component { position="bottom" content={ - Bring forward + {shortcutHelp.BRING_FORWARD} } @@ -230,7 +234,7 @@ export class SidebarHeader extends Component { color="text" iconType="arrowUp" onClick={bringForward} - aria-label="Move element up one layer" + aria-label={strings.getBringForwardAriaLabel()} /> @@ -239,7 +243,7 @@ export class SidebarHeader extends Component { position="bottom" content={ - Send backward + {shortcutHelp.SEND_BACKWARD} } @@ -248,7 +252,7 @@ export class SidebarHeader extends Component { color="text" iconType="arrowDown" onClick={sendBackward} - aria-label="Move element down one layer" + aria-label={strings.getSendBackwardAriaLabel()} /> @@ -257,7 +261,7 @@ export class SidebarHeader extends Component { position="bottom" content={ - Send to back + {shortcutHelp.SEND_TO_BACK} } @@ -266,7 +270,7 @@ export class SidebarHeader extends Component { color="text" iconType="sortDown" onClick={sendToBack} - aria-label="Move element to bottom layer" + aria-label={strings.getSendToBackAriaLabel()} /> @@ -278,28 +282,28 @@ export class SidebarHeader extends Component { const { bringToFront, bringForward, sendBackward, sendToBack } = this.props; return { - menuItem: { name: 'Order', className: topBorderClassName, panel: 1 }, + menuItem: { name: strings.getOrderMenuItemLabel(), className: topBorderClassName, panel: 1 }, panel: { id: 1, - title: 'Order', + title: strings.getOrderMenuItemLabel(), items: [ { - name: 'Bring to front', // TODO: check against current element position and disable if already top layer + name: shortcutHelp.BRING_TO_FRONT, // TODO: check against current element position and disable if already top layer icon: 'sortUp', onClick: bringToFront, }, { - name: 'Bring forward', // TODO: same as above + name: shortcutHelp.BRING_TO_FRONT, // TODO: same as above icon: 'arrowUp', onClick: bringForward, }, { - name: 'Send backward', // TODO: check against current element position and disable if already bottom layer + name: shortcutHelp.SEND_BACKWARD, // TODO: check against current element position and disable if already bottom layer icon: 'arrowDown', onClick: sendBackward, }, { - name: 'Send to back', // TODO: same as above + name: shortcutHelp.SEND_TO_BACK, // TODO: same as above icon: 'sortDown', onClick: sendToBack, }, @@ -312,38 +316,42 @@ export class SidebarHeader extends Component { const { alignLeft, alignCenter, alignRight, alignTop, alignMiddle, alignBottom } = this.props; return { - menuItem: { name: 'Align elements', className: 'canvasContextMenu', panel: 2 }, + menuItem: { + name: strings.getAlignmentMenuItemLabel(), + className: 'canvasContextMenu', + panel: 2, + }, panel: { id: 2, - title: 'Alignment', + title: strings.getAlignmentMenuItemLabel(), items: [ { - name: 'Left', + name: strings.getLeftAlignMenuItemLabel(), icon: 'editorItemAlignLeft', onClick: close(alignLeft), }, { - name: 'Center', + name: strings.getCenterAlignMenuItemLabel(), icon: 'editorItemAlignCenter', onClick: close(alignCenter), }, { - name: 'Right', + name: strings.getRightAlignMenuItemLabel(), icon: 'editorItemAlignRight', onClick: close(alignRight), }, { - name: 'Top', + name: strings.getTopAlignMenuItemLabel(), icon: 'editorItemAlignTop', onClick: close(alignTop), }, { - name: 'Middle', + name: strings.getMiddleAlignMenuItemLabel(), icon: 'editorItemAlignMiddle', onClick: close(alignMiddle), }, { - name: 'Bottom', + name: strings.getBottomAlignMenuItemLabel(), icon: 'editorItemAlignBottom', onClick: close(alignBottom), }, @@ -356,18 +364,22 @@ export class SidebarHeader extends Component { const { distributeHorizontally, distributeVertically } = this.props; return { - menuItem: { name: 'Distribute elements', className: 'canvasContextMenu', panel: 3 }, + menuItem: { + name: strings.getDistributionMenuItemLabel(), + className: 'canvasContextMenu', + panel: 3, + }, panel: { id: 3, - title: 'Distribution', + title: strings.getDistributionMenuItemLabel(), items: [ { - name: 'Horizontal', + name: strings.getHorizontalDistributionMenuItemLabel(), icon: 'editorDistributeHorizontal', onClick: close(distributeHorizontally), }, { - name: 'Vertical', + name: strings.getVerticalDistributionMenuItemLabel(), icon: 'editorDistributeVertical', onClick: close(distributeVertically), }, @@ -383,7 +395,7 @@ export class SidebarHeader extends Component { return groupIsSelected ? [ { - name: 'Ungroup', + name: strings.getUngroupMenuItemLabel(), className: topBorderClassName, onClick: close(ungroupNodes), }, @@ -391,7 +403,7 @@ export class SidebarHeader extends Component { : selectedNodes.length > 1 ? [ { - name: 'Group', + name: strings.getGroupMenuItemLabel(), className: topBorderClassName, onClick: close(groupNodes), }, @@ -417,27 +429,27 @@ export class SidebarHeader extends Component { const items: EuiContextMenuPanelItemDescriptor[] = [ { - name: 'Cut', + name: shortcutHelp.CUT, icon: 'cut', onClick: close(cutNodes), }, { - name: 'Copy', + name: shortcutHelp.COPY, icon: 'copy', onClick: copyNodes, }, { - name: 'Paste', // TODO: can this be disabled if clipboard is empty? + name: shortcutHelp.PASTE, // TODO: can this be disabled if clipboard is empty? icon: 'copyClipboard', onClick: close(pasteNodes), }, { - name: 'Delete', + name: shortcutHelp.DELETE, icon: 'trash', onClick: close(deleteNodes), }, { - name: 'Clone', + name: shortcutHelp.CLONE, onClick: close(cloneNodes), }, ...this._getGroupMenuItems(close), @@ -446,7 +458,7 @@ export class SidebarHeader extends Component { const panels: EuiContextMenuPanelDescriptor[] = [ { id: 0, - title: 'Element options', + title: strings.getContextMenuTitle(), items, }, ]; @@ -469,7 +481,7 @@ export class SidebarHeader extends Component { } items.push({ - name: 'Save as new element', + name: strings.getSaveElementMenuItemLabel(), icon: 'indexOpen', className: topBorderClassName, onClick: this._showModal, @@ -484,7 +496,7 @@ export class SidebarHeader extends Component { className="canvasContextMenu" button={contextMenuButton} panelPaddingSize="none" - tooltip="Element options" + tooltip={strings.getContextMenuTitle()} tooltipPosition="bottom" > {({ closePopover }: { closePopover: () => void }) => ( @@ -520,12 +532,12 @@ export class SidebarHeader extends Component { {showLayerControls ? this._renderLayoutControls() : null} - + @@ -536,7 +548,7 @@ export class SidebarHeader extends Component { {isModalVisible ? ( diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js b/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js index 7001d043c5a4..90abdfe28d4c 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js @@ -23,6 +23,9 @@ import { EuiButton, } from '@elastic/eui'; import { DEFAULT_WORKPAD_CSS } from '../../../common/lib/constants'; +import { ComponentStrings } from '../../../i18n'; + +const { WorkpadConfig: strings } = ComponentStrings; export class WorkpadConfig extends PureComponent { static propTypes = { @@ -57,7 +60,7 @@ export class WorkpadConfig extends PureComponent { size: { height: 842, width: 590 }, }, { - name: 'US Letter', + name: strings.getUSLetterButtonLabel(), size: { height: 792, width: 612 }, }, ]; @@ -65,7 +68,7 @@ export class WorkpadConfig extends PureComponent { return (
-

Workpad

+

{strings.getTitle()}

 @@ -78,7 +81,7 @@ export class WorkpadConfig extends PureComponent { - + setSize({ width: Number(e.target.value), height: size.height })} value={size.width} @@ -87,19 +90,19 @@ export class WorkpadConfig extends PureComponent { - + - + setSize({ height: Number(e.target.value), width: size.width })} value={size.height} @@ -116,8 +119,8 @@ export class WorkpadConfig extends PureComponent { key={`page-size-badge-${i}`} color="hollow" onClick={() => setSize(badge.size)} - aria-label={`Preset Page Size: ${badge.name}`} - onClickAriaLabel={`Set page size to ${badge.name}`} + aria-label={strings.getPageSizeBadgeAriaLabel(badge.name)} + onClickAriaLabel={strings.getPageSizeBadgeOnClickAriaLabel(badge.name)} > {badge.name} @@ -131,26 +134,26 @@ export class WorkpadConfig extends PureComponent { className="canvasArg__accordion" buttonContent={ - Global CSS overrides + {strings.getGlobalCSSLabel()} } >
this.setState({ css: e.target.value })} rows={10} /> setWorkpadCSS(css || DEFAULT_WORKPAD_CSS)}> - Apply stylesheet + {strings.getApplyStylesheetButtonLabel()}
From c7184497083740676361444fb78fe4ecdac47247 Mon Sep 17 00:00:00 2001 From: Catherine Liu Date: Mon, 23 Sep 2019 22:25:05 -0700 Subject: [PATCH 2/4] Alphabetize keys --- .../legacy/plugins/canvas/i18n/components.ts | 242 +++++++++--------- 1 file changed, 121 insertions(+), 121 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/i18n/components.ts b/x-pack/legacy/plugins/canvas/i18n/components.ts index 17937dcec5db..fffbe9cd83a0 100644 --- a/x-pack/legacy/plugins/canvas/i18n/components.ts +++ b/x-pack/legacy/plugins/canvas/i18n/components.ts @@ -130,41 +130,41 @@ export const ComponentStrings = { }), }, CustomElementModal: { - getNameInputLabel: () => - i18n.translate('xpack.canvas.customElementModal.nameInputLabel', { - defaultMessage: 'Name', + getCancelButtonLabel: () => + i18n.translate('xpack.canvas.customElementModal.cancelButtonLabel', { + defaultMessage: 'Cancel', + }), + getCharactersRemainingDescription: (numberOfRemainingCharacter: number) => + i18n.translate('xpack.canvas.customElementModal.remainingCharactersDescription', { + defaultMessage: '{numberOfRemainingCharacter} characters remaining', + values: { + numberOfRemainingCharacter, + }, }), getDescriptionInputLabel: () => i18n.translate('xpack.canvas.customElementModal.descriptionInputLabel', { defaultMessage: 'Description', }), - getImageInputLabel: () => - i18n.translate('xpack.canvas.customElementModal.imageInputLabel', { - defaultMessage: 'Thumbnail image', + getElementPreviewTitle: () => + i18n.translate('xpack.canvas.customElementModal.elementPreviewTitle', { + defaultMessage: 'Element preview', }), getImageFilePickerPlaceholder: () => i18n.translate('xpack.canvas.customElementModal.imageFilePickerPlaceholder', { defaultMessage: 'Select or drag and drop an image', }), + getImageInputLabel: () => + i18n.translate('xpack.canvas.customElementModal.imageInputLabel', { + defaultMessage: 'Thumbnail image', + }), getImageInputDescription: () => i18n.translate('xpack.canvas.customElementModal.imageInputDescription', { defaultMessage: 'Take a screenshot of your element and upload it here. This can also be done after saving.', }), - getCharactersRemainingDescription: (numberOfRemainingCharacter: number) => - i18n.translate('xpack.canvas.customElementModal.remainingCharactersDescription', { - defaultMessage: '{numberOfRemainingCharacter} characters remaining', - values: { - numberOfRemainingCharacter, - }, - }), - getElementPreviewTitle: () => - i18n.translate('xpack.canvas.customElementModal.elementPreviewTitle', { - defaultMessage: 'Element preview', - }), - getCancelButtonLabel: () => - i18n.translate('xpack.canvas.customElementModal.cancelButtonLabel', { - defaultMessage: 'Cancel', + getNameInputLabel: () => + i18n.translate('xpack.canvas.customElementModal.nameInputLabel', { + defaultMessage: 'Name', }), getSaveButtonLabel: () => i18n.translate('xpack.canvas.customElementModal.cancelButtonLabel', { @@ -172,33 +172,33 @@ export const ComponentStrings = { }), }, ElementConfig: { - getTitle: () => - i18n.translate('xpack.canvas.elementConfig.title', { - defaultMessage: 'Elements', + getFailedLabel: () => + i18n.translate('xpack.canvas.elementConfig.failedLabel', { + defaultMessage: 'Failed', description: - '"Elements" refers to the individual text, images, or visualizations that you can add to a Canvas workpad', - }), - getTotalLabel: () => - i18n.translate('xpack.canvas.elementConfig.totalLabel', { - defaultMessage: 'Total', - description: 'The label for the total number of elements in a workpad', + 'The label for the total number of elements in a workpad that have thrown an error or failed to load', }), getLoadedLabel: () => i18n.translate('xpack.canvas.elementConfig.loadedLabel', { defaultMessage: 'Loaded', description: 'The label for the number of elements in a workpad that have loaded', }), - getFailedLabel: () => - i18n.translate('xpack.canvas.elementConfig.failedLabel', { - defaultMessage: 'Failed', - description: - 'The label for the total number of elements in a workpad that have thrown an error or failed to load', - }), getProgressLabel: () => i18n.translate('xpack.canvas.elementConfig.progressLabel', { defaultMessage: 'Progress', description: 'The label for the percentage of elements that have finished loading', }), + getTitle: () => + i18n.translate('xpack.canvas.elementConfig.title', { + defaultMessage: 'Elements', + description: + '"Elements" refers to the individual text, images, or visualizations that you can add to a Canvas workpad', + }), + getTotalLabel: () => + i18n.translate('xpack.canvas.elementConfig.totalLabel', { + defaultMessage: 'Total', + description: 'The label for the total number of elements in a workpad', + }), }, ElementSettings: { getDataTabLabel: () => @@ -215,6 +215,10 @@ export const ComponentStrings = { }), }, GroupSettings: { + getSaveGroupDescription: () => + i18n.translate('xpack.canvas.groupSettings.saveGroupDescription', { + defaultMessage: 'Save this group as a new element to re-use it throughout your workpad.', + }), getUngroupDescription: () => i18n.translate('xpack.canvas.groupSettings.ungroupDescription', { defaultMessage: 'Ungroup ({uKey}) to edit individual element settings.', @@ -222,22 +226,18 @@ export const ComponentStrings = { uKey: 'U', }, }), - getSaveGroupDescription: () => - i18n.translate('xpack.canvas.groupSettings.saveGroupDescription', { - defaultMessage: 'Save this group as a new element to re-use it throughout your workpad.', - }), }, HelpMenu: { - getHelpMenuDescription: () => - i18n.translate('xpack.canvas.helpMenu.description', { - defaultMessage: 'For {CANVAS} specific information', + getDocumentationLinkLabel: () => + i18n.translate('xpack.canvas.helpMenu.documentationLinkLabel', { + defaultMessage: '{CANVAS} documentation', values: { CANVAS, }, }), - getDocumentationLinkLabel: () => - i18n.translate('xpack.canvas.helpMenu.documentationLinkLabel', { - defaultMessage: '{CANVAS} documentation', + getHelpMenuDescription: () => + i18n.translate('xpack.canvas.helpMenu.description', { + defaultMessage: 'For {CANVAS} specific information', values: { CANVAS, }, @@ -248,9 +248,9 @@ export const ComponentStrings = { }), }, KeyboardShortcutsDoc: { - getTitle: () => - i18n.translate('xpack.canvas.keyboardShortcutsDoc.flyoutHeaderTitle', { - defaultMessage: 'Keyboard Shortcuts', + getFlyoutCloseButtonAriaLabel: () => + i18n.translate('xpack.canvas.keyboardShortcutsDoc.flyout.closeButtonAriaLabel', { + defaultMessage: 'Closes keyboard shortcuts reference', }), getShortcutSeparator: () => i18n.translate('xpack.canvas.keyboardShortcutsDoc.shortcutListSeparator', { @@ -258,16 +258,12 @@ export const ComponentStrings = { description: 'Separates which keyboard shortcuts can be used for a single action. Example: "{shortcut1} or {shortcut2} or {shortcut3}"', }), - getFlyoutCloseButtonAriaLabel: () => - i18n.translate('xpack.canvas.keyboardShortcutsDoc.flyout.closeButtonAriaLabel', { - defaultMessage: 'Closes keyboard shortcuts reference', + getTitle: () => + i18n.translate('xpack.canvas.keyboardShortcutsDoc.flyoutHeaderTitle', { + defaultMessage: 'Keyboard Shortcuts', }), }, MultiElementSettings: { - getMultipleElementsDescription: () => - i18n.translate('xpack.canvas.groupSettings.multipleElementsDescription', { - defaultMessage: 'Multiple elements are currently selected.', - }), getMultipleElementsActionsDescription: () => i18n.translate('xpack.canvas.groupSettings.multipleElementsActionsDescription', { defaultMessage: @@ -277,6 +273,10 @@ export const ComponentStrings = { gKey: 'G', }, }), + getMultipleElementsDescription: () => + i18n.translate('xpack.canvas.groupSettings.multipleElementsDescription', { + defaultMessage: 'Multiple elements are currently selected.', + }), }, PageConfig: { getBackgroundColorDescription: () => @@ -335,6 +335,17 @@ export const ComponentStrings = { }), }, SidebarHeader: { + getAlignmentMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.alignmentMenuItemLabel', { + defaultMessage: 'Alignment', + description: + 'This refers to the vertical (i.e. left, center, right) and horizontal (i.e. top, middle, bottom) ' + + 'alignment options of the selected elements', + }), + getBottomAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.bottomAlignMenuItemLabel', { + defaultMessage: 'Bottom', + }), getBringForwardAriaLabel: () => i18n.translate('xpack.canvas.sidebarHeader.bringForwardArialLabel', { defaultMessage: 'Move element up one layer', @@ -343,87 +354,76 @@ export const ComponentStrings = { i18n.translate('xpack.canvas.sidebarHeader.bringToFrontArialLabel', { defaultMessage: 'Move element to top layer', }), - getSendBackwardAriaLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.sendBackwardArialLabel', { - defaultMessage: 'Move element down one layer', - }), - getSendToBackAriaLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.sendToBackArialLabel', { - defaultMessage: 'Move element to bottom layer', + getCenterAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.centerAlignMenuItemLabel', { + defaultMessage: 'Center', + description: 'This refers to alignment centered horizontally.', }), getContextMenuTitle: () => i18n.translate('xpack.canvas.sidebarHeader.contextMenuAriaLabel', { defaultMessage: 'Element options', }), - getOrderMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.orderMenuItemLabel', { - defaultMessage: 'Order', - description: 'Refers to the order of the elements displayed on the page from front to back', + getCreateElementModalTitle: () => + i18n.translate('xpack.canvas.sidebarHeader.createElementModalTitle', { + defaultMessage: 'Create new element', }), - getAlignmentMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.alignmentMenuItemLabel', { - defaultMessage: 'Alignment', + getDistributionMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.distributionMenutItemLabel', { + defaultMessage: 'Distribution', description: - 'This refers to the vertical (i.e. left, center, right) and horizontal (i.e. top, middle, bottom) ' + - 'alignment options of the selected elements', + 'This refers to the options to evenly spacing the selected elements horizontall or vertically.', + }), + getGroupMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.groupMenuItemLabel', { + defaultMessage: 'Group', + description: 'This refers to grouping multiple selected elements.', + }), + getHorizontalDistributionMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.horizontalDistributionMenutItemLabel', { + defaultMessage: 'Horizontal', }), getLeftAlignMenuItemLabel: () => i18n.translate('xpack.canvas.sidebarHeader.leftAlignMenuItemLabel', { defaultMessage: 'Left', }), - getCenterAlignMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.centerAlignMenuItemLabel', { - defaultMessage: 'Center', - description: 'This refers to alignment centered horizontally.', - }), - getRightAlignMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.rightAlignMenuItemLabel', { - defaultMessage: 'Right', - }), - getTopAlignMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.topAlignMenuItemLabel', { - defaultMessage: 'Top', - }), getMiddleAlignMenuItemLabel: () => i18n.translate('xpack.canvas.sidebarHeader.middleAlignMenuItemLabel', { defaultMessage: 'Middle', description: 'This refers to alignment centered vertically.', }), - getBottomAlignMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.bottomAlignMenuItemLabel', { - defaultMessage: 'Bottom', + getOrderMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.orderMenuItemLabel', { + defaultMessage: 'Order', + description: 'Refers to the order of the elements displayed on the page from front to back', }), - getDistributionMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.distributionMenutItemLabel', { - defaultMessage: 'Distribution', - description: - 'This refers to the options to evenly spacing the selected elements horizontall or vertically.', + getRightAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.rightAlignMenuItemLabel', { + defaultMessage: 'Right', }), - getHorizontalDistributionMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.horizontalDistributionMenutItemLabel', { - defaultMessage: 'Horizontal', + getSaveElementMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.savedElementMenuItemLabel', { + defaultMessage: 'Save as new element', }), - getVerticalDistributionMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.verticalDistributionMenutItemLabel', { - defaultMessage: 'Vertical', + getSendBackwardAriaLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.sendBackwardArialLabel', { + defaultMessage: 'Move element down one layer', + }), + getSendToBackAriaLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.sendToBackArialLabel', { + defaultMessage: 'Move element to bottom layer', + }), + getTopAlignMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.topAlignMenuItemLabel', { + defaultMessage: 'Top', }), getUngroupMenuItemLabel: () => i18n.translate('xpack.canvas.sidebarHeader.ungroupMenuItemLabel', { defaultMessage: 'Ungroup', description: 'This refers to ungrouping a grouped element', }), - getGroupMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.groupMenuItemLabel', { - defaultMessage: 'Group', - description: 'This refers to grouping multiple selected elements.', - }), - getSaveElementMenuItemLabel: () => - i18n.translate('xpack.canvas.sidebarHeader.savedElementMenuItemLabel', { - defaultMessage: 'Save as new element', - }), - getCreateElementModalTitle: () => - i18n.translate('xpack.canvas.sidebarHeader.createElementModalTitle', { - defaultMessage: 'Create new element', + getVerticalDistributionMenuItemLabel: () => + i18n.translate('xpack.canvas.sidebarHeader.verticalDistributionMenutItemLabel', { + defaultMessage: 'Vertical', }), }, WorkpadConfig: { @@ -433,14 +433,14 @@ export const ComponentStrings = { description: '"stylesheet" refers to the collection of CSS style rules entered by the user.', }), - getFlipDimensionTooltip: () => - i18n.translate('xpack.canvas.workpadConfig.swapDimensionsTooltip', { - defaultMessage: 'Swap the width and height', - }), getFlipDimensionAriaLabel: () => i18n.translate('xpack.canvas.workpadConfig.swapDimensionsAriaLabel', { defaultMessage: `Swap the page's width and height`, }), + getFlipDimensionTooltip: () => + i18n.translate('xpack.canvas.workpadConfig.swapDimensionsTooltip', { + defaultMessage: 'Swap the width and height', + }), getGlobalCSSLabel: () => i18n.translate('xpack.canvas.workpadConfig.globalCSSLabel', { defaultMessage: `Global CSS overrides`, @@ -908,6 +908,13 @@ export const ComponentStrings = { }), }, WorkpadTemplates: { + getCloneTemplateLinkAriaLabel: (templateName: string) => + i18n.translate('xpack.canvas.workpadTemplate.cloneTemplateLinkAriaLabel', { + defaultMessage: `Clone workpad template '{templateName}'`, + values: { + templateName, + }, + }), getTableDescriptionColumnTitle: () => i18n.translate('xpack.canvas.workpadTemplates.table.descriptionColumnTitle', { defaultMessage: 'Description', @@ -927,12 +934,5 @@ export const ComponentStrings = { i18n.translate('xpack.canvas.workpadTemplate.searchPlaceholder', { defaultMessage: 'Find template', }), - getCloneTemplateLinkAriaLabel: (templateName: string) => - i18n.translate('xpack.canvas.workpadTemplate.cloneTemplateLinkAriaLabel', { - defaultMessage: `Clone workpad template '{templateName}'`, - values: { - templateName, - }, - }), }, }; From fb5f21cf92c354fb84dbf88bf9cdae2658520887 Mon Sep 17 00:00:00 2001 From: Catherine Liu Date: Mon, 23 Sep 2019 22:36:54 -0700 Subject: [PATCH 3/4] Fixed save button label --- x-pack/legacy/plugins/canvas/i18n/components.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/i18n/components.ts b/x-pack/legacy/plugins/canvas/i18n/components.ts index fffbe9cd83a0..3bfb433c9e8f 100644 --- a/x-pack/legacy/plugins/canvas/i18n/components.ts +++ b/x-pack/legacy/plugins/canvas/i18n/components.ts @@ -167,8 +167,8 @@ export const ComponentStrings = { defaultMessage: 'Name', }), getSaveButtonLabel: () => - i18n.translate('xpack.canvas.customElementModal.cancelButtonLabel', { - defaultMessage: 'Cancel', + i18n.translate('xpack.canvas.customElementModal.saveButtonLabel', { + defaultMessage: 'Save', }), }, ElementConfig: { From 02bdb26eecc3e5422d8453a01c1d12db8193b2ef Mon Sep 17 00:00:00 2001 From: Catherine Liu Date: Fri, 4 Oct 2019 14:58:48 -0700 Subject: [PATCH 4/4] fixed merge conflict --- .../public/components/workpad_config/workpad_config.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js b/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js index 724714a89142..4eb8a336d14b 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_config/workpad_config.js @@ -21,7 +21,6 @@ import { EuiAccordion, EuiText, EuiButton, - EuiFormRowhasEmptyLabelSpace, } from '@elastic/eui'; import { DEFAULT_WORKPAD_CSS } from '../../../common/lib/constants'; import { ComponentStrings } from '../../../i18n'; @@ -91,7 +90,7 @@ export class WorkpadConfig extends PureComponent { - + - +