From b6ed375c7f0e76ec0a3efe26a45ac97696e0ff1a Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Thu, 5 Sep 2019 13:52:55 -0500 Subject: [PATCH 01/11] i18n work on workpad header and a few header ctas --- .../legacy/plugins/canvas/i18n/components.ts | 105 ++++++++++++++++++ .../public/components/asset_manager/asset.tsx | 22 ++-- .../asset_manager/asset_manager.tsx | 12 +- .../components/asset_manager/asset_modal.tsx | 23 ++-- .../components/embeddable_flyout/flyout.tsx | 5 +- .../workpad_header/workpad_header.js | 21 +++- 6 files changed, 155 insertions(+), 33 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/i18n/components.ts b/x-pack/legacy/plugins/canvas/i18n/components.ts index a076c878d6cc5..8d4f7f7ef68c2 100644 --- a/x-pack/legacy/plugins/canvas/i18n/components.ts +++ b/x-pack/legacy/plugins/canvas/i18n/components.ts @@ -8,9 +8,114 @@ import { i18n } from '@kbn/i18n'; export const ComponentStrings = { AddEmbeddableFlyout: { + getTitleText: () => + i18n.translate('xpack.canvas.embedObject.titleText', { + defaultMessage: 'Embed Object', + }), getNoItemsText: () => i18n.translate('xpack.canvas.embedObject.noMatchingObjectsMessage', { defaultMessage: 'No matching objects found.', }), }, + Asset: { + getCreateImageTooltipText: () => + i18n.translate('xpack.canvas.asset.createImageTooltipText', { + defaultMessage: 'Create image element', + }), + getDownloadAssetTooltipText: () => + i18n.translate('xpack.canvas.asset.downloadAssetTooltipText', { + defaultMessage: 'Download', + }), + getCopyAssetTooltipText: () => + i18n.translate('xpack.canvas.asset.copyAssetTooltipText', { + defaultMessage: 'Copy id to clipboard', + }), + getDeleteAssetTooltipText: () => + i18n.translate('xpack.canvas.asset.deleteAssetTooltipText', { + defaultMessage: 'Delete', + }), + getThumbnailAltText: () => + i18n.translate('xpack.canvas.asset.deleteAssetTooltipText', { + defaultMessage: 'Asset thumbnail', + }), + }, + AssetManager: { + getBtnText: () => + i18n.translate('xpack.canvas.assetManager.buttonText', { + defaultMessage: 'Manage assets', + }), + getConfirmModalBtnText: () => + i18n.translate('xpack.canvas.assetManager.confirmModalButtonText', { + defaultMessage: 'Remove', + }), + getConfirmModalMessageText: () => + i18n.translate('xpack.canvas.assetManager.confirmModalMessage', { + defaultMessage: 'Are you sure you want to remove this asset?', + }), + getConfirmModalTitleText: () => + i18n.translate('xpack.canvas.assetManager.confirmModalTitleText', { + defaultMessage: 'Remove Asset', + }), + }, + AssetModal: { + getEmptyAssetsMessageText: () => + i18n.translate('xpack.canvas.assetModal.emptyAssetsMessage', { + defaultMessage: 'Import your assets to get started', + }), + getModalTitleText: () => + i18n.translate('xpack.canvas.assetModal.modalTitleText', { + defaultMessage: 'Manage workpad assets', + }), + getLoadingText: () => + i18n.translate('xpack.canvas.assetModal.loadingText', { + defaultMessage: 'Uploading images', + }), + getFilePickerPromptText: () => + i18n.translate('xpack.canvas.assetModal.filePickerPromptText', { + defaultMessage: 'Select or drag and drop images', + }), + getDescriptionText: () => + i18n.translate('xpack.canvas.assetModal.descriptionText', { + defaultMessage: + 'Below are the image assets in this workpad. Any assets that are currently in use cannot be determined at this time. To reclaim space, delete assets.', + }), + getSpaceUsedText: (percentageUsed: number) => + i18n.translate('xpack.canvas.assetModal.spacedUsedText', { + defaultMessage: `${percentageUsed}% space used`, + }), + getModalCloseBtnText: () => + i18n.translate('xpack.canvas.assetModal.modalCloseButtonText', { + defaultMessage: 'Close', + }), + }, + WorkpadHeader: { + getAddElementBtnText: () => + i18n.translate('xpack.canvas.workpadHeader.addElementButtonText', { + defaultMessage: 'Add element', + }), + getAddElementModalCloseBtnText: () => + i18n.translate('xpack.canvas.workpadHeader.addElementModalCloseButtonText', { + defaultMessage: 'Close', + }), + getEmbedObjectBtnText: () => + i18n.translate('xpack.canvas.workpadHeader.embedObjectButtonText', { + defaultMessage: 'Embed object', + }), + getFullScreenTooltipText: () => + i18n.translate('xpack.canvas.workpadHeader.fullscreenTooltipText', { + defaultMessage: 'Enter fullscreen mode', + }), + getHideEditControlText: () => + i18n.translate('xpack.canvas.workpadHeader.hideEditControlText', { + defaultMessage: 'Hide editing controls', + }), + getNoWritePermText: () => + i18n.translate('xpack.canvas.workpadHeader.noWritePermissionText', { + defaultMessage: "You don't have permission to edit this workpad", + }), + getShowEditControlText: () => + i18n.translate('xpack.canvas.workpadHeader.showEditControlText', { + defaultMessage: 'Show editing controls', + }), + }, }; diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx index 29022bc5771b9..847ab819eb5f5 100644 --- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx @@ -16,6 +16,10 @@ import { EuiToolTip, } from '@elastic/eui'; import React, { FunctionComponent } from 'react'; + +import { ComponentStrings } from '../../../i18n'; +const { Asset: strings } = ComponentStrings; + import { Clipboard } from '../clipboard'; import { Download } from '../download'; import { AssetType } from '../../../types'; @@ -36,10 +40,10 @@ export const Asset: FunctionComponent = props => { const createImage = ( - + onCreate(asset)} /> @@ -48,9 +52,9 @@ export const Asset: FunctionComponent = props => { const downloadAsset = ( - + - + @@ -58,9 +62,9 @@ export const Asset: FunctionComponent = props => { const copyAsset = ( - + result && onCopy(asset)}> - + @@ -68,11 +72,11 @@ export const Asset: FunctionComponent = props => { const deleteAsset = ( - + onDelete(asset)} /> @@ -86,7 +90,7 @@ export const Asset: FunctionComponent = props => { size="original" url={props.asset.value} fullScreenIconColor="dark" - alt="Asset thumbnail" + alt={strings.getThumbnailAltText()} style={{ backgroundImage: `url(${props.asset.value})` }} /> diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx index d603f36da4077..8dd347e8e86f0 100644 --- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx @@ -13,6 +13,10 @@ import { } from '@elastic/eui'; import PropTypes from 'prop-types'; import React, { Fragment, PureComponent } from 'react'; + +import { ComponentStrings } from '../../../i18n'; +const { AssetManager: strings } = ComponentStrings; + import { ConfirmModal } from '../confirm_modal'; import { AssetType } from '../../../types'; import { AssetModal } from './asset_modal'; @@ -80,9 +84,9 @@ export class AssetManager extends PureComponent { const confirmModal = ( @@ -90,7 +94,7 @@ export class AssetManager extends PureComponent { return ( - Manage assets + {strings.getBtnText()} {isModalVisible ? assetModal : null} {confirmModal} diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx index 0134b5bee76ae..39f404f2a1473 100644 --- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx @@ -24,6 +24,10 @@ import { } from '@elastic/eui'; import PropTypes from 'prop-types'; import React, { FunctionComponent } from 'react'; + +import { ComponentStrings } from '../../../i18n'; +const { AssetModal: strings } = ComponentStrings; + // @ts-ignore import { ASSET_MAX_SIZE } from '../../../common/lib/constants'; import { Loading } from '../loading'; @@ -68,7 +72,7 @@ export const AssetModal: FunctionComponent = props => { Import your assets to get started} + title={

{strings.getEmptyAssetsMessageText()}

} titleSize="xs" /> @@ -83,15 +87,15 @@ export const AssetModal: FunctionComponent = props => { > - Manage workpad assets + {strings.getModalTitleText()} {isLoading ? ( - + ) : ( = props => { -

- Below are the image assets in this workpad. Any assets that are currently in use - cannot be determined at this time. To reclaim space, delete assets. -

+

{strings.getDescriptionText()}

 {assetValues.length ? ( @@ -137,11 +138,13 @@ export const AssetModal: FunctionComponent = props => { /> - {percentageUsed}% space used + + {strings.getSpaceUsedText(percentageUsed)} + - Close + {strings.getModalCloseBtnText()} diff --git a/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/flyout.tsx b/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/flyout.tsx index 52a91a3a2fae6..0f03657e970bb 100644 --- a/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/flyout.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/flyout.tsx @@ -6,7 +6,6 @@ import React from 'react'; -import { FormattedMessage } from '@kbn/i18n/react'; import { SavedObjectFinder, SavedObjectMetaData, @@ -58,9 +57,7 @@ export class AddEmbeddableFlyout extends React.Component { -

- -

+

{strings.getTitleText()}

 diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.js b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.js index a3d2811c6c1be..2c11e1926371c 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.js +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.js @@ -18,6 +18,10 @@ import { EuiModalFooter, EuiToolTip, } from '@elastic/eui'; + +import { ComponentStrings } from '../../../i18n'; +const { WorkpadHeader: strings } = ComponentStrings; + import { AssetManager } from '../asset_manager'; import { ElementTypes } from '../element_types'; import { ToolTipShortcut } from '../tool_tip_shortcut/'; @@ -41,7 +45,8 @@ export class WorkpadHeader extends React.PureComponent { position="bottom" content={ - Enter fullscreen mode + {strings.getFullScreenTooltipText()}{' '} + } > @@ -76,7 +81,7 @@ export class WorkpadHeader extends React.PureComponent { - Close + {strings.getAddElementModalCloseBtnText()} @@ -87,10 +92,12 @@ export class WorkpadHeader extends React.PureComponent { _getEditToggleToolTip = ({ textOnly } = { textOnly: false }) => { if (!this.props.canUserWrite) { - return "You don't have permission to edit this workpad"; + return strings.getNoWritePermText(); } - const content = this.props.isWriteable ? `Hide editing controls` : `Show editing controls`; + const content = this.props.isWriteable + ? strings.getHideEditControlText() + : strings.getShowEditControlText(); if (textOnly) { return content; @@ -163,7 +170,9 @@ export class WorkpadHeader extends React.PureComponent { - Embed object + + {strings.getEmbedObjectBtnText()} + - Add element + {strings.getAddElementBtnText()} From 59d8c52bf3ce53f4861b0407f1f933b85f74b671 Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Thu, 5 Sep 2019 15:53:53 -0500 Subject: [PATCH 02/11] Convert WorkpadHeader to typescript --- .../components/embeddable_flyout/index.tsx | 2 +- .../workpad_header/{index.js => index.tsx} | 28 ++++++++++++--- .../workpad_header/workpad_export/index.ts | 2 +- .../{workpad_header.js => workpad_header.tsx} | 34 ++++++++++++++++--- .../workpad_header/workpad_zoom/index.tsx | 2 +- 5 files changed, 55 insertions(+), 13 deletions(-) rename x-pack/legacy/plugins/canvas/public/components/workpad_header/{index.js => index.tsx} (54%) rename x-pack/legacy/plugins/canvas/public/components/workpad_header/{workpad_header.js => workpad_header.tsx} (88%) diff --git a/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/index.tsx b/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/index.tsx index 3bf65ceac7525..8a040c0c90c83 100644 --- a/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/embeddable_flyout/index.tsx @@ -104,7 +104,7 @@ export class EmbeddableFlyoutPortal extends React.Component { } } -export const AddEmbeddablePanel = compose( +export const AddEmbeddablePanel = compose void }>( connect( mapStateToProps, mapDispatchToProps, diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.js b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx similarity index 54% rename from x-pack/legacy/plugins/canvas/public/components/workpad_header/index.js rename to x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx index 79ec7dbbbe246..e0c327e697c6b 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.js +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx @@ -5,22 +5,40 @@ */ import { connect } from 'react-redux'; +import { Dispatch } from 'redux'; +// @ts-ignore: Local Untyped import { canUserWrite } from '../../state/selectors/app'; +// @ts-ignore: Local Untyped import { getSelectedPage, isWriteable } from '../../state/selectors/workpad'; +// @ts-ignore: Local Untyped import { setWriteable } from '../../state/actions/workpad'; -import { WorkpadHeader as Component } from './workpad_header'; +import { WorkpadHeader as Component, Props as ComponentProps } from './workpad_header'; -const mapStateToProps = state => ({ +interface StateProps { + isWriteable: boolean; + canUserWrite: boolean; + selectedPage: number; +} + +interface DispatchProps { + setWriteable: (isWorkpadWriteable: boolean) => void; +} + +const mapStateToProps = (state: any) => ({ isWriteable: isWriteable(state) && canUserWrite(state), canUserWrite: canUserWrite(state), selectedPage: getSelectedPage(state), }); -const mapDispatchToProps = dispatch => ({ - setWriteable: isWriteable => dispatch(setWriteable(isWriteable)), +const mapDispatchToProps = (dispatch: Dispatch) => ({ + setWriteable: (isWorkpadWriteable: boolean) => dispatch(setWriteable(isWorkpadWriteable)), }); -const mergeProps = (stateProps, dispatchProps, ownProps) => ({ +const mergeProps = ( + stateProps: StateProps, + dispatchProps: DispatchProps, + ownProps: ComponentProps +): ComponentProps => ({ ...stateProps, ...dispatchProps, ...ownProps, diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/index.ts b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/index.ts index e30adaf6f00e1..c430ef6dd54d2 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/index.ts +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/index.ts @@ -43,7 +43,7 @@ interface Props { enabled: boolean; } -export const WorkpadExport = compose( +export const WorkpadExport = compose( connect(mapStateToProps), withProps( ({ workpad, pageCount, enabled }: Props): ComponentProps => ({ diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.js b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx similarity index 88% rename from x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.js rename to x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx index 2c11e1926371c..aead991e39e7d 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.js +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx @@ -6,6 +6,7 @@ import React from 'react'; import PropTypes from 'prop-types'; +// @ts-ignore no @types definition import { Shortcuts } from 'react-shortcuts'; import { EuiFlexItem, @@ -22,17 +23,34 @@ import { import { ComponentStrings } from '../../../i18n'; const { WorkpadHeader: strings } = ComponentStrings; +// @ts-ignore untyped local import { AssetManager } from '../asset_manager'; +// @ts-ignore untyped local import { ElementTypes } from '../element_types'; import { ToolTipShortcut } from '../tool_tip_shortcut/'; import { AddEmbeddablePanel } from '../embeddable_flyout'; +// @ts-ignore untyped local import { ControlSettings } from './control_settings'; +// @ts-ignore untyped local import { RefreshControl } from './refresh_control'; +// @ts-ignore untyped local import { FullscreenControl } from './fullscreen_control'; import { WorkpadExport } from './workpad_export'; import { WorkpadZoom } from './workpad_zoom'; -export class WorkpadHeader extends React.PureComponent { +export interface Props { + isWriteable: boolean; + toggleWriteable: () => void; + canUserWrite: boolean; + selectedPage: number; +} + +interface State { + isModalVisible: boolean; + isPanelVisible: boolean; +} + +export class WorkpadHeader extends React.PureComponent { static propTypes = { isWriteable: PropTypes.bool, toggleWriteable: PropTypes.func, @@ -40,7 +58,7 @@ export class WorkpadHeader extends React.PureComponent { state = { isModalVisible: false, isPanelVisible: false }; - _fullscreenButton = ({ toggleFullscreen }) => ( + _fullscreenButton = ({ toggleFullscreen }: { toggleFullscreen: () => void }) => ( ); - _keyHandler = action => { + _keyHandler = (action: string) => { if (action === 'EDITING') { this.props.toggleWriteable(); } @@ -90,7 +108,7 @@ export class WorkpadHeader extends React.PureComponent { _embeddableAdd = () => ; - _getEditToggleToolTip = ({ textOnly } = { textOnly: false }) => { + _getEditToggleToolTipText = () => { if (!this.props.canUserWrite) { return strings.getNoWritePermText(); } @@ -99,6 +117,12 @@ export class WorkpadHeader extends React.PureComponent { ? strings.getHideEditControlText() : strings.getShowEditControlText(); + return content; + }; + + _getEditToggleToolTip = ({ textOnly } = { textOnly: false }) => { + const content = this._getEditToggleToolTipText(); + if (textOnly) { return content; } @@ -156,7 +180,7 @@ export class WorkpadHeader extends React.PureComponent { iconType={isWriteable ? 'lockOpen' : 'lock'} onClick={toggleWriteable} size="s" - aria-label={this._getEditToggleToolTip({ textOnly: true })} + aria-label={this._getEditToggleToolTipText()} isDisabled={!canUserWrite} /> diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_zoom/index.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_zoom/index.tsx index bb5055c542914..406d6b54729b9 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_zoom/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_zoom/index.tsx @@ -32,7 +32,7 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ setZoomScale: (scale: number) => dispatch(setZoomScale(scale)), }); -export const WorkpadZoom = compose( +export const WorkpadZoom = compose( connect( mapStateToProps, mapDispatchToProps From 7d8b60330747edf94768cdfdaff78a9cc035fa63 Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Thu, 5 Sep 2019 16:01:42 -0500 Subject: [PATCH 03/11] String ordering cleanup --- .../legacy/plugins/canvas/i18n/components.ts | 52 +++++++++---------- 1 file changed, 26 insertions(+), 26 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/i18n/components.ts b/x-pack/legacy/plugins/canvas/i18n/components.ts index 8d4f7f7ef68c2..5540391fcb98e 100644 --- a/x-pack/legacy/plugins/canvas/i18n/components.ts +++ b/x-pack/legacy/plugins/canvas/i18n/components.ts @@ -8,32 +8,32 @@ import { i18n } from '@kbn/i18n'; export const ComponentStrings = { AddEmbeddableFlyout: { - getTitleText: () => - i18n.translate('xpack.canvas.embedObject.titleText', { - defaultMessage: 'Embed Object', - }), getNoItemsText: () => i18n.translate('xpack.canvas.embedObject.noMatchingObjectsMessage', { defaultMessage: 'No matching objects found.', }), + getTitleText: () => + i18n.translate('xpack.canvas.embedObject.titleText', { + defaultMessage: 'Embed Object', + }), }, Asset: { - getCreateImageTooltipText: () => - i18n.translate('xpack.canvas.asset.createImageTooltipText', { - defaultMessage: 'Create image element', - }), - getDownloadAssetTooltipText: () => - i18n.translate('xpack.canvas.asset.downloadAssetTooltipText', { - defaultMessage: 'Download', - }), getCopyAssetTooltipText: () => i18n.translate('xpack.canvas.asset.copyAssetTooltipText', { defaultMessage: 'Copy id to clipboard', }), + getCreateImageTooltipText: () => + i18n.translate('xpack.canvas.asset.createImageTooltipText', { + defaultMessage: 'Create image element', + }), getDeleteAssetTooltipText: () => i18n.translate('xpack.canvas.asset.deleteAssetTooltipText', { defaultMessage: 'Delete', }), + getDownloadAssetTooltipText: () => + i18n.translate('xpack.canvas.asset.downloadAssetTooltipText', { + defaultMessage: 'Download', + }), getThumbnailAltText: () => i18n.translate('xpack.canvas.asset.deleteAssetTooltipText', { defaultMessage: 'Asset thumbnail', @@ -58,35 +58,35 @@ export const ComponentStrings = { }), }, AssetModal: { + getDescriptionText: () => + i18n.translate('xpack.canvas.assetModal.descriptionText', { + defaultMessage: + 'Below are the image assets in this workpad. Any assets that are currently in use cannot be determined at this time. To reclaim space, delete assets.', + }), getEmptyAssetsMessageText: () => i18n.translate('xpack.canvas.assetModal.emptyAssetsMessage', { defaultMessage: 'Import your assets to get started', }), - getModalTitleText: () => - i18n.translate('xpack.canvas.assetModal.modalTitleText', { - defaultMessage: 'Manage workpad assets', + getFilePickerPromptText: () => + i18n.translate('xpack.canvas.assetModal.filePickerPromptText', { + defaultMessage: 'Select or drag and drop images', }), getLoadingText: () => i18n.translate('xpack.canvas.assetModal.loadingText', { defaultMessage: 'Uploading images', }), - getFilePickerPromptText: () => - i18n.translate('xpack.canvas.assetModal.filePickerPromptText', { - defaultMessage: 'Select or drag and drop images', + getModalCloseBtnText: () => + i18n.translate('xpack.canvas.assetModal.modalCloseButtonText', { + defaultMessage: 'Close', }), - getDescriptionText: () => - i18n.translate('xpack.canvas.assetModal.descriptionText', { - defaultMessage: - 'Below are the image assets in this workpad. Any assets that are currently in use cannot be determined at this time. To reclaim space, delete assets.', + getModalTitleText: () => + i18n.translate('xpack.canvas.assetModal.modalTitleText', { + defaultMessage: 'Manage workpad assets', }), getSpaceUsedText: (percentageUsed: number) => i18n.translate('xpack.canvas.assetModal.spacedUsedText', { defaultMessage: `${percentageUsed}% space used`, }), - getModalCloseBtnText: () => - i18n.translate('xpack.canvas.assetModal.modalCloseButtonText', { - defaultMessage: 'Close', - }), }, WorkpadHeader: { getAddElementBtnText: () => From 5ed1bca51b67425cd5cc024453c2fde94e8f08ed Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Thu, 5 Sep 2019 17:39:05 -0500 Subject: [PATCH 04/11] Addressing some feedback --- x-pack/legacy/plugins/canvas/i18n/components.ts | 7 +++++-- .../canvas/public/components/asset_manager/asset.tsx | 3 ++- .../public/components/asset_manager/asset_manager.tsx | 3 ++- .../canvas/public/components/asset_manager/asset_modal.tsx | 3 ++- .../canvas/public/components/workpad_header/index.tsx | 6 +++--- .../public/components/workpad_header/workpad_header.tsx | 3 ++- 6 files changed, 16 insertions(+), 9 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/i18n/components.ts b/x-pack/legacy/plugins/canvas/i18n/components.ts index 5540391fcb98e..1781d46e56782 100644 --- a/x-pack/legacy/plugins/canvas/i18n/components.ts +++ b/x-pack/legacy/plugins/canvas/i18n/components.ts @@ -35,7 +35,7 @@ export const ComponentStrings = { defaultMessage: 'Download', }), getThumbnailAltText: () => - i18n.translate('xpack.canvas.asset.deleteAssetTooltipText', { + i18n.translate('xpack.canvas.asset.thumbnailAltText', { defaultMessage: 'Asset thumbnail', }), }, @@ -85,7 +85,10 @@ export const ComponentStrings = { }), getSpaceUsedText: (percentageUsed: number) => i18n.translate('xpack.canvas.assetModal.spacedUsedText', { - defaultMessage: `${percentageUsed}% space used`, + defaultMessage: '{percentageUsed}% space used', + values: { + percentageUsed, + }, }), }, WorkpadHeader: { diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx index 847ab819eb5f5..1739c466f1813 100644 --- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset.tsx @@ -18,12 +18,13 @@ import { import React, { FunctionComponent } from 'react'; import { ComponentStrings } from '../../../i18n'; -const { Asset: strings } = ComponentStrings; import { Clipboard } from '../clipboard'; import { Download } from '../download'; import { AssetType } from '../../../types'; +const { Asset: strings } = ComponentStrings; + interface Props { /** The asset to be rendered */ asset: AssetType; diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx index 8dd347e8e86f0..e203400bb68a6 100644 --- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_manager.tsx @@ -15,12 +15,13 @@ import PropTypes from 'prop-types'; import React, { Fragment, PureComponent } from 'react'; import { ComponentStrings } from '../../../i18n'; -const { AssetManager: strings } = ComponentStrings; import { ConfirmModal } from '../confirm_modal'; import { AssetType } from '../../../types'; import { AssetModal } from './asset_modal'; +const { AssetManager: strings } = ComponentStrings; + interface Props { /** A list of assets, if available */ assetValues: AssetType[]; diff --git a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx index 39f404f2a1473..adc0f34809346 100644 --- a/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/asset_manager/asset_modal.tsx @@ -26,7 +26,6 @@ import PropTypes from 'prop-types'; import React, { FunctionComponent } from 'react'; import { ComponentStrings } from '../../../i18n'; -const { AssetModal: strings } = ComponentStrings; // @ts-ignore import { ASSET_MAX_SIZE } from '../../../common/lib/constants'; @@ -34,6 +33,8 @@ import { Loading } from '../loading'; import { Asset } from './asset'; import { AssetType } from '../../../types'; +const { AssetModal: strings } = ComponentStrings; + interface Props { /** The assets to display within the modal */ assetValues: AssetType[]; diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx index e0c327e697c6b..b02bec80fd051 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx @@ -6,11 +6,11 @@ import { connect } from 'react-redux'; import { Dispatch } from 'redux'; -// @ts-ignore: Local Untyped +// @ts-ignore untyped local import { canUserWrite } from '../../state/selectors/app'; -// @ts-ignore: Local Untyped +// @ts-ignore untyped local import { getSelectedPage, isWriteable } from '../../state/selectors/workpad'; -// @ts-ignore: Local Untyped +// @ts-ignore untyped local import { setWriteable } from '../../state/actions/workpad'; import { WorkpadHeader as Component, Props as ComponentProps } from './workpad_header'; diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx index aead991e39e7d..674955bd44405 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx @@ -21,7 +21,6 @@ import { } from '@elastic/eui'; import { ComponentStrings } from '../../../i18n'; -const { WorkpadHeader: strings } = ComponentStrings; // @ts-ignore untyped local import { AssetManager } from '../asset_manager'; @@ -38,6 +37,8 @@ import { FullscreenControl } from './fullscreen_control'; import { WorkpadExport } from './workpad_export'; import { WorkpadZoom } from './workpad_zoom'; +const { WorkpadHeader: strings } = ComponentStrings; + export interface Props { isWriteable: boolean; toggleWriteable: () => void; From 8732870dff28a22d59b94e9f10f68a49d8ebbaaf Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Fri, 6 Sep 2019 10:18:40 -0500 Subject: [PATCH 05/11] Adding state --- .../public/components/workpad_header/index.tsx | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx index b02bec80fd051..70371cdf48adb 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx @@ -12,8 +12,19 @@ import { canUserWrite } from '../../state/selectors/app'; import { getSelectedPage, isWriteable } from '../../state/selectors/workpad'; // @ts-ignore untyped local import { setWriteable } from '../../state/actions/workpad'; +import { CanvasWorkpad } from '../../../types'; import { WorkpadHeader as Component, Props as ComponentProps } from './workpad_header'; +interface State { + transient: { + canUserWrite: boolean; + }; + + persistent: { + workpad: CanvasWorkpad; + }; +} + interface StateProps { isWriteable: boolean; canUserWrite: boolean; @@ -24,7 +35,7 @@ interface DispatchProps { setWriteable: (isWorkpadWriteable: boolean) => void; } -const mapStateToProps = (state: any) => ({ +const mapStateToProps = (state: State) => ({ isWriteable: isWriteable(state) && canUserWrite(state), canUserWrite: canUserWrite(state), selectedPage: getSelectedPage(state), From 80aeff2754a95f0ddbf7142a469ba270e08555f5 Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Fri, 6 Sep 2019 10:41:06 -0500 Subject: [PATCH 06/11] lint --- .../canvas/public/components/workpad_header/index.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx index 70371cdf48adb..89f6f85f40ef3 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx @@ -16,13 +16,9 @@ import { CanvasWorkpad } from '../../../types'; import { WorkpadHeader as Component, Props as ComponentProps } from './workpad_header'; interface State { - transient: { - canUserWrite: boolean; - }; + transient: { canUserWrite: boolean }; - persistent: { - workpad: CanvasWorkpad; - }; + persistent: { workpad: CanvasWorkpad }; } interface StateProps { From 2f2a2afada2c9dc8e79d80b29fe5aa7c980126ec Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Fri, 6 Sep 2019 15:22:42 -0500 Subject: [PATCH 07/11] Shortcut type refactor --- .../workpad_header/workpad_header.tsx | 4 +- .../plugins/canvas/public/lib/keymap.ts | 13 +++- .../legacy/plugins/canvas/types/shortcuts.ts | 77 ++++++++++++++++++- 3 files changed, 87 insertions(+), 7 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx index 674955bd44405..63ac0efd8eb06 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx @@ -22,6 +22,8 @@ import { import { ComponentStrings } from '../../../i18n'; +import { ShortcutActionType } from '../../../types/shortcuts'; + // @ts-ignore untyped local import { AssetManager } from '../asset_manager'; // @ts-ignore untyped local @@ -77,7 +79,7 @@ export class WorkpadHeader extends React.PureComponent { ); - _keyHandler = (action: string) => { + _keyHandler = (action: ShortcutActionType) => { if (action === 'EDITING') { this.props.toggleWriteable(); } diff --git a/x-pack/legacy/plugins/canvas/public/lib/keymap.ts b/x-pack/legacy/plugins/canvas/public/lib/keymap.ts index c17c91d8e6897..13e61a656c078 100644 --- a/x-pack/legacy/plugins/canvas/public/lib/keymap.ts +++ b/x-pack/legacy/plugins/canvas/public/lib/keymap.ts @@ -6,10 +6,19 @@ import { mapValues } from 'lodash'; import { ELEMENT_NUDGE_OFFSET, ELEMENT_SHIFT_OFFSET } from '../../common/lib/constants'; -import { ShortcutMap, ShortcutNameSpace } from '../../types'; +import { + ShortcutMap, + ElementActions, + ExpressionActions, + EditorActions, + PresentationActions, +} from '../../types'; interface KeyMap { - [category: string]: ShortcutNameSpace; + ELEMENT: ElementActions; + EXPRESSION: ExpressionActions; + EDITOR: EditorActions; + PRESENTATION: PresentationActions; } type Modifier = 'ctrl' | 'command' | 'shift' | 'alt' | 'option'; diff --git a/x-pack/legacy/plugins/canvas/types/shortcuts.ts b/x-pack/legacy/plugins/canvas/types/shortcuts.ts index ee2ba8083db60..c03a505f24670 100644 --- a/x-pack/legacy/plugins/canvas/types/shortcuts.ts +++ b/x-pack/legacy/plugins/canvas/types/shortcuts.ts @@ -4,6 +4,76 @@ * you may not use this file except in compliance with the Elastic License. */ +type ElementActionType = + | 'CUT' + | 'COPY' + | 'PASTE' + | 'CLONE' + | 'DELETE' + | 'BRING_FORWARD' + | 'BRING_TO_FRONT' + | 'SEND_BACKWARD' + | 'SEND_TO_BACK' + | 'GROUP' + | 'UNGROUP' + | 'SHIFT_UP' + | 'SHIFT_DOWN' + | 'SHIFT_LEFT' + | 'SHIFT_RIGHT' + | 'NUDGE_UP' + | 'NUDGE_DOWN' + | 'NUDGE_LEFT' + | 'NUDGE_RIGHT'; + +type ExpressionActionType = 'RUN'; + +type EditorActionType = + | 'MULTISELECT' + | 'RESIZE_FROM_CENTER' + | 'IGNORE_SNAP' + | 'SELECT_BEHIND' + | 'UNDO' + | 'REDO' + | 'PREV' + | 'NEXT' + | 'EDITING' + | 'GRID' + | 'REFRESH' + | 'ZOOM_IN' + | 'ZOOM_OUT' + | 'ZOOM_RESET' + | 'FULLSCREEN'; + +type PresentationActionType = + | 'FULLSCREEN' + | 'FULLSCREEN_EXIT' + | 'PREV' + | 'NEXT' + | 'REFRESH' + | 'PAGE_CYCLE_TOGGLE'; + +export type ElementActions = { + [key in ElementActionType]: ShortcutMap; +} & { displayName: string }; + +export type ExpressionActions = { + [key in ExpressionActionType]: ShortcutMap; +} & { displayName: string }; + +export type EditorActions = { + [key in EditorActionType]: ShortcutMap; +} & { displayName: string }; + +export type PresentationActions = { + [key in PresentationActionType]: ShortcutMap; +} & { displayName: string }; + +export type ShortcutActionType = + | ElementActionType + | ExpressionActionType + | EditorActionType + | PresentationActionType; + export interface ShortcutMap { osx: string[]; windows: string[]; @@ -12,7 +82,6 @@ export interface ShortcutMap { help: string; } -export interface ShortcutNameSpace { - displayName: string; - [shortcut: string]: string | ShortcutMap; -} +export type ShortcutNameSpace = { + [T in ShortcutActionType]: ShortcutMap; +} & { displayName: string }; From 49de05de0121f6948d2e7bc891bf2db1aaa03acb Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Fri, 6 Sep 2019 16:10:06 -0500 Subject: [PATCH 08/11] Revert "Shortcut type refactor" This reverts commit d00e48853bcb16fdb14f9bca8b2536c920e8d650. --- .../workpad_header/workpad_header.tsx | 4 +- .../plugins/canvas/public/lib/keymap.ts | 13 +--- .../legacy/plugins/canvas/types/shortcuts.ts | 77 +------------------ 3 files changed, 7 insertions(+), 87 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx index 63ac0efd8eb06..674955bd44405 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx @@ -22,8 +22,6 @@ import { import { ComponentStrings } from '../../../i18n'; -import { ShortcutActionType } from '../../../types/shortcuts'; - // @ts-ignore untyped local import { AssetManager } from '../asset_manager'; // @ts-ignore untyped local @@ -79,7 +77,7 @@ export class WorkpadHeader extends React.PureComponent { ); - _keyHandler = (action: ShortcutActionType) => { + _keyHandler = (action: string) => { if (action === 'EDITING') { this.props.toggleWriteable(); } diff --git a/x-pack/legacy/plugins/canvas/public/lib/keymap.ts b/x-pack/legacy/plugins/canvas/public/lib/keymap.ts index 13e61a656c078..c17c91d8e6897 100644 --- a/x-pack/legacy/plugins/canvas/public/lib/keymap.ts +++ b/x-pack/legacy/plugins/canvas/public/lib/keymap.ts @@ -6,19 +6,10 @@ import { mapValues } from 'lodash'; import { ELEMENT_NUDGE_OFFSET, ELEMENT_SHIFT_OFFSET } from '../../common/lib/constants'; -import { - ShortcutMap, - ElementActions, - ExpressionActions, - EditorActions, - PresentationActions, -} from '../../types'; +import { ShortcutMap, ShortcutNameSpace } from '../../types'; interface KeyMap { - ELEMENT: ElementActions; - EXPRESSION: ExpressionActions; - EDITOR: EditorActions; - PRESENTATION: PresentationActions; + [category: string]: ShortcutNameSpace; } type Modifier = 'ctrl' | 'command' | 'shift' | 'alt' | 'option'; diff --git a/x-pack/legacy/plugins/canvas/types/shortcuts.ts b/x-pack/legacy/plugins/canvas/types/shortcuts.ts index c03a505f24670..ee2ba8083db60 100644 --- a/x-pack/legacy/plugins/canvas/types/shortcuts.ts +++ b/x-pack/legacy/plugins/canvas/types/shortcuts.ts @@ -4,76 +4,6 @@ * you may not use this file except in compliance with the Elastic License. */ -type ElementActionType = - | 'CUT' - | 'COPY' - | 'PASTE' - | 'CLONE' - | 'DELETE' - | 'BRING_FORWARD' - | 'BRING_TO_FRONT' - | 'SEND_BACKWARD' - | 'SEND_TO_BACK' - | 'GROUP' - | 'UNGROUP' - | 'SHIFT_UP' - | 'SHIFT_DOWN' - | 'SHIFT_LEFT' - | 'SHIFT_RIGHT' - | 'NUDGE_UP' - | 'NUDGE_DOWN' - | 'NUDGE_LEFT' - | 'NUDGE_RIGHT'; - -type ExpressionActionType = 'RUN'; - -type EditorActionType = - | 'MULTISELECT' - | 'RESIZE_FROM_CENTER' - | 'IGNORE_SNAP' - | 'SELECT_BEHIND' - | 'UNDO' - | 'REDO' - | 'PREV' - | 'NEXT' - | 'EDITING' - | 'GRID' - | 'REFRESH' - | 'ZOOM_IN' - | 'ZOOM_OUT' - | 'ZOOM_RESET' - | 'FULLSCREEN'; - -type PresentationActionType = - | 'FULLSCREEN' - | 'FULLSCREEN_EXIT' - | 'PREV' - | 'NEXT' - | 'REFRESH' - | 'PAGE_CYCLE_TOGGLE'; - -export type ElementActions = { - [key in ElementActionType]: ShortcutMap; -} & { displayName: string }; - -export type ExpressionActions = { - [key in ExpressionActionType]: ShortcutMap; -} & { displayName: string }; - -export type EditorActions = { - [key in EditorActionType]: ShortcutMap; -} & { displayName: string }; - -export type PresentationActions = { - [key in PresentationActionType]: ShortcutMap; -} & { displayName: string }; - -export type ShortcutActionType = - | ElementActionType - | ExpressionActionType - | EditorActionType - | PresentationActionType; - export interface ShortcutMap { osx: string[]; windows: string[]; @@ -82,6 +12,7 @@ export interface ShortcutMap { help: string; } -export type ShortcutNameSpace = { - [T in ShortcutActionType]: ShortcutMap; -} & { displayName: string }; +export interface ShortcutNameSpace { + displayName: string; + [shortcut: string]: string | ShortcutMap; +} From 27eb09a105ff07707752a306357eb6cb9679953c Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Mon, 9 Sep 2019 13:44:51 -0500 Subject: [PATCH 09/11] Using new State type --- .../canvas/public/components/workpad_header/index.tsx | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx index 89f6f85f40ef3..60599a502c43d 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx @@ -12,15 +12,9 @@ import { canUserWrite } from '../../state/selectors/app'; import { getSelectedPage, isWriteable } from '../../state/selectors/workpad'; // @ts-ignore untyped local import { setWriteable } from '../../state/actions/workpad'; -import { CanvasWorkpad } from '../../../types'; +import { State, CanvasWorkpad } from '../../../types'; import { WorkpadHeader as Component, Props as ComponentProps } from './workpad_header'; -interface State { - transient: { canUserWrite: boolean }; - - persistent: { workpad: CanvasWorkpad }; -} - interface StateProps { isWriteable: boolean; canUserWrite: boolean; From 8668f28ca0bc5235d19f7224a338f44df616d60a Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Mon, 9 Sep 2019 16:23:00 -0500 Subject: [PATCH 10/11] Removing unused type --- .../plugins/canvas/public/components/workpad_header/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx index 60599a502c43d..8c71afd13f67e 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx @@ -12,7 +12,7 @@ import { canUserWrite } from '../../state/selectors/app'; import { getSelectedPage, isWriteable } from '../../state/selectors/workpad'; // @ts-ignore untyped local import { setWriteable } from '../../state/actions/workpad'; -import { State, CanvasWorkpad } from '../../../types'; +import { State } from '../../../types'; import { WorkpadHeader as Component, Props as ComponentProps } from './workpad_header'; interface StateProps { From 1680523d86b903480250bda0259a2b15af70b092 Mon Sep 17 00:00:00 2001 From: Poff Poffenberger Date: Mon, 9 Sep 2019 20:44:32 -0500 Subject: [PATCH 11/11] Updating state type --- .../plugins/canvas/public/components/workpad_header/index.tsx | 4 ++-- .../public/components/workpad_header/workpad_header.tsx | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx index 8c71afd13f67e..6d3c9a0640ba2 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/index.tsx @@ -18,14 +18,14 @@ import { WorkpadHeader as Component, Props as ComponentProps } from './workpad_h interface StateProps { isWriteable: boolean; canUserWrite: boolean; - selectedPage: number; + selectedPage: string; } interface DispatchProps { setWriteable: (isWorkpadWriteable: boolean) => void; } -const mapStateToProps = (state: State) => ({ +const mapStateToProps = (state: State): StateProps => ({ isWriteable: isWriteable(state) && canUserWrite(state), canUserWrite: canUserWrite(state), selectedPage: getSelectedPage(state), diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx index 674955bd44405..8a19984234b44 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_header.tsx @@ -43,7 +43,7 @@ export interface Props { isWriteable: boolean; toggleWriteable: () => void; canUserWrite: boolean; - selectedPage: number; + selectedPage: string; } interface State {