From 0c9a07e5b28e633d4eb7d9a888ee416ec16177ff Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Fri, 19 Apr 2024 15:28:48 +0100
Subject: fix(mobile): Fix the color of the collapsible triangle to respect
 dark mode

---
 apps/mobile/app/dashboard/(tabs)/lists.tsx | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/apps/mobile/app/dashboard/(tabs)/lists.tsx b/apps/mobile/app/dashboard/(tabs)/lists.tsx
index ed085f3d..7099c09f 100644
--- a/apps/mobile/app/dashboard/(tabs)/lists.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/lists.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from "react";
 import { FlatList, Pressable, Text, View } from "react-native";
 import { Link } from "expo-router";
+import { TailwindResolver } from "@/components/TailwindResolver";
 import CustomSafeAreaView from "@/components/ui/CustomSafeAreaView";
 import PageTitle from "@/components/ui/PageTitle";
 import { api } from "@/lib/trpc";
@@ -113,15 +114,20 @@ export default function Lists() {
                   }));
                 }}
               >
-                <Triangle
-                  fill="black"
-                  color="black"
-                  size={10}
-                  style={{
-                    transform: [
-                      { rotate: l.item.collapsed ? "90deg" : "180deg" },
-                    ],
-                  }}
+                <TailwindResolver
+                  className="text-foreground"
+                  comp={(style) => (
+                    <Triangle
+                      size={10}
+                      color={style?.color?.toString()}
+                      fill={style?.color?.toString()}
+                      style={{
+                        transform: [
+                          { rotate: l.item.collapsed ? "90deg" : "180deg" },
+                        ],
+                      }}
+                    />
+                  )}
                 />
               </Pressable>
             )}
-- 
cgit v1.2.3-70-g09d2