From 66b8bfd1a14e253bdf419214a12c2b97eb9dcf9e Mon Sep 17 00:00:00 2001
From: Alex Fournier <alexandre.fournier@lyra-network.com>
Date: Fri, 13 Sep 2024 14:44:36 +0200
Subject: [PATCH] fix(menu): component name to match documentation

---
 src/components/Card/Card.tsx | 16 ++++++++--------
 src/components/Menu/Menu.tsx | 17 ++++++++---------
 2 files changed, 16 insertions(+), 17 deletions(-)

diff --git a/src/components/Card/Card.tsx b/src/components/Card/Card.tsx
index a86e172472..7b8c0ddc6e 100644
--- a/src/components/Card/Card.tsx
+++ b/src/components/Card/Card.tsx
@@ -131,7 +131,7 @@ export type Props = $Omit<React.ComponentProps<typeof Surface>, 'mode'> & {
  * export default MyComponent;
  * ```
  */
-const CardComponent = (
+const Card = (
   {
     elevation: cardElevation = 1,
     delayLongPress,
@@ -330,10 +330,10 @@ const CardComponent = (
   );
 };
 
-const Component = forwardRef(CardComponent);
+const Component = forwardRef(Card);
 Component.displayName = 'Card';
 
-const Card = Component as typeof Component & {
+const CardComponent = Component as typeof Component & {
   Content: typeof CardContent;
   Actions: typeof CardActions;
   Cover: typeof CardCover;
@@ -341,13 +341,13 @@ const Card = Component as typeof Component & {
 };
 
 // @component ./CardContent.tsx
-Card.Content = CardContent;
+CardComponent.Content = CardContent;
 // @component ./CardActions.tsx
-Card.Actions = CardActions;
+CardComponent.Actions = CardActions;
 // @component ./CardCover.tsx
-Card.Cover = CardCover;
+CardComponent.Cover = CardCover;
 // @component ./CardTitle.tsx
-Card.Title = CardTitle;
+CardComponent.Title = CardTitle;
 
 const styles = StyleSheet.create({
   innerContainer: {
@@ -365,4 +365,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default Card;
+export default CardComponent;
diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
index a883cccb5b..3144393ab5 100644
--- a/src/components/Menu/Menu.tsx
+++ b/src/components/Menu/Menu.tsx
@@ -173,10 +173,7 @@ const DEFAULT_MODE = 'elevated';
  * `Modal` contents within a `PaperProvider` in order for the menu to show. This
  * wrapping is not necessary if you use Paper's `Modal` instead.
  */
-class MenuComponent extends React.Component<Props, State> {
-  // @component ./MenuItem.tsx
-  static Item = MenuItem;
-
+class Menu extends React.Component<Props, State> {
   static defaultProps = {
     overlayAccessibilityLabel: 'Close menu',
     testID: 'menu',
@@ -709,13 +706,15 @@ const styles = StyleSheet.create({
   },
 });
 
-const MenuWithHOC = withInternalTheme(withSafeAreaInsets(MenuComponent));
+const Component = withInternalTheme(withSafeAreaInsets(Menu));
+Component.displayName = 'Menu';
 
-const Menu = MenuWithHOC as typeof MenuWithHOC & {
+const MenuComponent = Component as typeof Component & {
   Item: typeof MenuItem;
 };
 
-// we need to attach again MenuItem as it is lost after using withSafeAreaInsets
-Menu.Item = MenuItem;
+// we need to attach MenuItem here instead of a static property otherwise it will be lost after using withSafeAreaInsets
+// @component ./MenuItem.tsx
+MenuComponent.Item = MenuItem;
 
-export default Menu;
+export default MenuComponent;