How to Add Products to Wishlist By GraphQL Mutation Magento 2?

addProductsToWishlist mutation to add any type of products in the wishlist using GraphQL Mutation Magento 2.

Before adding with mutation, Make sure the Wishlist feature is activated by settings.
Go to Admin panel, Click Left sidebar Stores -> Configuration.
Now Click on Customers Tab -> Wish List -> General Options -> Enable -> Yes.

You can check the syntax for the addProductsToWishlist from the schema file,
vendor/magento/module-wishlist-graph-ql/etc/schema.graphqls

Supported Product Types to add wishlist mutation:

• Simple
• Virtual
• Downloadable
• Bundle
• Configurable
• Grouped
• Gift card

Syntax:

type Mutation {
    addProductsToWishlist(wishlistId: ID!, wishlistItems: [WishlistItemInput!]!): AddProductsToWishlistOutput @doc(description: "Adds one or more products to the specified wish list. This mutation supports all product types")
}

Step to add a product to wishlist using GraphQL,

1.)Generate Customer Token and set it with Header Param Bearer value,
Authorization Bearer {CUSTOMER_TOKEN}

2) Wishlist GraphQL Mutation,

mutation {
  addProductsToWishlist(
    wishlistId: 3
    wishlistItems: [
      { sku: "24-MB01", quantity: 1 }
      {
        sku: "MJ01"
        quantity: 1
        selected_options: [
          "Y29uZmlndXJhYmxlLzE4Ni8xNzY="
          "Y29uZmlndXJhYmxlLzkzLzY3"
        ]
      }
      {
        sku: "24-WG080"
        quantity: 1
        selected_options: [
          "YnVuZGxlLzEvMi8x"
          "YnVuZGxlLzIvNC8y"
          "YnVuZGxlLzMvNS81"
          "YnVuZGxlLzQvOC81"
        ]
      }
    ]
  ) {
    wishlist {
      id
      items_count
      items {
        id
        qty
        product {
          name
          sku
          id
          ... on BundleProduct {
            __typename
          }
          ... on ConfigurableProduct {
            sku
            configurable_options {
              id
              attribute_id_v2
              attribute_code
              label
              values {
                store_label
                swatch_data {
                  value
                }
              }
            }
          }
        }
      }
    }
    user_errors {
      code
      message
    }
  }
}

Once you run this mutation, two items will be added to the customer wishlist.

You can add single or multiple items at one time from the mutation.

wishlistItems{} The attribute contains the items list add to the wishlist.

1) Simple Product Items data structure,

{ sku: "24-MB03", quantity: 1 }

2) Configurable Product Items data structure,

{
	sku: "MJ01"
	quantity: 1
	selected_options: [
	  "Y29uZmlndXJhYmxlLzE4Ni8xNzY="
	  "Y29uZmlndXJhYmxlLzkzLzY3"
	]
}

SKU is the product SKU and quantity are the no. of qty to add.

selected_options is the base64 encoded value for the child item of the configurable product which the user can select from the item.

Let us Describe it by example,
SKU MJ01 item with child item with Red Color and Size will be S.

Here child item with Color attribute id is 93 and the Red Value option id is 67.
Size attribute option id is 186 and the S Value option id is 176.

echo base64_encode('configurable/186/176'); //Y29uZmlndXJhYmxlLzE4Ni8xNzY=
echo base64_encode('configurable/93/67'); //Y29uZmlndXJhYmxlLzkzLzY3

Based on the response of both the encoded value, we have to add it to the selected options array by each new separate line,

selected_options: [
  "Y29uZmlndXJhYmxlLzE4Ni8xNzY="
  "Y29uZmlndXJhYmxlLzkzLzY3"
]

You can do the same Data structure for the different type of products also.