GraphQL syntax errors on `cart.getAvailablePaymentMethods()` and `cart.getBookableStaffVariants()`

[jvore]

When attempting to run the following code with the book-sdk:v2.0.2:

const paymentMethods = await cart.getAvailablePaymentMethods();
const staffVariants = await cart.getBookableStaffVariants(time, service);

The book-sdk is targeting my sandbox env and cart is a valid cart with items and an owner.

I get the following error back for each request:

Example Request Payload

{
    "query": "\n  [object Object]\n  query Cart($id: ID!) {\n    cart(id: $id) {\n      availablePaymentMethods {\n        ...CartAvailablePaymentMethodProperties\n      }\n    }\n  }\n"
}

Example Request Response

{
    "errors": [
        {
            "message": "syntax error before: '['",
            "locations": [
                {
                    "line": 2,
                    "column": 3
                }
            ]
        }
    ]
}

Upon digging deeper, I noticed that ${fragments} is being referenced as an object in both gql templates here (vs ${fragments.cart} etc) resulting in it being output as [object Object] in the request payload.

https://github.com/Boulevard/book-sdk/blob/e66243bf4127bda85929cfefddf4b3ad7ecdc226/src/carts/graph.ts#L337-L360

[jvore]

It looks like changing availablePaymentMethodsQuery in src/carts/graph.ts to:

export const availablePaymentMethodsQuery = gql`
  ${fragments.paymentMethod}
  query Cart($id: ID!) {
    cart(id: $id) {
      availablePaymentMethods {
        ...CartItemPaymentMethodProperties
      }
    }
  }
`;

and updating getAvailablePaymentMethods() method in src/cart.ts to:

async getAvailablePaymentMethods(): Promise<Array<CartItemPaymentMethod>> {
    const response = await this.platformClient.request(
      graph.availablePaymentMethodsQuery,
      { id: this.id }
    );

    return response.cart.availablePaymentMethods.map(
      category => new CartItemPaymentMethod(this.platformClient, category)
    );
  }

resolves the error for cart.getAvailablePaymentMethods().