Problem with Optimistic Updates

const mutation = useMutation({
  mutationFn: deleteUsers,
  onMutate: async (variables) => {
    const users = data?.pages.flatMap((page) => page.users) ?? [];
    const userFilters :reactcharts: = users.filter((user) => user.email !== variables.email);
    await queryClient.cancelQueries({ queryKey: ["users"] });

    const previusUsers = queryClient.getQueryData(["users"]);

    queryClient.setQueryData(["users"], () => {
      return {
        pages: [{ users: userFilters }],
        pageParams: [data?.pageParams],
      };
    );

    return { previusUsers };
  },
  onError: (err, newData, context) => {
    console.log(err, newData, context?.previusUsers);
    queryClient.setQueryData(["users"], context?.previusUsers);
  },
  onSettled: () => {
    queryClient.invalidateQueries({ queryKey: ["users"] });
  },
});

const deleteData = (email: string) => {
  mutation.mutate({ email, id: 1 });
};

const mutation = useMutation({
  mutationFn: deleteUsers,
  onMutate: async (variables) => {
    const users = data?.pages.flatMap((page) => page.users) ?? [];
    const userFilters :reactcharts: = users.filter((user) => user.email !== variables.email);
    await queryClient.cancelQueries({ queryKey: ["users"] });

    const previusUsers = queryClient.getQueryData(["users"]);

    queryClient.setQueryData(["users"], () => {
      return {
        pages: [{ users: userFilters }],
        pageParams: [data?.pageParams],
      };
    );

    return { previusUsers };
  },
  onError: (err, newData, context) => {
    console.log(err, newData, context?.previusUsers);
    queryClient.setQueryData(["users"], context?.previusUsers);
  },
  onSettled: () => {
    queryClient.invalidateQueries({ queryKey: ["users"] });
  },
});

const deleteData = (email: string) => {
  mutation.mutate({ email, id: 1 });
};

export const deleteUsers = async (
{email,id,}: { email: string; id: number }) => {
  const response = await fetch(`https://randomuser.me/api/?results=10&seed=franco&page=${id}`,{
    method: "DELETE",
    body: JSON.stringify({
      email,
      }),
    },
  );
  return response.json();
};

export const deleteUsers = async (
{email,id,}: { email: string; id: number }) => {
  const response = await fetch(`https://randomuser.me/api/?results=10&seed=franco&page=${id}`,{
    method: "DELETE",
    body: JSON.stringify({
      email,
      }),
    },
  );
  return response.json();
};