flyer-crawler.projectium.com/src/hooks/mutations/useRemoveWatchedItemMutation.ts

// src/hooks/mutations/useRemoveWatchedItemMutation.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 RemoveWatchedItemParams {
  masterItemId: number;
}

/**
 * Mutation hook for removing an item from the user's watched items list.
 *
 * This hook provides 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 removeWatchedItem = useRemoveWatchedItemMutation();
 *
 * const handleRemove = (itemId: number) => {
 *   removeWatchedItem.mutate(
 *     { masterItemId: itemId },
 *     {
 *       onSuccess: () => console.log('Removed!'),
 *       onError: (error) => console.error(error),
 *     }
 *   );
 * };
 * ```
 */
export const useRemoveWatchedItemMutation = () => {
  const queryClient = useQueryClient();

  return useMutation({
    mutationFn: async ({ masterItemId }: RemoveWatchedItemParams) => {
      const response = await apiClient.removeWatchedItem(masterItemId);

      if (!response.ok) {
        const error = await response.json().catch(() => ({
          message: `Request failed with status ${response.status}`,
        }));
        throw new Error(error.message || 'Failed to remove watched item');
      }

      return response.json();
    },
    onSuccess: () => {
      // Invalidate and refetch watched items to get the updated list
      queryClient.invalidateQueries({ queryKey: queryKeyBases.watchedItems });
      notifySuccess('Item removed from watched list');
    },
    onError: (error: Error) => {
      notifyError(error.message || 'Failed to remove item from watched list');
    },
  });
};