Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 | 1x 9x 9x 9x 9x 9x 9x 9x 9x 9x 3x 2x 2x 1x 9x 3x 2x 2x 1x 9x | // src/hooks/useWatchedItems.tsx
import { useMemo, useCallback } from 'react';
import { useAuth } from '../hooks/useAuth';
import { useUserData } from '../hooks/useUserData';
import { useAddWatchedItemMutation, useRemoveWatchedItemMutation } from './mutations';
import { logger } from '../services/logger.client';
/**
* A custom hook to manage all state and logic related to a user's watched items.
*
* This hook has been refactored to use TanStack Query mutations (ADR-0005 Phase 4).
* It provides a simplified interface for adding and removing watched items with:
* - Automatic cache invalidation
* - Success/error notifications
* - No manual state management
*
* The interface remains backward compatible with the previous implementation.
*/
const useWatchedItemsHook = () => {
const { userProfile } = useAuth();
const { watchedItems } = useUserData();
// TanStack Query mutation hooks
const addWatchedItemMutation = useAddWatchedItemMutation();
const removeWatchedItemMutation = useRemoveWatchedItemMutation();
// Consolidate errors from both mutations
const error = useMemo(() => {
const addErr = addWatchedItemMutation.error;
const removeErr = removeWatchedItemMutation.error;
return addErr?.message || removeErr?.message || null;
}, [addWatchedItemMutation.error, removeWatchedItemMutation.error]);
/**
* Add an item to the watched items list.
* Uses TanStack Query mutation which automatically invalidates the cache.
*/
const addWatchedItem = useCallback(
async (itemName: string, category_id: number) => {
if (!userProfile) return;
try {
await addWatchedItemMutation.mutateAsync({ itemName, category_id });
} catch (error) {
// Error is already handled by the mutation hook (notification shown)
// Just log for debugging
logger.error({ err: error }, '[useWatchedItems] Failed to add item');
}
},
[userProfile, addWatchedItemMutation],
);
/**
* Remove an item from the watched items list.
* Uses TanStack Query mutation which automatically invalidates the cache.
*/
const removeWatchedItem = useCallback(
async (masterItemId: number) => {
if (!userProfile) return;
try {
await removeWatchedItemMutation.mutateAsync({ masterItemId });
} catch (error) {
// Error is already handled by the mutation hook (notification shown)
// Just log for debugging
logger.error({ err: error }, '[useWatchedItems] Failed to remove item');
}
},
[userProfile, removeWatchedItemMutation],
);
return {
watchedItems,
addWatchedItem,
removeWatchedItem,
error,
};
};
export { useWatchedItemsHook as useWatchedItems };
|