Merge pull request #3868 from marmelab/fix-demo-usermenu

[RFR] Fix custom user menu does not close after selecting an item in the demo
marmelab · Oct 28, 2019 · a81cbb9 · a81cbb9
2 parents 0630de5 + 3f29f0c
commit a81cbb9
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 6 deletions.
diff --git a/docs/Theming.md b/docs/Theming.md
@@ -413,13 +413,19 @@ You can replace the default user menu by your own by setting the `userMenu` prop
 import { AppBar, UserMenu, MenuItemLink } from 'react-admin';
 import SettingsIcon from '@material-ui/icons/Settings';
 
+const ConfigurationMenu = forwardRef(({ onClick }, ref) => (
+    <MenuItemLink
+        ref={ref}
+        to="/configuration"
+        primaryText={Configuration}
+        leftIcon={<SettingsIcon />}
+        onClick={onClick} // close the menu on click
+    />
+));
+
 const MyUserMenu = props => (
     <UserMenu {...props}>
-        <MenuItemLink
-            to="/configuration"
-            primaryText="Configuration"
-            leftIcon={<SettingsIcon />}
-        />
+        <ConfigurationMenu />
     </UserMenu>
 );
 

diff --git a/examples/demo/src/layout/AppBar.js b/examples/demo/src/layout/AppBar.js
@@ -18,14 +18,15 @@ const useStyles = makeStyles({
     },
 });
 
-const ConfigurationMenu = forwardRef((_, ref) => {
+const ConfigurationMenu = forwardRef((props, ref) => {
     const translate = useTranslate();
     return (
         <MenuItemLink
             ref={ref}
             to="/configuration"
             primaryText={translate('pos.configuration')}
             leftIcon={<SettingsIcon />}
+            onClick={props.onClick}
         />
     );
 });