Spring boot Paypal checkout sdk - can not return HttpResponse<com.paypal.orders.Order>

Question

Hello this is my method to create order

public HttpResponse<com.paypal.orders.Order> createOrder() {
    OrdersCreateRequest request = new OrdersCreateRequest();
    request.header("prefer","return=representation");
    request.requestBody(buildRequestBodyX());
    try {
        HttpResponse<com.paypal.orders.Order> response = payPalClient.client().execute(request);
        return response;
    } catch (IOException e) {
        throw new ResponseStatusException(HttpStatus.INTERNAL_SERVER_ERROR, e.getMessage());
    }
}

Order is being created, but in controller, after returning HttpResponse<com.paypal.orders.Order>

I get this error

 Resolved [org.springframework.http.converter.HttpMessageNotWritableException: No converter found for return value of type: class com.paypal.http.HttpResponse]

After changing return type to lets say String, and returning only its id, it works as it should..

And also im asking if this is correct on fronted side(Angular)

      paypal
        .Buttons({
          style: {
            color: 'blue',
            shape: 'pill',
            label: 'pay',
            height: 40
          },
          createOrder: function() {
            return fetch('http://localhost:8080/checkout/paypal/create', {
              method: 'post',
              headers: {
                'content-type': 'application/json'
              }
            }).then(function(res) {
              return res.json();
            }).then(function(data) {
              return data.id;
            });
          },
          onApprove: function(data) {
            return fetch('http://localhost:8080/checkout/paypal/capture?id=' + this.id + '&orderId=' + data.id, {
              headers: {
                'content-type': 'application/json'
              },

            }).then(function(res) {
              return res.json();
            }).then(function(details) {
              alert('Transaction funds captured from ' + details.payer_given_name);
            });
          },
          onError: err => {
          }
        })
        .render(this.paypalElement.nativeElement);
    }

Answer 1

So i just have updated angular buttons function like bellow, and on backend returned only order id, and works as it should..

     paypal
    .Buttons({
      style: {
        color:  'blue',
        shape:  'pill',
        label:  'pay',
        height: 40
      },
      createOrder: () => {
        return this.create_order_paypal(id).then(
          res=>{
            return res;
          }
        );
      },
      onApprove: async (data) => {
        return this.capture_order_paypal(id,data.orderID).then(
          res=>{
            this.apiService.successSnackBar("Successfully purchased!");
            this.paidFor = true;
            this.getOrder(id);
          }
        )
      },
      onError: err => {
        console.log(err)
      }
    })
    .render(this.paypalElement.nativeElement);

  async create_order_paypal(id) {
    return this.apiService.create_order_paypal(id).toPromise();
  }

  async capture_order_paypal(id,paypal_id) {
    return this.apiService.capture_order_paypal(id,paypal_id).toPromise();
  }