useQueryClient inside a custom hook

const { useMutation, useQueryClient } = require("@tanstack/react-query");

function useMutateAndUpdate({parentQueryKey, childQueryKey, mutateFunction, isNew = false, onSuccess}) {
  
  const queryClient = useQueryClient();

  const mutation = useMutation({
    mutationFn: (data) => mutateFunction(data),
    onSuccess: ({screen: data}) => {
      // do some stuff to setQueryData in parent and child queries
      onSuccess(data);
    } 
  })
  return mutation;
}

export {useMutateAndUpdate}

const saveOrUpdate = useMutateAndUpdate({
    parentQueryKey: ['screens'],
    childQueryKey: ['screens', {id: screen.id || 'new'}],
    mutateFunction: screenActions.saveOrUpdate,
    onSuccess: (data) => navigate(`/screens/${data.id}`),
    isNew: _.isEmpty(screen.id)
  });