Add help us to translate !

This commit is contained in:
Paulo Gustavo Veiga 2021-02-14 23:32:52 -08:00
parent ca833d60de
commit 0e8c75d32c
4 changed files with 41 additions and 13 deletions

View File

@ -59,7 +59,7 @@ export const localeFromStr = (code: string): Locale => {
.find((l) => l.code == code); .find((l) => l.code == code);
if (!result) { if (!result) {
throw `Langunage code could not be found in list of default supported: + ${code}` throw `Language code could not be found in list of default supported: + ${code}`
} }
return result; return result;

View File

@ -44,7 +44,7 @@
"header.donthaveaccount": [ "header.donthaveaccount": [
{ {
"type": 0, "type": 0,
"value": "No tienes una cuenta ?" "value": "No tienes una cuenta contraseña?"
} }
], ],
"login.email": [ "login.email": [

View File

@ -8,7 +8,7 @@ import IconButton from '@material-ui/core/IconButton';
import ListItem from '@material-ui/core/ListItem'; import ListItem from '@material-ui/core/ListItem';
import ListItemIcon from '@material-ui/core/ListItemIcon'; import ListItemIcon from '@material-ui/core/ListItemIcon';
import { useStyles } from './style'; import { useStyles } from './style';
import { AcUnitTwoTone, AddCircleTwoTone, CloudUploadTwoTone, DeleteOutlineTwoTone, LabelTwoTone, PersonOutlineTwoTone, PublicTwoTone, ShareTwoTone, StarTwoTone } from '@material-ui/icons'; import { AddCircleTwoTone, CloudUploadTwoTone, DeleteOutlineTwoTone, LabelTwoTone, PersonOutlineTwoTone, PublicTwoTone, ScatterPlotTwoTone, ShareTwoTone, StarTwoTone } from '@material-ui/icons';
import { Button, Link, ListItemSecondaryAction, ListItemText, Tooltip } from '@material-ui/core'; import { Button, Link, ListItemSecondaryAction, ListItemText, Tooltip } from '@material-ui/core';
import { MapsList } from './maps-list'; import { MapsList } from './maps-list';
import { FormattedMessage, IntlProvider, useIntl } from 'react-intl'; import { FormattedMessage, IntlProvider, useIntl } from 'react-intl';
@ -80,7 +80,7 @@ const MapsPage = () => {
const filterButtons: ToolbarButtonInfo[] = [{ const filterButtons: ToolbarButtonInfo[] = [{
filter: { type: 'all' }, filter: { type: 'all' },
label: 'All', label: 'All',
icon: <AcUnitTwoTone color="secondary" /> icon: <ScatterPlotTwoTone color="secondary" />
}, { }, {
filter: { type: 'owned' }, filter: { type: 'owned' },
label: 'Owned', label: 'Owned',
@ -171,7 +171,7 @@ const MapsPage = () => {
}), }),
}}> }}>
<div style={{ padding: "20px 0 20px 15px" }}> <div style={{ padding: "20px 0 20px 15px" }} key="logo">
<img src={logoIcon} alt="logo" /> <img src={logoIcon} alt="logo" />
</div> </div>
@ -190,7 +190,7 @@ const MapsPage = () => {
)} )}
</List> </List>
<div style={{ position: 'absolute', bottom: '10px', left: '20px' }}> <div style={{ position: 'absolute', bottom: '10px', left: '20px' }} key="power-by">
<Link href="http://www.wisemapping.org/"> <Link href="http://www.wisemapping.org/">
<img src={poweredByIcon} alt="Powered By WiseMapping" /> <img src={poweredByIcon} alt="Powered By WiseMapping" />
</Link> </Link>

View File

@ -1,4 +1,4 @@
import { Button, Divider, Menu, MenuItem, Tooltip } from '@material-ui/core'; import { Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, Divider, Menu, MenuItem, Tooltip } from '@material-ui/core';
import { TranslateTwoTone } from '@material-ui/icons'; import { TranslateTwoTone } from '@material-ui/icons';
import React from "react"; import React from "react";
import { useMutation, useQueryClient } from "react-query"; import { useMutation, useQueryClient } from "react-query";
@ -13,13 +13,14 @@ const LanguageMenu = () => {
const queryClient = useQueryClient(); const queryClient = useQueryClient();
const client: Client = useSelector(activeInstance); const client: Client = useSelector(activeInstance);
const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null); const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
const [helpDialogOpen, setHelpDialogOpen] = React.useState<boolean>(false);
const open = Boolean(anchorEl); const open = Boolean(anchorEl);
const intl = useIntl(); const intl = useIntl();
const mutation = useMutation((locale: LocaleCode) => client.updateAccountLanguage(locale), const mutation = useMutation((locale: LocaleCode) => client.updateAccountLanguage(locale),
{ {
onSuccess: () => { onSuccess: () => {
queryClient.invalidateQueries('account') queryClient.invalidateQueries('account')
handleClose(); handleClose();
} }
@ -48,8 +49,9 @@ const LanguageMenu = () => {
variant="outlined" variant="outlined"
disableElevation={true} disableElevation={true}
color="primary" color="primary"
style={{ borderColor: 'gray', color: 'gray' }}
onClick={handleMenu} onClick={handleMenu}
startIcon={<TranslateTwoTone />} startIcon={<TranslateTwoTone style={{ color: 'inherit' }} />}
> >
{accountInfo?.locale?.label} {accountInfo?.locale?.label}
</Button> </Button>
@ -86,10 +88,36 @@ const LanguageMenu = () => {
</MenuItem> </MenuItem>
<Divider /> <Divider />
<MenuItem onClick={handleOnClick}> <MenuItem onClick={() => { handleClose(); setHelpDialogOpen(true) }} >
<FormattedMessage id="language.help" defaultMessage="Help to Translate" /> <FormattedMessage id="language.help" defaultMessage="Help to Translate" />
</MenuItem> </MenuItem>
</Menu> </Menu>
<HelpUsToTranslateDialog open={helpDialogOpen} onClose={() => setHelpDialogOpen(false)} />
</span>); </span>);
} }
type HelpUsToTranslateDialogProp = {
open: boolean,
onClose: () => void
}
const HelpUsToTranslateDialog = ({ open, onClose }: HelpUsToTranslateDialogProp) => {
return (
<Dialog
open={open}
onClose={onClose}
>
<DialogTitle>Help us to Translate !</DialogTitle>
<DialogContent>
<DialogContentText>
We need your help !. You could help us to support more languages. If you are interested, send us an email to team@wisemapping.com.
</DialogContentText>
</DialogContent>
<DialogActions>
<Button autoFocus onClick={onClose}>Close</Button>
</DialogActions>
</Dialog>
);
}
export default LanguageMenu; export default LanguageMenu;