-
-
Notifications
You must be signed in to change notification settings - Fork 5.2k
/
Layout.tsx
44 lines (39 loc) · 1.26 KB
/
Layout.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
import * as React from 'react';
import { forwardRef, memo } from 'react';
import { Layout, AppBar, UserMenu, useLocale, useSetLocale } from 'react-admin';
import { MenuItem, ListItemIcon } from '@material-ui/core';
import { makeStyles } from '@material-ui/core/styles';
import Language from '@material-ui/icons/Language';
const useStyles = makeStyles(theme => ({
menuItem: {
color: theme.palette.text.secondary,
},
icon: { minWidth: theme.spacing(5) },
}));
const SwitchLanguage = forwardRef((props, ref) => {
const locale = useLocale();
const setLocale = useSetLocale();
const classes = useStyles();
return (
<MenuItem
ref={ref}
className={classes.menuItem}
onClick={() => {
setLocale(locale === 'en' ? 'fr' : 'en');
props.onClick();
}}
>
<ListItemIcon className={classes.icon}>
<Language />
</ListItemIcon>
Switch Language
</MenuItem>
);
});
const MyUserMenu = props => (
<UserMenu {...props}>
<SwitchLanguage />
</UserMenu>
);
const MyAppBar = memo(props => <AppBar {...props} userMenu={<MyUserMenu />} />);
export default props => <Layout {...props} appBar={MyAppBar} />;