Add to wishlist

Wishlist integration connects the Bambuser player's wishlist UI to your app's native wishlist. There are five events to handle, covering the full wishlist lifecycle. All of them arrive through the onEvent callback on <BambuserVideoView />.

Event payloads differ slightly between iOS and Android. The examples below normalize both shapes. See Events › Platform differences.

1. Provide Wishlist Status

When the player loads, it fires provide-wishlist-status to learn which products are already in the user's wishlist. Respond by calling invoke('updateWishlistStatus', ...) with a JSON map of sku → boolean.

import { Platform } from 'react-native';

function handleEvent(e) {
  const { type, data } = e.nativeEvent;

  if (type === 'provide-wishlist-status') {
    const products = Platform.OS === 'ios'
      ? data?.event?.products
      : data?.products;

    const statuses = {};
    for (const product of products ?? []) {
      const sku = product.ref;
      if (sku) {
        statuses[sku] = YourWishlistService.isInWishlist(sku);
      }
    }

    playerRef.current?.invoke(
      'updateWishlistStatus',
      JSON.stringify({ statuses }),
    );
  }
}

2. Add to Wishlist

Fires when a user taps the wishlist button on a product. Add the item to your wishlist and respond with notify.

const callbackKey = e.nativeEvent.callbackKey ?? data?.callbackKey;

if (type === 'add-to-wishlist' && callbackKey) {
  const eventData = Platform.OS === 'ios' ? data?.event : data;
  const sku = eventData?.ref;

  YourWishlistService.add(sku).then(() => {
    playerRef.current?.notify(callbackKey, { success: true, sku });
  });
}

3. Remove from Wishlist

Fires when a user taps the wishlist button again to remove a previously added product.

if (type === 'remove-from-wishlist' && callbackKey) {
  const eventData = Platform.OS === 'ios' ? data?.event : data;
  const sku = eventData?.ref;

  YourWishlistService.remove(sku).then(() => {
    playerRef.current?.notify(callbackKey, { success: true, sku });
  });
}

4. Open Wishlist

Fires when a user taps View Wishlist. Navigate to your app's native wishlist screen.

if (type === 'open-wishlist') {
  navigateToWishlist();
}

5. Open Wishlist Login

Fires when an unauthenticated user attempts to wishlist a product. Present a login prompt, then respond with notify once the flow completes.

if (type === 'open-wishlist-login' && callbackKey) {
  showLoginPrompt().then((success) => {
    playerRef.current?.notify(callbackKey, { success });
  });
}

Event Summary

Event	Has callbackKey	Response
provide-wishlist-status	No	invoke('updateWishlistStatus', jsonString)
add-to-wishlist	Yes	notify(callbackKey, { success: true, sku })
remove-from-wishlist	Yes	notify(callbackKey, { success: true, sku })
open-wishlist	No	Navigate to wishlist screen.
open-wishlist-login	Yes	Show login, then notify(callbackKey, { success: true }).