Web Integration Patterns

import Encore from '@encorekit/web-sdk';

async function onCancelTapped() {
  const result = await Encore.placement('cancel_flow').show();

  switch (result.status) {
    case 'claimed':
      // Deferred: run your conversion, then Encore.redeem().
      // Immediate: advertiser tab already open; render your own confirmation if wanted.
      keepSubscriptionActive();
      break;
    case 'dismissed':
      // User closed/declined (result.reason says which), or an internal error
      // (result.reason.type === 'error'). Proceed with the original flow.
      await proceedWithCancellation();
      break;
    case 'unavailable':
      // No eligible offers: show your fallback.
      await proceedWithCancellation();
      break;
  }

  analytics.track('cancel_flow_resolved'); // shared tail runs once
}

const result = await Encore.placement('cancel_flow')
  .onLoadingStateChange((isLoading) => setSpinner(isLoading))
  .show();

async function showOffer(placementId, placementOptions) {
  analytics.track('offer_surface_opened', { placementId });
  const result = await Encore.placement(placementId, placementOptions).show();
  analytics.track('offer_surface_resolved', { placementId, status: result.status });
  return result;
}