Если вы настроили флоу или пейвол с помощью билдера, вам не нужно беспокоиться об их отображении в коде мобильного приложения — всё, что нужно показать и как именно это показать, уже задано внутри самого флоу или пейвола.

Перед тем как начать показывать флоу (нажмите, чтобы раскрыть)

1. Настройте начальную интеграцию Adapty с App Store и с Google Play. 2. Установите и настройте Adapty SDK. Обязательно установите параметр observerMode в значение true. Обратитесь к гайду по установке Capacitor SDK. 3. Создайте продукты в дашборде Adapty. 4. Настройте флоу или пейволы в билдерах и привяжите к ним продукты. 5. Создайте плейсменты и назначьте им флоу или пейволы. 6. Загрузите флоу и их конфигурацию в коде мобильного приложения.

В режиме Observer SDK не выполняет покупки за вас. Когда пользователь нажимает кнопку покупки или восстановления во флоу или пейволе, отрендеренном Adapty, SDK вызывает ваш обработчик события onObserverPurchaseInitiated или onObserverRestoreInitiated — именно там нужно выполнить покупку или восстановление с помощью вашего кода.

1. Установите обработчики событий режима Observer на представление. В отличие от других платформ, отдельного объекта resolver нет — обработчики являются частью обычных обработчиков событий, поэтому устанавливайте их для каждого создаваемого представления:

   import { adapty, createFlowView } from '@adapty/capacitor';
   
   const view = await createFlowView(flow);
   
   const unsubscribe = await view.setEventHandlers({
     onObserverPurchaseInitiated(product, onStartPurchase, onFinishPurchase) {
       onStartPurchase(); // the view shows its loading indicator
       myPurchaseApi(product.vendorProductId)
         .then((transactionId) =>
           adapty.reportTransaction({ transactionId, variationId: flow.variationId }),
         )
         .finally(() => onFinishPurchase()); // the view hides the loading indicator
       return false; // keep the flow open; dismiss it yourself after success
     },
     onObserverRestoreInitiated(onStartRestore, onFinishRestore) {
       onStartRestore();
       myRestoreApi().finally(() => onFinishRestore());
       return false;
     },
   });

onObserverPurchaseInitiated сообщает, что пользователь инициировал покупку, а onObserverRestoreInitiated — что пользователь инициировал восстановление. В ответ на эти события запустите свой кастомный флоу покупки или восстановления.

Также не забудьте вызвать следующие коллбэки, чтобы уведомить AdaptyUI о ходе покупки или восстановления. Это необходимо для корректной работы флоу, например для отображения загрузчика:

Callback	Description
onStartPurchase()	Этот колбэк нужно вызвать, чтобы уведомить AdaptyUI о начале покупки.
onFinishPurchase()	Этот колбэк нужно вызвать, чтобы уведомить AdaptyUI о завершении покупки.
onStartRestore()	Этот колбэк нужно вызвать, чтобы уведомить AdaptyUI о начале восстановления покупок.
onFinishRestore()	Этот колбэк нужно вызвать, чтобы уведомить AdaptyUI о завершении восстановления покупок.

2. Отобразите флоу как обычно: получите флоу и создайте его представление, затем покажите его. Дополнительные параметры не нужны — обработчики срабатывают только тогда, когда SDK был активирован с observerMode: true.