Can't customise user menu in react-admin

Question

I'm trying to customise the user menu in react-admin and I've followed the instructions and the example inside the react-admin repo but I'm still getting this error:

Type '{ ref: ForwardedRef<any>; to: string; primaryText: string; leftIcon: Element; onClick: any; sidebarIsOpen: true; }' is missing the following properties from type 'Pick<any, "selected" | "dense" | "className" | "style" | "classes" | "innerRef" | "button" | "slot" | "title" | "key" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | ... 277 more ... | "ContainerProps">': selected, dense, className, style, and 283 more. TS2740

Here's my code.

import SettingsIcon from '@material-ui/icons/Settings';
import { forwardRef } from 'react';

const ConfigurationMenu = forwardRef<any, any>((props, ref) => (
    <MenuItemLink
        ref={ref}
        to="/metamaskLogin"
        primaryText="MetaMask"
        leftIcon={<SettingsIcon />}
        // onClick={onClick} // close the menu on click
        // dense={true}
        onClick={props.onClick}
        sidebarIsOpen
    />
));

const MyUserMenu = (props: any) => (
    <UserMenu {...props}>
        <ConfigurationMenu />
    </UserMenu>
);

export const MyAppBar = (props: any) => <AppBar {...props} userMenu={<MyUserMenu />} />;

I've tested I can hide the user menu by setting userMenu={false}

the example code can be found here: https://github.com/marmelab/react-admin/blob/master/examples/demo/src/layout/AppBar.tsx

Answer 1

figured it out, just needed to add {...props} to MenuItemLink