diff --git a/packages/webapp/src/client/index.ts b/packages/webapp/src/client/index.ts index 039465d8..6bc79d89 100644 --- a/packages/webapp/src/client/index.ts +++ b/packages/webapp/src/client/index.ts @@ -59,6 +59,7 @@ export type AccountInfo = { firstName: string; lastName: string; email: string; + language: string; } interface Client { diff --git a/packages/webapp/src/client/mock-client/index.ts b/packages/webapp/src/client/mock-client/index.ts index a0bb2548..f0febd55 100644 --- a/packages/webapp/src/client/mock-client/index.ts +++ b/packages/webapp/src/client/mock-client/index.ts @@ -1,3 +1,4 @@ +import { Language } from '@material-ui/icons'; import Client, { AccountInfo, BasicMapInfo, ChangeHistory, ImportMapInfo, Label, MapInfo, NewUser} from '..'; class MockClient implements Client { private maps: MapInfo[] = []; @@ -41,7 +42,8 @@ class MockClient implements Client { return Promise.resolve({ firstName: 'Costme', lastName: 'Fulanito', - email: 'test@example.com' + email: 'test@example.com', + language: 'en' }); } deleteMaps(ids: number[]): Promise { diff --git a/packages/webapp/src/client/rest-client/index.ts b/packages/webapp/src/client/rest-client/index.ts index 97846411..07304d8b 100644 --- a/packages/webapp/src/client/rest-client/index.ts +++ b/packages/webapp/src/client/rest-client/index.ts @@ -37,6 +37,7 @@ export default class RestClient implements Client { lastName: account.lastName ? account.lastName : '', firstName: account.fistName ? account.fistName : '', email: account.email, + language: "en" }); }).catch(error => { const errorInfo = this.parseResponseOnError(error.response); diff --git a/packages/webapp/src/components/maps-page/account-menu/index.tsx b/packages/webapp/src/components/maps-page/account-menu/index.tsx index 8e6553cd..299037ad 100644 --- a/packages/webapp/src/components/maps-page/account-menu/index.tsx +++ b/packages/webapp/src/components/maps-page/account-menu/index.tsx @@ -19,6 +19,7 @@ const AccountMenu = () => { const handleMenu = (event: React.MouseEvent) => { setAnchorEl(event.currentTarget); }; + const handleClose = () => { setAnchorEl(null); }; diff --git a/packages/webapp/src/components/maps-page/index.tsx b/packages/webapp/src/components/maps-page/index.tsx index 400c8541..75aab1f7 100644 --- a/packages/webapp/src/components/maps-page/index.tsx +++ b/packages/webapp/src/components/maps-page/index.tsx @@ -21,6 +21,7 @@ import { ActionType } from './action-chooser'; import AccountMenu from './account-menu'; import ClientHealthSentinel from '../../client/client-health-sentinel'; import HelpMenu from '../help-menu'; +import LanguageMenu from './language-menu'; const logoIcon = require('../../images/logo-small.svg'); const poweredByIcon = require('../../images/pwrdby-white.svg'); @@ -146,6 +147,7 @@ const MapsPage = () => { setActiveDialog(undefined)} mapsId={[]} />
+
diff --git a/packages/webapp/src/components/maps-page/language-menu/index.tsx b/packages/webapp/src/components/maps-page/language-menu/index.tsx new file mode 100644 index 00000000..7adcfff4 --- /dev/null +++ b/packages/webapp/src/components/maps-page/language-menu/index.tsx @@ -0,0 +1,73 @@ +import { Button, Divider, Link, ListItemIcon, Menu, MenuItem, Tooltip } from '@material-ui/core'; +import { ExitToAppOutlined, SettingsApplicationsOutlined, TranslateTwoTone } from '@material-ui/icons'; +import React from "react"; +import { FormattedMessage } from "react-intl"; +import { useQuery } from "react-query"; +import Client, { ErrorInfo, AccountInfo } from "../../../client"; +import { useSelector } from 'react-redux'; +import { activeInstance } from '../../../redux/clientSlice'; + + +const LanguageMenu = () => { + + const client: Client = useSelector(activeInstance); + const [anchorEl, setAnchorEl] = React.useState(null); + const open = Boolean(anchorEl); + + const handleMenu = (event: React.MouseEvent) => { + setAnchorEl(event.currentTarget); + }; + + const handleClose = () => { + setAnchorEl(null); + }; + + const { data } = useQuery('account', () => { + return client.fetchAccountInfo(); + }); + + return ( + + + + + + + English + + + + Español + + + + + Help to Translate + + + ); +} +export default LanguageMenu; \ No newline at end of file