From 710c28f3c27fb53c2b9b276fadd792fb8d046a1e Mon Sep 17 00:00:00 2001
From: Ammar Ahmed <ammarahmed6506@gmail.com>
Date: Mon, 3 Mar 2025 11:47:58 +0500
Subject: [PATCH] mobile: fix sidemenu colors

---
 apps/mobile/app/components/side-menu/index.tsx          | 8 ++++----
 apps/mobile/app/components/side-menu/menu-item.tsx      | 4 ++--
 apps/mobile/app/components/side-menu/notebook-item.tsx  | 8 +++++---
 apps/mobile/app/components/side-menu/side-menu-tags.tsx | 6 ++----
 4 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/apps/mobile/app/components/side-menu/index.tsx b/apps/mobile/app/components/side-menu/index.tsx
index d471e3941..f8a434a7a 100644
--- a/apps/mobile/app/components/side-menu/index.tsx
+++ b/apps/mobile/app/components/side-menu/index.tsx
@@ -237,7 +237,7 @@ const TabBar = (
                     size={AppFontSize.lg}
                   />
                   <Paragraph
-                    color={colors.secondary.paragraph}
+                    color={colors.primary.paragraph}
                     size={AppFontSize.xxxs - 1}
                   >
                     {item.title}
@@ -283,7 +283,6 @@ const TabBar = (
                   }}
                   style={{
                     borderRadius: 10,
-                    opacity: isFocused ? 1 : 0.6,
                     paddingVertical: 2,
                     width: 40,
                     height: 40
@@ -293,7 +292,7 @@ const TabBar = (
                   <Icon
                     name={getIcon(route.key)}
                     color={
-                      isFocused ? colors.primary.accent : colors.primary.icon
+                      isFocused ? colors.selected.icon : colors.primary.icon
                     }
                     size={AppFontSize.lg}
                   />
@@ -315,6 +314,7 @@ const TabBar = (
                   name="plus"
                   testID="sidebar-add-button"
                   size={AppFontSize.lg - 2}
+                  color={colors.primary.icon}
                   onPress={() => {
                     if (props.navigationState.index === 1) {
                       AddNotebookSheet.present();
@@ -355,7 +355,7 @@ const TabBar = (
                       : "sort-descending"
                   }
                   testID="sidebar-sort-button"
-                  color={colors.secondary.icon}
+                  color={colors.primary.icon}
                   onPress={() => {
                     presentSheet({
                       component: (
diff --git a/apps/mobile/app/components/side-menu/menu-item.tsx b/apps/mobile/app/components/side-menu/menu-item.tsx
index d3475ee6d..dd86a188d 100644
--- a/apps/mobile/app/components/side-menu/menu-item.tsx
+++ b/apps/mobile/app/components/side-menu/menu-item.tsx
@@ -170,7 +170,7 @@ function _MenuItem({
               item.icon === "crown"
                 ? colors.static.yellow
                 : isFocused
-                ? colors.selected.paragraph
+                ? colors.selected.icon
                 : colors.secondary.icon
             }
             size={AppFontSize.md}
@@ -179,7 +179,7 @@ function _MenuItem({
 
         <Paragraph
           color={
-            isFocused ? colors.primary.paragraph : colors.secondary.paragraph
+            isFocused ? colors.selected.paragraph : colors.primary.paragraph
           }
           size={AppFontSize.sm}
         >
diff --git a/apps/mobile/app/components/side-menu/notebook-item.tsx b/apps/mobile/app/components/side-menu/notebook-item.tsx
index 0e0010425..145c1ffcb 100644
--- a/apps/mobile/app/components/side-menu/notebook-item.tsx
+++ b/apps/mobile/app/components/side-menu/notebook-item.tsx
@@ -70,7 +70,7 @@ export const NotebookItem = ({
   const { totalNotes, getTotalNotes } = useTotalNotes("notebook");
   const getTotalNotesRef = React.useRef(getTotalNotes);
   getTotalNotesRef.current = getTotalNotes;
-  const { colors } = useThemeColors("sheet");
+  const { colors } = useThemeColors();
 
   useEffect(() => {
     getTotalNotesRef.current([item.notebook.id]);
@@ -157,7 +157,9 @@ export const NotebookItem = ({
         >
           <IconButton
             size={AppFontSize.md}
-            color={selected ? colors.selected.icon : colors.primary.icon}
+            color={
+              selected || isFocused ? colors.selected.icon : colors.primary.icon
+            }
             testID={item.hasChildren ? `expand-notebook-${index}` : ""}
             onPress={() => {
               if (item.hasChildren) {
@@ -186,7 +188,7 @@ export const NotebookItem = ({
 
           <Paragraph
             color={
-              isFocused ? colors.selected.paragraph : colors.secondary.paragraph
+              isFocused ? colors.selected.paragraph : colors.primary.paragraph
             }
             size={AppFontSize.sm}
           >
diff --git a/apps/mobile/app/components/side-menu/side-menu-tags.tsx b/apps/mobile/app/components/side-menu/side-menu-tags.tsx
index ea2afd2e8..809f4fab9 100644
--- a/apps/mobile/app/components/side-menu/side-menu-tags.tsx
+++ b/apps/mobile/app/components/side-menu/side-menu-tags.tsx
@@ -120,16 +120,14 @@ const TagItem = (props: {
             >
               <AppIcon
                 size={AppFontSize.md}
-                color={isFocused ? colors.selected.icon : colors.secondary.icon}
+                color={isFocused ? colors.selected.icon : colors.primary.icon}
                 name="pound"
               />
             </View>
 
             <Paragraph
               color={
-                isFocused
-                  ? colors.selected.paragraph
-                  : colors.secondary.paragraph
+                isFocused ? colors.selected.paragraph : colors.primary.paragraph
               }
               size={AppFontSize.sm}
             >