React query not refreshing list results

I have a list query that returns an array of orders, that specifically have a value of acceptedAt: null. I then have a mutation that on click of a button updates the value of acceptedAt to a date.

The mutation invalidates the server key used on the list end point to “refresh” the list, however for some reason the item that i have just updated, remains in the list, but with the acceptedAt set. (obviously its refreshing the values of the list items, but not the list itself.)

Here is the query:

export const useOrderList = <TData = OrderListResponseType,>(
  params: OrderListParametersType,
  options?: ApiV2InfiniteQueryOptions<TData>,
) => {
  const { business } = useSellarCurrentBusiness();
  const { user } = useFirebaseUser();
  console.log({ params });
  return useInfiniteQuery({
    queryKey: [user?.uid, business?.id, ServerStateKeys.Orders, params],
    queryFn: ({ pageParam }) =>
      apiV2Request({
        user,
        business,
        method: "get",
        path: `orders`,
        params: {
          ...params,
          offset: pageParam,
        },
      }).then((data) => apiV2AssertResponse<TData>(data).data),
    ...getDefaultInfiniteQueryOptions({ ...options, limit: params.limit }),
  });
};

and here is the mutation:

export const useOrderAccept = (id: number) => {
  const { business } = useSellarCurrentBusiness();
  const { user } = useFirebaseUser();
  const queryClient = useQueryClient();

  return useMutation({
    mutationFn: () =>
      apiV2Request({
        user,
        business,
        method: "post",
        path: `orders/v2/${id}/accept`,
      }).then(
        (response) =>
          apiV2AssertResponse(response)
            .data as OrderV2Dto.OrderAcceptResponseType,
      ),
    onSuccess: (response) => {
      queryClient.invalidateQueries({
        queryKey: [user?.uid, business?.id, ServerStateKeys.Orders],
      });
      queryClient.setQueriesData<InfiniteData<OrderListResponseType>>(
        {
          predicate: ({ queryKey }) => {
            return (
              queryKey[0] === user?.uid &&
              queryKey[1] === business?.id &&
              queryKey[2] === ServerStateKeys.Orders &&
              typeof queryKey[3] === "object"
            );
          },
        },
        (data) => {
          if (!data?.pages) return data;
          return {
            ...data,
            pages: data.pages.map((page) =>
              page.map((order) =>
                order.id === response.id ? response : order,
              ),
            ),
          };
        },
      );
    },
  });