Funtions with two parameter not working in React

I have 2 files. One of them is “http” folder for requests, the other one is React Component. I have a problem when I want to change the form and upload a profile photo. Changing form is working (userDetails), but the photo object not working (UpdatedProfilePicture). The response comes back empty object.

I had an idea and tried. I changed the URL and deleted userDetails, and formData worked. But both of them not worked. Actually, the first parameter works, but the second parameter does not work. For request, I use React Query

The Component

  const { mutate } = useMutation(apiService.updateUserDetailsInfo);

  const onSubmit = () => {
    let formData = new FormData();
    formData.append("photo", UpdatedProfilePicture);
    const urlUserDetails = new URLSearchParams(userDetails);

    mutate(urlUserDetails, formData);

  };

The http folder

     updateUserDetailsInfo: async (userDetails, formData) => {
      const response = await httpService.patch(`/user/detailsInfo?${userDetails}`, formData);
      return response?.data;
    },