Message migration WIP

This commit is contained in:
Paulo Gustavo Veiga 2022-10-22 17:49:46 -07:00
parent 52f278e65a
commit fac343187f
11 changed files with 191 additions and 104 deletions

View File

@ -1,26 +1,77 @@
{
"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-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.try-welcome-mobile": {
"defaultMessage": "This edition space showcases some of the mindmap editor capabilities!"
},
"editor.edit-description-mobile": {
"defaultMessage": "Limited mindmap edition capabilities are supported in Mobile devices. Use Desktop browser for full editor capabilities."
"link.help_text": {
"defaultMessage": "Address is not valid"
},
"login.signup": {
"defaultMessage": "Sign Up"
"link.placeholder": {
"defaultMessage": "https://www.example.com"
},
"action.share": {
"defaultMessage": "Share"
"note.label": {
"defaultMessage": "Note"
}
}

View File

@ -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",

View File

@ -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 (
<Box component="span">
<Button color="primary" variant="outlined" onClick={props.submitHandler} sx={{ mr: 1 }}>
{$msg('ACCEPT')}
<FormattedMessage id="action.accept" defaultMessage="Accept" />
</Button>
<Button color="primary" variant="contained" onClick={props.closeModal}>
{$msg('CANCEL')}
<FormattedMessage id="action.cancel" defaultMessage="Cancel" />
</Button>
{props.model.getValue() && props.model.getValue().trim() !== '' && (

View File

@ -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 }) =>
<Input
autoFocus
error={!isValidUrl}
helperText={isValidUrl ? '' : $msg('URL_ERROR')}
placeholder={$msg('PASTE_URL_HERE')}
helperText={
isValidUrl
? ''
: intl.formatMessage({ id: 'link.help_text', defaultMessage: 'Address is not valid' })
}
placeholder={intl.formatMessage({
id: 'link.placeholder',
defaultMessage: 'https://www.example.com',
})}
label="URL"
value={url}
onChange={(event) => setUrl(event.target.value)}

View File

@ -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
<Input
autoFocus
multiline
label={$msg('NOTE')}
label={intl.formatMessage({ id: 'note.label', defaultMessage: 'Note' })}
variant="outlined"
fullWidth
rows={12}

View File

@ -34,13 +34,13 @@ import CloudUploadOutlinedIcon from '@mui/icons-material/CloudUploadOutlined';
import HelpOutlineOutlinedIcon from '@mui/icons-material/InfoOutlined';
import ArrowBackIosNewOutlinedIcon from '@mui/icons-material/ArrowBackIosNewOutlined';
import Typography from '@mui/material/Typography';
import { $msg } from '@wisemapping/mindplot';
import UndoAndRedo from '../action-widget/button/undo-and-redo';
import Button from '@mui/material/Button';
import LogoTextBlackSvg from '../../../images/logo-text-black.svg';
import IconButton from '@mui/material/IconButton';
import { ToolbarActionType } from '../toolbar/ToolbarActionType';
import MapInfo from '../../classes/model/map-info';
import { useIntl } from 'react-intl';
interface AppBarProps {
model: Editor;
@ -53,8 +53,14 @@ const appBarDivisor = {
render: () => <Typography component="div" sx={{ flexGrow: 1 }} />,
};
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 | boolean>(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: <ArrowBackIosNewOutlinedIcon />,
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
<UndoAndRedo
configuration={{
icon: <UndoOutlinedIcon />,
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
<UndoAndRedo
configuration={{
icon: <RedoOutlinedIcon />,
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,23 +140,31 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP
null,
{
icon: <SaveOutlinedIcon />,
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: <RestoreOutlinedIcon />,
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: () => (
<Tooltip
title={intl.formatMessage({ id: 'appbar.tooltip-starred', defaultMessage: 'Starred' })}
>
<IconButton size="small" onClick={handleStarredOnClick}>
<StarRateRoundedIcon
color="action"
@ -151,40 +173,47 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP
}}
/>
</IconButton>
</Tooltip>
),
visible: !capability.isHidden('starred'),
disabled: () => isStarred !== undefined,
},
{
icon: <FileDownloadOutlinedIcon />,
tooltip: $msg('EXPORT'),
onClick: () => onAction('export'),
tooltip: intl.formatMessage({ id: 'appbar.tooltip-export', defaultMessage: 'Export' }),
visible: !capability.isHidden('export'),
},
{
icon: <PrintOutlinedIcon />,
tooltip: $msg('PRINT'),
onClick: () => onAction('print'),
tooltip: intl.formatMessage({ id: 'appbar.tooltip-print', defaultMessage: 'Print' }),
visible: !capability.isHidden('print'),
},
{
icon: <HelpOutlineOutlinedIcon />,
onClick: () => onAction('info'),
tooltip: $msg('MAP_INFO'),
tooltip: intl.formatMessage({ id: 'appbar.tooltip-info', defaultMessage: 'Information' }),
visible: !capability.isHidden('info'),
},
{
icon: <CloudUploadOutlinedIcon />,
onClick: () => onAction('publish'),
tooltip: $msg('PUBLISH'),
tooltip: intl.formatMessage({ id: 'appbar.tooltip-publish', defaultMessage: 'Publish' }),
visible: !capability.isHidden('publish'),
},
{
render: () => (
<Tooltip
title={intl.formatMessage({
id: 'appbar.tooltip-shared',
defaultMessage: 'Share for Collaboration',
})}
>
<Button variant="contained" onClick={() => onAction('share')}>
{$msg('COLLABORATE')}
{intl.formatMessage({ id: 'appbar.shared-button', defaultMessage: 'Share' })}
</Button>
</Tooltip>
),
visible: !capability.isHidden('share'),
},
@ -194,9 +223,13 @@ const AppBar = ({ model, mapInfo, capability, onAction, accountConfig }: AppBarP
},
{
render: () => (
<Tooltip
title={intl.formatMessage({ id: 'appbar.tooltip-signup', defaultMessage: 'Sign Up' })}
>
<Button variant="contained" onClick={() => (window.location.href = '/c/registration')}>
{$msg('SIGN_UP')}
{intl.formatMessage({ id: 'appbar.button-signup', defaultMessage: 'Sign Up' })}
</Button>
</Tooltip>
),
visible: !capability.isHidden('sign-up'),
},

View File

@ -132,7 +132,7 @@ export const ToolbarSubmenu = (props: {
key={i}
configuration={o as ActionConfig}
elevation={props.elevation + 3}
></ToolbarMenuItem>
/>
);
} else {
return <span key={i}>{o.render(() => setOpen(false))}</span>;
@ -180,7 +180,7 @@ export const ToolbarMenuItem = (props: {
configuration={props.configuration}
vertical={props.vertical}
elevation={props.elevation || 0}
></ToolbarSubmenu>
/>
);
else return null;
}

View File

@ -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 (
<>
<Notifier id="headerNotifier"></Notifier>
{(titleKey || message) && (
{(msgExt || message) && (
<div className={dialogClass + ' ' + alertTopAdjustmentStyle}>
<div className="tryInfoPanelInner">
<div className="closeButton">
@ -67,11 +88,7 @@ const WarningDialog = ({ capability, message }: FooterPropsType): React.ReactEle
<img src={CloseDialogSvg} />
</button>
</div>
{titleKey && (
<p>
{intl.formatMessage({ id: titleKey })} {intl.formatMessage({ id: descriptionKey })}
</p>
)}
{msgExt && <p>{`${msg} ${msgExt}`}</p>}
{message && <p>{message}</p>}
</div>
</div>

View File

@ -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;

View File

@ -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',

View File

@ -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',