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
This commit is contained in:
parent
946416e6e6
commit
e42eec5dc1
1 changed files with 22 additions and 1 deletions
|
@ -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 {
|
try {
|
||||||
await addPropertyToDb(url, normalizedProperty);
|
await addPropertyToDb(url, normalizedProperty);
|
||||||
console.log('Property successfully saved to database:', normalizedProperty);
|
console.log('Property successfully saved to database:', normalizedProperty);
|
||||||
|
|
||||||
|
// Invalidate queries to refresh data from database
|
||||||
|
queryClient.invalidateQueries({ queryKey: ['items', url] });
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error saving property to database:', error);
|
console.error('Error saving property to database:', error);
|
||||||
// Revert optimistic updates on 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
|
// Update the item with the fetched property value if it exists
|
||||||
if (properties[normalizedProperty]) {
|
if (properties[normalizedProperty]) {
|
||||||
console.log(`Updating ${item.wikidataId} with ${normalizedProperty}:`, properties[normalizedProperty]);
|
console.log(`Updating ${item.wikidataId} with ${normalizedProperty}:`, properties[normalizedProperty]);
|
||||||
|
|
||||||
|
// Update local state
|
||||||
setItems(prevItems => prevItems.map(prevItem =>
|
setItems(prevItems => prevItems.map(prevItem =>
|
||||||
prevItem.wikidataId === item.wikidataId
|
prevItem.wikidataId === item.wikidataId
|
||||||
? {
|
? {
|
||||||
|
@ -527,6 +533,21 @@ export function ItemsList({ url }: ItemsListProps) {
|
||||||
}
|
}
|
||||||
: prevItem
|
: 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) {
|
} catch (error) {
|
||||||
console.error(`Error fetching Wikidata properties for ${item.wikidataId}:`, error);
|
console.error(`Error fetching Wikidata properties for ${item.wikidataId}:`, error);
|
||||||
|
|
Loading…
Add table
Reference in a new issue