From 2c04cd751f033775eb970f9ee09316c809c03dd2 Mon Sep 17 00:00:00 2001
From: Claw AI <claw@example.com>
Date: Mon, 30 Mar 2026 18:18:09 +0000
Subject: [PATCH] Fix favorites: optimistic remove + no loading flash

---
 app/contexts/FavoritesContext.js | 10 +++++++---
 app/favorites/page.js            |  2 +-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/app/contexts/FavoritesContext.js b/app/contexts/FavoritesContext.js
index b4772bb..afdfcfe 100644
--- a/app/contexts/FavoritesContext.js
+++ b/app/contexts/FavoritesContext.js
@@ -84,7 +84,8 @@ export const FavoritesProvider = ({ children }) => {
     if (!AuthService.isAuthenticated()) return false;
     try {
       await addFavoriteProperty(propId);
-      await fetchFavorites(); // refresh list
+      // Refresh to get the full object with faveId
+      await fetchFavorites();
       return true;
     } catch (err) {
       console.error('[Favorites] Add failed:', err);
@@ -94,15 +95,18 @@ export const FavoritesProvider = ({ children }) => {
 
   const removeFavorite = async (propId) => {
     if (!AuthService.isAuthenticated()) return false;
-    // Find the faveId for this property
     const fav = favorites.find(f => f.id === propId);
     if (!fav) return false;
+    // Optimistic update — remove immediately from UI
+    const previous = [...favorites];
+    setFavorites(prev => prev.filter(f => f.id !== propId));
     try {
       await removeFavoriteProperty(fav.faveId);
-      setFavorites(prev => prev.filter(f => f.id !== propId));
       return true;
     } catch (err) {
       console.error('[Favorites] Remove failed:', err);
+      // Rollback on failure
+      setFavorites(previous);
       return false;
     }
   };
diff --git a/app/favorites/page.js b/app/favorites/page.js
index 2ee57ea..1832795 100644
--- a/app/favorites/page.js
+++ b/app/favorites/page.js
@@ -26,7 +26,7 @@ export default function FavoritesPage() {
     return amount?.toLocaleString() + ' ل.س';
   };
 
-  if (favoritesLoading) {
+  if (favoritesLoading && favorites.length === 0) {
     return (
       <div className="min-h-screen flex items-center justify-center">
         <div className="text-center">