@matthew.ngo/react-filter-pilot
Version:
Powerful filtering, pagination, and sorting for React with TanStack Query integration
60 lines (57 loc) • 2.94 kB
TypeScript
import * as _tanstack_react_query from '@tanstack/react-query';
import { Query, UseMutationOptions } from '@tanstack/react-query';
import { UseFilterPilotResult } from '../types/index.js';
interface UseFilterMutationOptions<TData, TFilters, TMutationData, TMutationVariables> {
filterPilot: UseFilterPilotResult<TData, TFilters>;
mutationFn: (variables: TMutationVariables) => Promise<TMutationData>;
onSuccess?: (data: TMutationData, variables: TMutationVariables, context: any) => void;
onError?: (error: Error, variables: TMutationVariables, context: any) => void;
onSettled?: (data: TMutationData | undefined, error: Error | null, variables: TMutationVariables, context: any) => void;
invalidateOnSuccess?: boolean;
optimisticUpdate?: (variables: TMutationVariables) => TData[];
updateAllQueries?: boolean;
queryFilter?: (query: Query) => boolean;
findItemFn?: (item: TData, variables: TMutationVariables) => boolean;
updateItemFn?: (item: TData, variables: TMutationVariables, data?: TMutationData) => TData;
maxQueriesUpdated?: number;
debug?: boolean;
mutationOptions?: Omit<UseMutationOptions<TMutationData, Error, TMutationVariables>, 'mutationFn' | 'onMutate' | 'onError' | 'onSuccess' | 'onSettled'>;
}
/**
* Hook for mutations that work with filter pilot
* Automatically invalidates queries and handles optimistic updates
*/
declare function useFilterMutation<TData, TFilters, TMutationData, TMutationVariables>(options: UseFilterMutationOptions<TData, TFilters, TMutationData, TMutationVariables>): _tanstack_react_query.UseMutationResult<TMutationData, Error, TMutationVariables, {
previousData?: any;
previousDataMap?: Record<string, any>;
mutationId?: string;
wasOptimistic?: boolean;
}>;
/**
* Interface for useItemMutation options
*/
interface ItemMutationOptions<TData, TFilters, TMutationData, TMutationVariables> extends Omit<UseFilterMutationOptions<TData, TFilters, TMutationData, TMutationVariables>, 'findItemFn' | 'updateItemFn' | 'updateAllQueries'> {
itemIdField?: string;
}
/**
* Helper hook for item-based mutations
* Simplifies the process of updating a specific item across all queries
*
* @example
* // Update a notification as read across all pages
* const markAsRead = useItemMutation({
* filterPilot,
* mutationFn: (id) => api.markNotificationAsRead(id),
* itemIdField: 'id',
* });
*
* // Usage
* markAsRead.mutate(notificationId);
*/
declare function useItemMutation<TData, TFilters, TMutationData, TMutationVariables>({ filterPilot, mutationFn, itemIdField, ...options }: ItemMutationOptions<TData, TFilters, TMutationData, TMutationVariables>): _tanstack_react_query.UseMutationResult<TMutationData, Error, TMutationVariables, {
previousData?: any;
previousDataMap?: Record<string, any>;
mutationId?: string;
wasOptimistic?: boolean;
}>;
export { useFilterMutation, useItemMutation };