From 64c2a45a3a96bfb2ea136bc102b7847cd132e013 Mon Sep 17 00:00:00 2001
From: Sibtain Ali <allroundexperts@gmail.com>
Date: Thu, 4 Apr 2024 18:29:37 +0500
Subject: [PATCH] handle comments

---
 src/components/HighlightableMenuItem.tsx      | 5 +++--
 src/hooks/useAnimatedHighlightStyle/config.ts | 2 ++
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/HighlightableMenuItem.tsx b/src/components/HighlightableMenuItem.tsx
index 5cf401fdc8be..7b8a431003ee 100644
--- a/src/components/HighlightableMenuItem.tsx
+++ b/src/components/HighlightableMenuItem.tsx
@@ -1,5 +1,5 @@
 import type {ForwardedRef} from 'react';
-import {forwardRef} from 'react';
+import React, {forwardRef} from 'react';
 import type {View} from 'react-native';
 import {StyleSheet} from 'react-native';
 import useAnimatedHighlightStyle from '@hooks/useAnimatedHighlightStyle';
@@ -8,6 +8,7 @@ import MenuItem from './MenuItem';
 import type {MenuItemProps} from './MenuItem';
 
 type Props = MenuItemProps & {
+    /** Should the menu item be highlighted? */
     highlighted?: boolean;
 };
 
@@ -25,7 +26,7 @@ function HighlightableMenuItem({wrapperStyle, highlighted, ...restOfProps}: Prop
         <MenuItem
             // eslint-disable-next-line react/jsx-props-no-spreading
             {...restOfProps}
-            wrapperStyle={animatedHighlightStyle}
+            outerWrapperStyle={animatedHighlightStyle}
             ref={ref}
         />
     );
diff --git a/src/hooks/useAnimatedHighlightStyle/config.ts b/src/hooks/useAnimatedHighlightStyle/config.ts
index aca34c8cab56..6010c8c33aa7 100644
--- a/src/hooks/useAnimatedHighlightStyle/config.ts
+++ b/src/hooks/useAnimatedHighlightStyle/config.ts
@@ -1,5 +1,7 @@
 import {isMobile} from '@libs/Browser';
 
+// It takes varying amount of time to navigate to a new page on mobile and desktop
+// This variable takes that into account
 const DELAY_FACTOR = isMobile() ? 1 : 0.2;
 export default {};