From e17d29f2b72209e11609031dfe1bc36f5aeef26f Mon Sep 17 00:00:00 2001
From: Violet Caulfield <violet@cosmonautical.cloud>
Date: Mon, 24 Feb 2025 06:34:32 -0600
Subject: [PATCH] we can do favorite icons better than that

---
 components/Global/components/favorite-icon.tsx | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/components/Global/components/favorite-icon.tsx b/components/Global/components/favorite-icon.tsx
index 066d5028..27fd951a 100644
--- a/components/Global/components/favorite-icon.tsx
+++ b/components/Global/components/favorite-icon.tsx
@@ -4,6 +4,7 @@ import Icon from "../helpers/icon";
 import { useQuery } from "@tanstack/react-query";
 import { QueryKeys } from "../../../enums/query-keys";
 import { fetchUserData } from "../../../api/queries/functions/favorites";
+import { useEffect, useState } from "react";
 
 export default function FavoriteIcon({ 
     item 
@@ -11,19 +12,27 @@ export default function FavoriteIcon({
     item: BaseItemDto 
 }) : React.JSX.Element {
 
-    const { data } = useQuery({
+    const [isFavorite, setIsFavorite] = useState<boolean>(item.UserData?.IsFavorite ?? false);
+
+    const { data: userData } = useQuery({
         queryKey: [QueryKeys.UserData, item.Id!],
         queryFn: () => fetchUserData(item.Id!),
-        staleTime: (1000 * 60 * 5) // 5 minutes
+        staleTime: (1000 * 60 * 5) // 5 minutes,
     });
 
+    useEffect(() => {
+        setIsFavorite(userData?.IsFavorite ?? false)
+    }, [
+        userData
+    ])
+
     return (
         <YStack
             alignContent="center"
             justifyContent="center"
             minWidth={24}
         >
-            { data && data.IsFavorite ? (
+            { isFavorite ? (
                 <Icon 
                     small 
                     name="heart"