ryanmwangi/Compareware_next.js
1
0
Fork 0
Code Issues Pull requests Releases Activity

feat(ItemsList): enhance addProperty function with error handling and logging

Browse source
This commit is contained in:
ryan 2025-06-20 18:14:45 +03:00
parent c6a90805af
commit 16b892b0e2
1 changed files with 65 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

93
src/components/ItemsList.tsx
View file

@ -306,9 +306,6 @@ export function ItemsList({ url }: ItemsListProps) {
const addPropertyMutation = useMutation({ const addPropertyMutation = useMutation({
mutationFn: (property: string) => addPropertyToDb(url, property), mutationFn: (property: string) => addPropertyToDb(url, property),
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ['items', url] });
}
}); });
// Event handlers // Event handlers
@ -386,23 +383,31 @@ export function ItemsList({ url }: ItemsListProps) {
// Modify the addProperty function to handle auto-population // Modify the addProperty function to handle auto-population
const addProperty = useCallback(async (property: string) => { const addProperty = useCallback(async (property: string) => {
console.log('Adding property:', property);
const normalizedProperty = property.replace('http://www.wikidata.org/prop/', ''); const normalizedProperty = property.replace('http://www.wikidata.org/prop/', '');
if (!normalizedProperty || selectedProperties[normalizedProperty]) { if (!normalizedProperty || selectedProperties[normalizedProperty]) {
console.log('Property already exists or invalid:', normalizedProperty);
return; return;
} }
// Add to selected properties console.log('Proceeding to add property:', normalizedProperty);
// FIRST: Add to selected properties and custom properties (optimistic update)
setSelectedProperties(prev => ({ ...prev, [normalizedProperty]: true })); setSelectedProperties(prev => ({ ...prev, [normalizedProperty]: true }));
setCustomProperties(prev => [...prev, normalizedProperty]); setCustomProperties(prev => [...prev, normalizedProperty]);
// Fetch label if not exists // SECOND: Fetch label if not exists
if (!propertyLabels[normalizedProperty]) { if (!propertyLabels[normalizedProperty]) {
const labels = await fetchPropertyLabels([normalizedProperty]); try {
setPropertyLabels(prev => ({ ...prev, ...labels })); const labels = await fetchPropertyLabels([normalizedProperty]);
setPropertyLabels(prev => ({ ...prev, ...labels }));
} catch (error) {
console.error('Error fetching property labels:', error);
}
} }
// Add to all items with auto-population from propertyCache // THIRD: Add to all items with auto-population from propertyCache
setItems(prev => prev.map(item => { setItems(prev => prev.map(item => {
const existingValue = item.customProperties[normalizedProperty] || ''; const existingValue = item.customProperties[normalizedProperty] || '';
let autoPopulatedValue = existingValue; let autoPopulatedValue = existingValue;
@ -410,6 +415,7 @@ export function ItemsList({ url }: ItemsListProps) {
// If item has Wikidata ID and we have cached properties, use the cached value // If item has Wikidata ID and we have cached properties, use the cached value
if (item.wikidataId && propertyCache[item.wikidataId] && propertyCache[item.wikidataId][normalizedProperty]) { if (item.wikidataId && propertyCache[item.wikidataId] && propertyCache[item.wikidataId][normalizedProperty]) {
autoPopulatedValue = propertyCache[item.wikidataId][normalizedProperty]; autoPopulatedValue = propertyCache[item.wikidataId][normalizedProperty];
console.log(`Auto-populating ${normalizedProperty} for ${item.wikidataId} with value:`, autoPopulatedValue);
} }
return { return {
@ -421,32 +427,61 @@ export function ItemsList({ url }: ItemsListProps) {
}; };
})); }));
// Save to database // FOURTH: Save to database (but don't invalidate queries immediately)
addPropertyMutation.mutate(normalizedProperty); try {
await addPropertyToDb(url, normalizedProperty);
console.log('Property successfully saved to database:', normalizedProperty);
} catch (error) {
console.error('Error saving property to database:', error);
// Revert optimistic updates on error
setSelectedProperties(prev => {
const newSelected = { ...prev };
delete newSelected[normalizedProperty];
return newSelected;
});
setCustomProperties(prev => prev.filter(p => p !== normalizedProperty));
setItems(prev => prev.map(item => ({
...item,
customProperties: Object.fromEntries(
Object.entries(item.customProperties).filter(([key]) => key !== normalizedProperty)
)
})));
return;
}
// Fetch Wikidata properties for items with wikidata_id that don't have cached data // FIFTH: Fetch Wikidata properties for items with wikidata_id that don't have cached data
items.forEach(async (item) => { const itemsWithWikidataId = items.filter(item => item.wikidataId && !propertyCache[item.wikidataId]);
if (item.wikidataId && !propertyCache[item.wikidataId]) {
const properties = await fetchWikidataProperties(item.wikidataId);
setPropertyCache(prev => ({ ...prev, [item.wikidataId!]: properties }));
// Update the item with the fetched property value for (const item of itemsWithWikidataId) {
if (properties[normalizedProperty]) { if (item.wikidataId) {
setItems(prevItems => prevItems.map(prevItem => try {
prevItem.wikidataId === item.wikidataId console.log('Fetching Wikidata properties for:', item.wikidataId);
? { const properties = await fetchWikidataProperties(item.wikidataId);
...prevItem, setPropertyCache(prev => ({ ...prev, [item.wikidataId!]: properties }));
customProperties: {
...prevItem.customProperties, // Update the item with the fetched property value if it exists
[normalizedProperty]: properties[normalizedProperty] if (properties[normalizedProperty]) {
console.log(`Updating ${item.wikidataId} with ${normalizedProperty}:`, properties[normalizedProperty]);
setItems(prevItems => prevItems.map(prevItem =>
prevItem.wikidataId === item.wikidataId
? {
...prevItem,
customProperties: {
...prevItem.customProperties,
[normalizedProperty]: properties[normalizedProperty]
}
} }
} : prevItem
: prevItem ));
)); }
} catch (error) {
console.error(`Error fetching Wikidata properties for ${item.wikidataId}:`, error);
} }
} }
}); }
}, [selectedProperties, propertyLabels, items, propertyCache, addPropertyMutation]);
console.log('Property addition completed:', normalizedProperty);
}, [selectedProperties, propertyLabels, items, propertyCache, url]);
const handleWikidataSelect = useCallback(async (suggestion: WikidataSuggestion, itemId: string) => { const handleWikidataSelect = useCallback(async (suggestion: WikidataSuggestion, itemId: string) => {
console.log('Wikidata selection for item:', itemId, suggestion); console.log('Wikidata selection for item:', itemId, suggestion);