All files / src/hooks/mutations useAddWatchedItemMutation.ts

100% Statements 12/12
100% Branches 6/6
100% Functions 5/5
100% Lines 11/11

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                                                                      3x 14x   14x   7x   6x 3x     3x     3x       3x 3x     4x        
// src/hooks/mutations/useAddWatchedItemMutation.ts
import { useMutation, useQueryClient } from '@tanstack/react-query';
import * as apiClient from '../../services/apiClient';
import { notifySuccess, notifyError } from '../../services/notificationService';
import { queryKeyBases } from '../../config/queryKeys';
 
interface AddWatchedItemParams {
  itemName: string;
  category_id: number;
}
 
/**
 * Mutation hook for adding an item to the user's watched items list.
 *
 * This hook provides optimistic updates and automatic cache invalidation.
 * When the mutation succeeds, it invalidates the watched-items query to
 * trigger a refetch of the updated list.
 *
 * @returns Mutation object with mutate function and state
 *
 * @example
 * ```tsx
 * const addWatchedItem = useAddWatchedItemMutation();
 *
 * const handleAdd = () => {
 *   addWatchedItem.mutate(
 *     { itemName: 'Milk', category_id: 3 },
 *     {
 *       onSuccess: () => console.log('Added!'),
 *       onError: (error) => console.error(error),
 *     }
 *   );
 * };
 * ```
 */
export const useAddWatchedItemMutation = () => {
  const queryClient = useQueryClient();
 
  return useMutation({
    mutationFn: async ({ itemName, category_id }: AddWatchedItemParams) => {
      const response = await apiClient.addWatchedItem(itemName, category_id);
 
      if (!response.ok) {
        const error = await response.json().catch(() => ({
          message: `Request failed with status ${response.status}`,
        }));
        throw new Error(error.message || 'Failed to add watched item');
      }
 
      return response.json();
    },
    onSuccess: () => {
      // Invalidate and refetch watched items to get the updated list
      queryClient.invalidateQueries({ queryKey: queryKeyBases.watchedItems });
      notifySuccess('Item added to watched list');
    },
    onError: (error: Error) => {
      notifyError(error.message || 'Failed to add item to watched list');
    },
  });
};