From e42eec5dc1f81d166fc50a911b6cbd6d629a45e3 Mon Sep 17 00:00:00 2001
From: ryan <ryannganga13325@gmail.com>
Date: Tue, 15 Jul 2025 19:54:20 +0300
Subject: [PATCH] fix(properties): resolve property persistence issues in
 ItemsList component

- Add query invalidation after successful property addition to database
- Persist auto-populated Wikidata values by saving updated items to database
- Ensure UI state stays synchronized with database state after property operations

Fixes issues where:
- Properties would disappear after being added
- Auto-populated values from Wikidata would not persist across reloads
- Inconsistent behavior between local state and database state
---
 src/components/ItemsList.tsx | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/components/ItemsList.tsx b/src/components/ItemsList.tsx
index a1a1299..e93b636 100644
--- a/src/components/ItemsList.tsx
+++ b/src/components/ItemsList.tsx
@@ -481,10 +481,14 @@ export function ItemsList({ url }: ItemsListProps) {
       };
     }));
     
-    // FOURTH: Save to database (but don't invalidate queries immediately)
+    // FOURTH: Save to database and refresh data
     try {
       await addPropertyToDb(url, normalizedProperty);
       console.log('Property successfully saved to database:', normalizedProperty);
+      
+      // Invalidate queries to refresh data from database
+      queryClient.invalidateQueries({ queryKey: ['items', url] });
+      
     } catch (error) {
       console.error('Error saving property to database:', error);
       // Revert optimistic updates on error
@@ -516,6 +520,8 @@ export function ItemsList({ url }: ItemsListProps) {
           // Update the item with the fetched property value if it exists
           if (properties[normalizedProperty]) {
             console.log(`Updating ${item.wikidataId} with ${normalizedProperty}:`, properties[normalizedProperty]);
+            
+            // Update local state
             setItems(prevItems => prevItems.map(prevItem => 
               prevItem.wikidataId === item.wikidataId
                 ? {
@@ -527,6 +533,21 @@ export function ItemsList({ url }: ItemsListProps) {
                   }
                 : prevItem
             ));
+            
+            // Save the updated item to database to persist the auto-populated value
+            const updatedItem = items.find(i => i.wikidataId === item.wikidataId);
+            if (updatedItem) {
+              const itemToSave = {
+                ...updatedItem,
+                customProperties: {
+                  ...updatedItem.customProperties,
+                  [normalizedProperty]: properties[normalizedProperty]
+                }
+              };
+              saveItemToDb(url, itemToSave).catch(error => {
+                console.error('Error saving auto-populated value:', error);
+              });
+            }
           }
         } catch (error) {
           console.error(`Error fetching Wikidata properties for ${item.wikidataId}:`, error);