From fac343187f3b9fbd0b6d74db92eb7324e422dacb Mon Sep 17 00:00:00 2001 From: Paulo Gustavo Veiga Date: Sat, 22 Oct 2022 17:49:46 -0700 Subject: [PATCH] Message migration WIP --- packages/editor/lang/en.json | 101 +++++++++++++----- packages/editor/package.json | 2 +- .../pane/save-and-delete/index.tsx | 6 +- .../action-widget/pane/topic-link/index.tsx | 17 +-- .../action-widget/pane/topic-note/index.tsx | 5 +- .../editor/src/components/app-bar/index.tsx | 87 ++++++++++----- .../editor/src/components/toolbar/index.tsx | 4 +- .../src/components/warning-dialog/index.tsx | 47 +++++--- packages/mindplot/src/components/lang/en.js | 24 +---- packages/mindplot/src/components/lang/ru.js | 1 - packages/mindplot/src/components/lang/zh.js | 1 - 11 files changed, 191 insertions(+), 104 deletions(-) diff --git a/packages/editor/lang/en.json b/packages/editor/lang/en.json index 233007e1..5f7de701 100644 --- a/packages/editor/lang/en.json +++ b/packages/editor/lang/en.json @@ -1,26 +1,77 @@ { - "editor.try-welcome": { - "defaultMessage": "This edition space showcases some of the mindmap editor capabilities!" - }, - "editor.try-welcome-description": { - "defaultMessage": "Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free." - }, - "editor.try-welcome-mobile": { - "defaultMessage": "This edition space showcases some of the mindmap capabilities!" - }, - "editor.try-welcome-description-mobile": { - "defaultMessage": "Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free. Limited mindmap edition capabilties are supported in Mobile devices. Use Desktop browser for full editor capabilies." - }, - "editor.edit-mobile": { - "defaultMessage": "Note for mobile devices." - }, - "editor.edit-description-mobile": { - "defaultMessage": "Limited mindmap edition capabilities are supported in Mobile devices. Use Desktop browser for full editor capabilities." - }, - "login.signup": { - "defaultMessage": "Sign Up" - }, - "action.share": { - "defaultMessage": "Share" - } -} \ No newline at end of file + "action.accept": { + "defaultMessage": "Accept" + }, + "action.cancel": { + "defaultMessage": "Cancel" + }, + "appbar.back-to-map-list": { + "defaultMessage": "Back to maps list" + }, + "appbar.button-signup": { + "defaultMessage": "Sign Up" + }, + "appbar.shared-button": { + "defaultMessage": "Share" + }, + "appbar.tooltip-export": { + "defaultMessage": "Export" + }, + "appbar.tooltip-history": { + "defaultMessage": "Changes History" + }, + "appbar.tooltip-info": { + "defaultMessage": "Information" + }, + "appbar.tooltip-print": { + "defaultMessage": "Print" + }, + "appbar.tooltip-publish": { + "defaultMessage": "Publish" + }, + "appbar.tooltip-redo": { + "defaultMessage": "Redo" + }, + "appbar.tooltip-save": { + "defaultMessage": "Save" + }, + "appbar.tooltip-shared": { + "defaultMessage": "Share for Collaboration" + }, + "appbar.tooltip-signup": { + "defaultMessage": "Sign Up" + }, + "appbar.tooltip-starred": { + "defaultMessage": "Starred" + }, + "appbar.tooltip-undo": { + "defaultMessage": "Undo" + }, + "editor.edit-description-mobile": { + "defaultMessage": "Limited mindmap edition capabilities are supported in Mobile devices. Use Desktop browser for full editor capabilities." + }, + "editor.edit-mobile": { + "defaultMessage": "Note for mobile devices." + }, + "editor.try-welcome": { + "defaultMessage": "This edition space showcases some of the mindmap editor capabilities!" + }, + "editor.try-welcome-description": { + "defaultMessage": "Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free." + }, + "editor.try-welcome-description-mobile": { + "defaultMessage": "Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free. Limited mindmap edition capabilties are supported in Mobile devices. Use Desktop browser for full editor capabilies." + }, + "editor.try-welcome-mobile": { + "defaultMessage": "This edition space showcases some of the mindmap editor capabilities!" + }, + "link.help_text": { + "defaultMessage": "Address is not valid" + }, + "link.placeholder": { + "defaultMessage": "https://www.example.com" + }, + "note.label": { + "defaultMessage": "Note" + } +} diff --git a/packages/editor/package.json b/packages/editor/package.json index 3fdff754..8a2207c4 100644 --- a/packages/editor/package.json +++ b/packages/editor/package.json @@ -9,7 +9,7 @@ "test:integration": "start-server-and-test 'yarn playground' http-get://localhost:8081 'yarn cy:run'", "test": "yarn test:integration", "test:unit": "jest ./test/unit/* --detectOpenHandles", - "i18n:extract": "formatjs extract 'src/**/*.ts*' --ignore 'src/@types/**/*' --out-file lang/es.json", + "i18n:extract": "formatjs extract 'src/**/*.ts*' --ignore 'src/@types/**/*' --out-file lang/en.json", "i18n:compile": "for lang in {'es','en','fr','de','zh','ru'};do formatjs compile lang/${lang}.json --ast --out-file src/compiled-lang/${lang}.json;done" }, "repository": "http://www.wisemapping.com", diff --git a/packages/editor/src/components/action-widget/pane/save-and-delete/index.tsx b/packages/editor/src/components/action-widget/pane/save-and-delete/index.tsx index 455938ec..13979141 100644 --- a/packages/editor/src/components/action-widget/pane/save-and-delete/index.tsx +++ b/packages/editor/src/components/action-widget/pane/save-and-delete/index.tsx @@ -18,10 +18,10 @@ import Box from '@mui/material/Box'; import Button from '@mui/material/Button'; import IconButton from '@mui/material/IconButton'; -import { $msg } from '@wisemapping/mindplot'; import React from 'react'; import NodeProperty from '../../../../classes/model/node-property'; import DeleteOutlineOutlinedIcon from '@mui/icons-material/DeleteOutlineOutlined'; +import { FormattedMessage } from 'react-intl'; const SaveAndDelete = (props: { model: NodeProperty; @@ -31,11 +31,11 @@ const SaveAndDelete = (props: { return ( {props.model.getValue() && props.model.getValue().trim() !== '' && ( diff --git a/packages/editor/src/components/action-widget/pane/topic-link/index.tsx b/packages/editor/src/components/action-widget/pane/topic-link/index.tsx index 6f681812..108e0929 100644 --- a/packages/editor/src/components/action-widget/pane/topic-link/index.tsx +++ b/packages/editor/src/components/action-widget/pane/topic-link/index.tsx @@ -16,7 +16,6 @@ * limitations under the License. */ import { useState } from 'react'; -import { $msg } from '@wisemapping/mindplot'; import NodeProperty from '../../../../classes/model/node-property'; import Box from '@mui/material/Box'; import React from 'react'; @@ -25,16 +24,15 @@ import Link from '@mui/material/Link'; import IconButton from '@mui/material/IconButton'; import SaveAndDelete from '../save-and-delete'; import OpenInNewOutlinedIcon from '@mui/icons-material/OpenInNewOutlined'; +import { useIntl } from 'react-intl'; /** * Url form for toolbar and node contextual editor */ const TopicLink = (props: { closeModal: () => void; urlModel: NodeProperty }) => { const [url, setUrl] = useState(props.urlModel.getValue()); + const intl = useIntl(); - /** - * if url is valid set model value and calls closeModal - */ const submitHandler = () => { if (checkURL(url)) { props.closeModal(); @@ -62,8 +60,15 @@ const TopicLink = (props: { closeModal: () => void; urlModel: NodeProperty }) => setUrl(event.target.value)} diff --git a/packages/editor/src/components/action-widget/pane/topic-note/index.tsx b/packages/editor/src/components/action-widget/pane/topic-note/index.tsx index 4432ac42..7a2a1148 100644 --- a/packages/editor/src/components/action-widget/pane/topic-note/index.tsx +++ b/packages/editor/src/components/action-widget/pane/topic-note/index.tsx @@ -16,17 +16,18 @@ * limitations under the License. */ import Box from '@mui/material/Box'; -import { $msg } from '@wisemapping/mindplot'; import React, { useState } from 'react'; import NodeProperty from '../../../../classes/model/node-property'; import Input from '../../input'; import SaveAndDelete from '../save-and-delete'; +import { useIntl } from 'react-intl'; /** * Note form for toolbar and node contextual editor */ const TopicNote = (props: { closeModal: () => void; noteModel: NodeProperty | null }) => { const [note, setNote] = useState(props.noteModel.getValue()); + const intl = useIntl(); const submitHandler = () => { props.closeModal(); @@ -38,7 +39,7 @@ const TopicNote = (props: { closeModal: () => void; noteModel: NodeProperty | nu , }; +const keyTooltip = (msg: string, key: string): string => { + const isMac = window.navigator.platform.toUpperCase().indexOf('MAC') >= 0; + return `${msg} (${isMac ? '⌘' : 'Ctrl'} + ${key})`; +}; + const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarProps) => { const [isStarred, setStarred] = useState(undefined); + const intl = useIntl(); const handleStarredOnClick = () => { const newStatus = !isStarred; @@ -70,11 +76,13 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP }); }, []); - console.log(``); const config: ActionConfig[] = [ { icon: , - tooltip: $msg('BACK_TO_MAP_LIST'), + tooltip: intl.formatMessage({ + id: 'appbar.back-to-map-list', + defaultMessage: 'Back to maps list', + }), onClick: () => history.back(), }, { @@ -100,7 +108,10 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP , - tooltip: $msg('UNDO') + ' (' + $msg('CTRL') + ' + Z)', + tooltip: keyTooltip( + intl.formatMessage({ id: 'appbar.tooltip-undo', defaultMessage: 'Undo' }), + 'Z', + ), onClick: () => designer.undo(), }} disabledCondition={(event) => event.undoSteps > 0} @@ -114,7 +125,10 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP , - tooltip: $msg('REDO') + ' (' + $msg('CTRL') + ' + Shift + Z)', + tooltip: keyTooltip( + intl.formatMessage({ id: 'appbar.tooltip-redo', defaultMessage: 'Redo' }), + 'Shift + Z', + ), onClick: () => designer.redo(), }} disabledCondition={(event) => event.redoSteps > 0} @@ -126,65 +140,80 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP null, { icon: , - tooltip: $msg('SAVE') + ' (' + $msg('CTRL') + ' + S)', onClick: () => { model.save(true); }, + tooltip: keyTooltip( + intl.formatMessage({ id: 'appbar.tooltip-save', defaultMessage: 'Save' }), + 'S', + ), visible: !capability.isHidden('save'), disabled: () => !model?.isMapLoadded(), }, { icon: , - tooltip: $msg('HISTORY'), onClick: () => onAction('history'), + tooltip: intl.formatMessage({ + id: 'appbar.tooltip-history', + defaultMessage: 'Changes History', + }), visible: !capability.isHidden('history'), }, appBarDivisor, { - tooltip: $msg('STARRED'), render: () => ( - - - + + + + + ), - visible: !capability.isHidden('starred'), disabled: () => isStarred !== undefined, }, { icon: , - tooltip: $msg('EXPORT'), onClick: () => onAction('export'), + tooltip: intl.formatMessage({ id: 'appbar.tooltip-export', defaultMessage: 'Export' }), visible: !capability.isHidden('export'), }, { icon: , - tooltip: $msg('PRINT'), onClick: () => onAction('print'), + tooltip: intl.formatMessage({ id: 'appbar.tooltip-print', defaultMessage: 'Print' }), visible: !capability.isHidden('print'), }, { icon: , onClick: () => onAction('info'), - tooltip: $msg('MAP_INFO'), + tooltip: intl.formatMessage({ id: 'appbar.tooltip-info', defaultMessage: 'Information' }), visible: !capability.isHidden('info'), }, { icon: , onClick: () => onAction('publish'), - tooltip: $msg('PUBLISH'), + tooltip: intl.formatMessage({ id: 'appbar.tooltip-publish', defaultMessage: 'Publish' }), visible: !capability.isHidden('publish'), }, { render: () => ( - + + + ), visible: !capability.isHidden('share'), }, @@ -194,9 +223,13 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP }, { render: () => ( - + + + ), visible: !capability.isHidden('sign-up'), }, diff --git a/packages/editor/src/components/toolbar/index.tsx b/packages/editor/src/components/toolbar/index.tsx index a9e68534..6f0ab91c 100644 --- a/packages/editor/src/components/toolbar/index.tsx +++ b/packages/editor/src/components/toolbar/index.tsx @@ -132,7 +132,7 @@ export const ToolbarSubmenu = (props: { key={i} configuration={o as ActionConfig} elevation={props.elevation + 3} - > + /> ); } else { return {o.render(() => setOpen(false))}; @@ -180,7 +180,7 @@ export const ToolbarMenuItem = (props: { configuration={props.configuration} vertical={props.vertical} elevation={props.elevation || 0} - > + /> ); else return null; } diff --git a/packages/editor/src/components/warning-dialog/index.tsx b/packages/editor/src/components/warning-dialog/index.tsx index b92f4a12..6f9bf1ae 100644 --- a/packages/editor/src/components/warning-dialog/index.tsx +++ b/packages/editor/src/components/warning-dialog/index.tsx @@ -31,20 +31,41 @@ const WarningDialog = ({ capability, message }: FooterPropsType): React.ReactEle const intl = useIntl(); const [dialogClass, setDialogClass] = useState('tryInfoPanel'); - var titleKey = undefined; - var descriptionKey = undefined; - + let msgExt, msg: string; if (capability.mode !== 'viewonly' && capability.mode !== 'showcase' && capability.isMobile) { - titleKey = 'editor.edit-mobile'; - descriptionKey = 'editor.edit-description-mobile'; + msg = intl.formatMessage({ + id: 'editor.edit-mobile', + defaultMessage: 'Note for mobile devices.', + }); + msgExt = intl.formatMessage({ + id: 'editor.edit-description-mobile', + defaultMessage: + 'Limited mindmap edition capabilities are supported in Mobile devices. Use Desktop browser for full editor capabilities.', + }); } + if (capability.mode === 'showcase' && capability.isMobile) { - titleKey = 'editor.try-welcome-mobile'; - descriptionKey = 'editor.edit-description-mobile'; + msg = intl.formatMessage({ + id: 'editor.try-welcome-mobile', + defaultMessage: 'This edition space showcases some of the mindmap editor capabilities!', + }); + msgExt = intl.formatMessage({ + id: 'editor.try-welcome-description-mobile', + defaultMessage: + 'Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free. Limited mindmap edition capabilties are supported in Mobile devices. Use Desktop browser for full editor capabilies.', + }); } + if (capability.mode === 'showcase' && !capability.isMobile) { - titleKey = 'editor.try-welcome'; - descriptionKey = 'editor.try-welcome-description'; + msg = intl.formatMessage({ + id: 'editor.try-welcome', + defaultMessage: 'This edition space showcases some of the mindmap editor capabilities!', + }); + msgExt = intl.formatMessage({ + id: 'editor.try-welcome-description', + defaultMessage: + 'Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free.', + }); } // if the toolbar is present, the alert must not overlap @@ -53,7 +74,7 @@ const WarningDialog = ({ capability, message }: FooterPropsType): React.ReactEle return ( <> - {(titleKey || message) && ( + {(msgExt || message) && (
@@ -67,11 +88,7 @@ const WarningDialog = ({ capability, message }: FooterPropsType): React.ReactEle
- {titleKey && ( -

- {intl.formatMessage({ id: titleKey })} {intl.formatMessage({ id: descriptionKey })} -

- )} + {msgExt &&

{`${msg} ${msgExt}`}

} {message &&

{message}

}
diff --git a/packages/mindplot/src/components/lang/en.js b/packages/mindplot/src/components/lang/en.js index 1dcad4b8..ac703ed9 100644 --- a/packages/mindplot/src/components/lang/en.js +++ b/packages/mindplot/src/components/lang/en.js @@ -1,4 +1,7 @@ const EN = { + SAVING: 'Saving ...', + SAVE_COMPLETE: 'Save Complete', + ZOOM_IN: 'Zoom In', ZOOM_OUT: 'Zoom Out', TOPIC_SHAPE: 'Topic Shape', @@ -18,22 +21,10 @@ const EN = { FONT_SIZE: 'Text Size', FONT_BOLD: 'Text Bold', FONT_ITALIC: 'Text Italic', - UNDO: 'Undo', - REDO: 'Redo', INSERT: 'Insert', - SAVE: 'Save', - NOTE: 'Note', ADD_TOPIC: 'Add Topic', LOADING: 'Loading ...', - EXPORT: 'Export', - PRINT: 'Print', - PUBLISH: 'Publish', - COLLABORATE: 'Share', - HISTORY: 'History', - DISCARD_CHANGES: 'Discard Changes', FONT_COLOR: 'Text Color', - SAVING: 'Saving ...', - SAVE_COMPLETE: 'Save Complete', ZOOM_IN_ERROR: 'Zoom too high.', ZOOM_ERROR: 'No more zoom can be applied.', ONLY_ONE_TOPIC_MUST_BE_SELECTED: 'Could not create a topic. Only one topic must be selected.', @@ -53,13 +44,8 @@ const EN = { RELATIONSHIP_COULD_NOT_BE_CREATED: 'Relationship could not be created. A parent relationship topic must be selected first.', SELECTION_COPIED_TO_CLIPBOARD: 'Topics copied to the clipboard', WRITE_YOUR_TEXT_HERE: 'Write your note here ...', - REMOVE: 'Remove', - ACCEPT: 'Accept', - CANCEL: 'Cancel', LINK: 'Link', - OPEN_LINK: 'Open URL', SESSION_EXPIRED: 'Your session has expired, please log-in again.', - URL_ERROR: 'URL not valid', ACTION: 'Action', CREATE_SIBLING_TOPIC: 'Create Sibling Topic', CREATE_CHILD_TOPIC: 'Create Child Topic', @@ -81,9 +67,7 @@ const EN = { KEYBOARD_SHORTCUTS_MSG: 'Keyboard shortcuts can help you save time by allowing you to never take your hands off the keyboard to use the mouse.', COPY_AND_PASTE_TOPICS: 'Copy and Paste Topics', MULTIPLE_LINES: 'Add multiple text lines', - BACK_TO_MAP_LIST: 'Back to Maps List', KEYBOARD_SHOTCUTS: 'Keyboard Shorcuts', - PASTE_URL_HERE: 'Paste your url address here:', CTRL: 'Ctrl', SPACE_BAR: 'Space Bar', K_INSERT: 'Insert', @@ -91,11 +75,9 @@ const EN = { K_DELETE: 'Delete', BACKSPACE: 'Backspace', CENTER_POSITION: 'Zoom To Fit', - MAP_INFO: 'Information', FONT_FORMAT: 'Font Format', FONT_INCREASE: 'Font Size Increase', FONT_DECREASE: 'Font Size Decrease', - SIGN_UP: 'Sign Up', }; export default EN; diff --git a/packages/mindplot/src/components/lang/ru.js b/packages/mindplot/src/components/lang/ru.js index 9c2766d6..acd94aec 100644 --- a/packages/mindplot/src/components/lang/ru.js +++ b/packages/mindplot/src/components/lang/ru.js @@ -84,7 +84,6 @@ const EN = { BACK_TO_MAP_LIST: 'Back to Maps List', KEYBOARD_SHOTCUTS: 'Keyboard Shorcuts', PASTE_URL_HERE: 'Вставьте нужный URL-адрес здесь:', - CTRL: 'Ctrl', SPACE_BAR: 'Space Bar', K_INSERT: 'Insert', MOUSE_CLICK: 'Mouse Click', diff --git a/packages/mindplot/src/components/lang/zh.js b/packages/mindplot/src/components/lang/zh.js index 591400b5..b94fc14c 100644 --- a/packages/mindplot/src/components/lang/zh.js +++ b/packages/mindplot/src/components/lang/zh.js @@ -84,7 +84,6 @@ const ZH = { BACK_TO_MAP_LIST: '回到脑图列表', KEYBOARD_SHOTCUTS: '键盘快捷键', PASTE_URL_HERE: '在此处粘贴所需的 URL 地址:', - CTRL: 'Ctrl', SPACE_BAR: 'Space Bar', K_INSERT: 'Insert', MOUSE_CLICK: 'Mouse Click',