From 8c3b00a866314e9960f88748d5432ed62942ac81 Mon Sep 17 00:00:00 2001
From: asvarcas <asvarcas@etriek.com.uy>
Date: Mon, 15 Feb 2021 12:19:34 -0300
Subject: [PATCH 1/4] Added gloabl css override key to UserMenu component

---
 .../ra-ui-materialui/src/layout/UserMenu.tsx  | 25 +++++++++++--------
 1 file changed, 14 insertions(+), 11 deletions(-)

diff --git a/packages/ra-ui-materialui/src/layout/UserMenu.tsx b/packages/ra-ui-materialui/src/layout/UserMenu.tsx
index 3510ddef40f..3b7eacf0fb2 100644
--- a/packages/ra-ui-materialui/src/layout/UserMenu.tsx
+++ b/packages/ra-ui-materialui/src/layout/UserMenu.tsx
@@ -6,16 +6,19 @@ import { Tooltip, IconButton, Menu, Button, Avatar } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core/styles';
 import AccountCircle from '@material-ui/icons/AccountCircle';
 
-const useStyles = makeStyles(theme => ({
-    user: {},
-    userButton: {
-        textTransform: 'none',
-    },
-    avatar: {
-        width: theme.spacing(4),
-        height: theme.spacing(4),
-    },
-}));
+const useStyles = makeStyles(
+    theme => ({
+        root: {},
+        userButton: {
+            textTransform: 'none',
+        },
+        avatar: {
+            width: theme.spacing(4),
+            height: theme.spacing(4),
+        },
+    }),
+    { name: 'RaUserMenu' }
+);
 
 const UserMenu = props => {
     const [anchorEl, setAnchorEl] = useState(null);
@@ -31,7 +34,7 @@ const UserMenu = props => {
     const handleClose = () => setAnchorEl(null);
 
     return (
-        <div className={classes.user}>
+        <div className={classes.root}>
             {loaded && identity?.fullName ? (
                 <Button
                     aria-label={label && translate(label, { _: label })}

From 3083f0a645ace4268d6fc0c907f3fbb79ae3fe8d Mon Sep 17 00:00:00 2001
From: asvarcas <asvarcas@etriek.com.uy>
Date: Mon, 15 Feb 2021 12:21:21 -0300
Subject: [PATCH 2/4] Added documentation to UserMenu and SkipNavigationButton
 components

---
 docs/Buttons.md | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/docs/Buttons.md b/docs/Buttons.md
index 0e40f8cdd08..6eadd73aa13 100644
--- a/docs/Buttons.md
+++ b/docs/Buttons.md
@@ -334,5 +334,24 @@ To override the style of all instances of `<Button>` using the [material-ui styl
 
 ### `<RefreshButton>`
 ### `<SkipNavigationButton>`
+
+#### CSS API
+
+| Rule name             | Description                                     |
+| --------------------- | ----------------------------------------------- |
+| `skipToContentButton` | Applied to the underlying `MuiButton` component |
+
+To override the style of all instances of `<SkipNavigationButton>` using the [material-ui style overrides](https://material-ui.com/customization/globals/#css), use the `RaSkipNavigationButton` key.
+
 ### `<MenuItemLink>`
 ### `<UserMenu>`
+
+#### CSS API
+
+| Rule name    | Description                                     |
+| ------------ | ----------------------------------------------- |
+| `user`       | Applied to the underlying `MuiButton` component |
+| `userButton` | Applied to the underlying `MuiButton` component |
+| `avatar`     | Applied to the underlying `MuiButton` component |
+
+To override the style of all instances of `<UserMenu>` using the [material-ui style overrides](https://material-ui.com/customization/globals/#css), use the `RaUserMenu` key.

From b0d558b32328dc923bf313ecec90051fb8575ec4 Mon Sep 17 00:00:00 2001
From: asvarcas <asvarcas@etriek.com.uy>
Date: Mon, 15 Feb 2021 12:28:12 -0300
Subject: [PATCH 3/4] Added UserMenu component CSS Api reference to the docs

---
 docs/Buttons.md | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/docs/Buttons.md b/docs/Buttons.md
index 6eadd73aa13..b89e8f82bf8 100644
--- a/docs/Buttons.md
+++ b/docs/Buttons.md
@@ -348,10 +348,10 @@ To override the style of all instances of `<SkipNavigationButton>` using the [ma
 
 #### CSS API
 
-| Rule name    | Description                                     |
-| ------------ | ----------------------------------------------- |
-| `user`       | Applied to the underlying `MuiButton` component |
-| `userButton` | Applied to the underlying `MuiButton` component |
-| `avatar`     | Applied to the underlying `MuiButton` component |
+| Rule name    | Description                                                                                                                              |
+| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------- |
+| `root`       | Alternative to using `className`. Applied to the root element                                                                            |
+| `userButton` | Applied to the underlying `MuiButton` component when `useGetIdentity().loaded` is `true` and `useGetIdentity().identity.fullName` is set |
+| `avatar`     | Applied to the underlying `MuiAvatar` component when `useGetIdentity().avatar` is `true`                                                 |
 
 To override the style of all instances of `<UserMenu>` using the [material-ui style overrides](https://material-ui.com/customization/globals/#css), use the `RaUserMenu` key.

From 19d85bc8fdd96bb4b4780ae83a1c351178386f57 Mon Sep 17 00:00:00 2001
From: asvarcas <asvarcas@etriek.com.uy>
Date: Mon, 15 Feb 2021 13:22:17 -0300
Subject: [PATCH 4/4] Applied review

---
 docs/Buttons.md                                   | 2 +-
 packages/ra-ui-materialui/src/layout/UserMenu.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/docs/Buttons.md b/docs/Buttons.md
index b89e8f82bf8..97029d6106d 100644
--- a/docs/Buttons.md
+++ b/docs/Buttons.md
@@ -350,7 +350,7 @@ To override the style of all instances of `<SkipNavigationButton>` using the [ma
 
 | Rule name    | Description                                                                                                                              |
 | ------------ | ---------------------------------------------------------------------------------------------------------------------------------------- |
-| `root`       | Alternative to using `className`. Applied to the root element                                                                            |
+| `user`       | Alternative to using `className`. Applied to the root element                                                                            |
 | `userButton` | Applied to the underlying `MuiButton` component when `useGetIdentity().loaded` is `true` and `useGetIdentity().identity.fullName` is set |
 | `avatar`     | Applied to the underlying `MuiAvatar` component when `useGetIdentity().avatar` is `true`                                                 |
 
diff --git a/packages/ra-ui-materialui/src/layout/UserMenu.tsx b/packages/ra-ui-materialui/src/layout/UserMenu.tsx
index 3b7eacf0fb2..80e8ee965b1 100644
--- a/packages/ra-ui-materialui/src/layout/UserMenu.tsx
+++ b/packages/ra-ui-materialui/src/layout/UserMenu.tsx
@@ -8,7 +8,7 @@ import AccountCircle from '@material-ui/icons/AccountCircle';
 
 const useStyles = makeStyles(
     theme => ({
-        root: {},
+        user: {},
         userButton: {
             textTransform: 'none',
         },
@@ -34,7 +34,7 @@ const UserMenu = props => {
     const handleClose = () => setAnchorEl(null);
 
     return (
-        <div className={classes.root}>
+        <div className={classes.user}>
             {loaded && identity?.fullName ? (
                 <Button
                     aria-label={label && translate(label, { _: label })}