@jolibox/implement 1.1.38 → 1.1.39

package/src/native/rewards/ui/payment-modal.ts

@@ -0,0 +1,254 @@
+import {
+  rewardsEmitter,
+  PaymentResultEventName,
+  InvokePaymentEventName,
+  IInvokePaymentEvent,
+  IPaymentChoice,
+  UseModalFrequencyEventName,
+  IUseModalFrequencyConfig
+} from '@/common/rewards/reward-emitter';
+import { createPaymentJolicoinModal } from '@jolibox/ui';
+import { innerFetch as fetch } from '@/native/network';
+import { StandardResponse } from '@jolibox/types';
+import { context } from '@/common/context';
+import { login } from '@/native/api/login';
+import { EventType } from '@jolibox/common';
+
+import { checkPaymentFrequency, updatePaymentFrequency } from '../check-frequency';
+import { paymentHelper } from '@/native/payment';
+import { createLoading } from '@jolibox/ui';
+import { canIUseNative } from '@/native/api/base';
+import { applyNative } from '@jolibox/native-bridge';
+import { isUndefinedOrNull } from '@jolibox/common';
+import { track } from '@/native/report';
+import { updateAutoDeductConfig } from './utils';
+import { createEventPromiseHandler } from '@/common/rewards/registers/utils/event-listener';
+
+const loading = createLoading();
+
+const modalUseFrequencyConfig = createEventPromiseHandler<
+  IUseModalFrequencyConfig,
+  typeof UseModalFrequencyEventName
+>(rewardsEmitter, UseModalFrequencyEventName);
+/**
+ * payment jolicoin modal
+ */
+rewardsEmitter.on(
+  InvokePaymentEventName,
+  async (type: 'JOLI_COIN' | 'ADS-JOLI_COIN', params: IInvokePaymentEvent) => {
+    try {
+      // TODO： temp remove it for dev
+      if (!canIUseNative('requestPaymentSync:paymentBody:appStoreProductId')) {
+        //TODO: show Toast
+        console.info('requestPaymentSync:paymentBody:appStoreProductId not supported');
+        setTimeout(() => {
+          rewardsEmitter.emit(PaymentResultEventName, { paymentResult: 'FAILED' });
+        }, 0);
+        return;
+      }
+
+      // handle showup frequecy
+      if (type === 'ADS-JOLI_COIN') {
+        await loading.show({
+          duration: 3000
+        });
+        const config = await modalUseFrequencyConfig.getData();
+        const { canShow: canShowPaymentModal } = await checkPaymentFrequency(
+          config.joliCoinUseAndCharge.charge
+        );
+        console.log('use payment show by frequency', canShowPaymentModal);
+        loading.hide();
+        if (!canShowPaymentModal) {
+          // return by frequency control
+          rewardsEmitter.emit(PaymentResultEventName, { paymentResult: 'FAILED' });
+          return;
+        }
+        console.log('show by frequency');
+      }
+
+      /**
+       * TODO: need merge totalAmountStr from native
+       */
+      await loading.show({
+        duration: 3000
+      });
+      const balenceDetails = await getBalenceDetails();
+      loading.hide();
+
+      if (!balenceDetails) {
+        rewardsEmitter.emit(PaymentResultEventName, { paymentResult: 'FAILED' });
+        return;
+      }
+
+      track('coinorder_show', {
+        targetType: 'game',
+        eventType: EventType.View
+      });
+
+      const modal = createPaymentJolicoinModal({
+        data: {
+          userJolicoin: params.userJoliCoin,
+          joliCoinQuantity: params.joliCoinQuantity,
+          paymentChoices:
+            balenceDetails.paymentChoices?.map((choice) => ({
+              ...choice,
+              totalAmountStr: choice.totalAmountStr ?? ''
+            })) ?? [],
+          enableAutoDeduct: balenceDetails.enableAutoDeduct
+        },
+        buttons: {
+          confirm: {
+            text: params.confirmButtonText,
+            onPress: async (productId: string) => {
+              track('order_pay_ensure', {
+                targetType: 'game',
+                eventType: EventType.Click,
+                payWay: 'app_iap',
+                coinAmount: params.joliCoinQuantity,
+                orderPrice:
+                  balenceDetails.paymentChoices.find((choice) => choice.productId === productId)
+                    ?.totalAmountStr ?? ''
+              });
+              if (!context.hostUserInfo?.isLogin) {
+                const { data } = await login({
+                  skipLogin: true
+                });
+                if (!data?.isLogin) {
+                  console.log('login failed');
+                  return;
+                }
+
+                const balenceDetails = await getBalenceDetails();
+                if ((balenceDetails?.balance ?? 0) >= params.joliCoinQuantity) {
+                  rewardsEmitter.emit(PaymentResultEventName, { paymentResult: 'SUCCESS' });
+                  modal.destroy();
+                  return;
+                }
+              }
+              console.log('invokeNativePayment', productId);
+              const appStoreProductId = balenceDetails?.paymentChoices?.find(
+                (choice) => choice.productId === productId
+              )?.appStoreProductId;
+
+              if (!appStoreProductId) {
+                rewardsEmitter.emit(PaymentResultEventName, { paymentResult: 'FAILED' });
+                modal.destroy();
+                return;
+              }
+              await loading.show({
+                duration: 3000
+              });
+              const { code } = await paymentHelper.invokePayment('JOLI_COIN_IAP', {
+                productId,
+                appStoreProductId
+              });
+              loading.hide();
+              track('order_pay_result', {
+                eventType: EventType.Other,
+                targetType: 'game',
+                payWay: 'app_iap',
+                coinAmount: params.joliCoinQuantity,
+                orderPrice:
+                  balenceDetails.paymentChoices.find((choice) => choice.productId === productId)
+                    ?.totalAmountStr ?? '',
+                payResult: code
+              });
+              if (code !== 'SUCCESS') {
+                /** add timeout for google panel closed */
+                console.info('[JoliboxSDK] payment failed in payment.invokePaymet');
+                return;
+              }
+              rewardsEmitter.emit(PaymentResultEventName, { paymentResult: 'SUCCESS' });
+              modal.destroy();
+            }
+          },
+          cancel: {
+            text: params.cancelButtonText,
+            onPress: ({ type }) => {
+              rewardsEmitter.emit(PaymentResultEventName, {
+                paymentResult: (type ?? '') === 'CANCEL' ? 'CANCEL' : 'FAILED'
+              });
+              track('ad_unlock_click', {
+                targetType: 'game',
+                eventType: EventType.Click
+              });
+              modal.destroy();
+            }
+          },
+          onEnableDeductChanged: async (enabled: boolean) => {
+            await updateAutoDeductConfig(enabled);
+          }
+        },
+        onSelect: (productId: string) => {
+          track('coinorder_click', {
+            targetType: 'game',
+            eventType: EventType.Click,
+            coinAmount: params.joliCoinQuantity,
+            orderPrice:
+              balenceDetails.paymentChoices.find((choice) => choice.productId === productId)
+                ?.totalAmountStr ?? ''
+          });
+        }
+      });
+
+      await updatePaymentFrequency();
+    } catch (error) {
+      console.info('payment failed', error);
+      rewardsEmitter.emit(PaymentResultEventName, { paymentResult: 'FAILED' });
+    }
+  }
+);
+
+const mergeResponseData = (
+  responseData: { paymentChoices: IPaymentChoice[] },
+  data: { [appStoreProductId: string]: { price: string } }
+) => {
+  Object.keys(data).forEach((key) => {
+    const choice = responseData.paymentChoices.find((choice) => choice.appStoreProductId === key);
+    if (choice) {
+      choice.totalAmountStr = data[key].price;
+    }
+  });
+
+  responseData.paymentChoices = responseData.paymentChoices.filter(
+    (choice) => !isUndefinedOrNull(choice.totalAmountStr)
+  ) as IPaymentChoice[];
+};
+
+const getBalenceDetails = async (): Promise<
+  | {
+      balance: number;
+      enableAutoDeduct: boolean;
+      paymentChoices: IPaymentChoice[];
+    }
+  | undefined
+> => {
+  const { response } = await fetch<
+    StandardResponse<{
+      balance: number;
+      enableAutoDeduct: boolean;
+      paymentChoices: IPaymentChoice[];
+    }>
+  >('/api/joli-coin/balance-detail', {
+    method: 'GET',
+    appendHostCookie: true,
+    responseType: 'json'
+  });
+
+  console.info('getBalenceDetails', response);
+  const { data } = await applyNative('requestProductDetailsAsync', {
+    appStoreProductIds:
+      response.data?.data?.paymentChoices
+        ?.filter((choice) => typeof choice.appStoreProductId === 'string')
+        .map((choice) => choice.appStoreProductId as string) ?? []
+  });
+
+  if (response.data?.data && data) {
+    mergeResponseData(response.data?.data, data);
+  }
+  console.info('productDetails', response.data?.data);
+  if (response.data?.data?.paymentChoices.length === 0) {
+    throw new Error('paymentChoices is empty');
+  }
+  return response.data?.data;
+};

package/src/native/rewards/ui/unlogin-modal.ts

@@ -0,0 +1,121 @@
+import {
+  InvokeUnloginModalEventName,
+  IUseModalFrequencyConfig,
+  rewardsEmitter,
+  UseModalFrequencyEventName,
+  UseUnloginModalResultEventName
+} from '@/common/rewards/reward-emitter';
+import { createEventPromiseHandler } from '@/common/rewards/registers/utils/event-listener';
+import { checkUnloginModalFrequency, updateUnloginModalFrequency } from '../check-frequency';
+import { StandardResponse } from '@jolibox/types';
+import { innerFetch as fetch } from '@/native/network';
+import { reportError } from '@/common/report/errors/report';
+import { InternalInvokeMethodError } from '@jolibox/common';
+import { loginImplement } from '@/native/api/login';
+import { createToast, createUnloginJolicoinModal } from '@jolibox/ui';
+
+const unloginModalConfig = createEventPromiseHandler<
+  IUseModalFrequencyConfig,
+  typeof UseModalFrequencyEventName
+>(rewardsEmitter, UseModalFrequencyEventName);
+
+unloginModalConfig.getData();
+
+rewardsEmitter.on(InvokeUnloginModalEventName, async (type: 'JOLI_COIN' | 'ADS-JOLI_COIN', params) => {
+  try {
+    if (type === 'ADS-JOLI_COIN') {
+      const config = await unloginModalConfig.getData();
+      console.log('unlogin guide config', config.loginGuide);
+
+      if (!config.loginGuide.show) {
+        rewardsEmitter.emit(UseUnloginModalResultEventName, { result: 'NOT_SUPPORT' });
+        return;
+      }
+      const { canShow: canShowUseModal } = await checkUnloginModalFrequency(config.loginGuide);
+
+      console.log('canShowUseModal', canShowUseModal);
+      if (!canShowUseModal) {
+        rewardsEmitter.emit(UseUnloginModalResultEventName, { result: 'FAILED' });
+        return;
+      }
+    }
+
+    const { firstLogin } = (await getRewardCoin()) ?? {};
+    if (!firstLogin?.reward) {
+      console.log('[JoliboxSDK] unlogin modal reward is empty');
+      rewardsEmitter.emit(UseUnloginModalResultEventName, { result: 'NOT_SUPPORT' });
+      return;
+    }
+    const modal = createUnloginJolicoinModal({
+      data: {
+        rewardType: type,
+        rewardValue: firstLogin.reward.rewardValue
+      },
+      buttons: {
+        confirm: {
+          text: params.confirmButtonText,
+          onPress: async () => {
+            const { isLogin, extra, isFirstLogin } = await loginImplement({}, true);
+            if (!isLogin) {
+              console.log('login failed');
+              return;
+            }
+            if (isFirstLogin && extra?.firstLogin?.reward) {
+              const { rewardValue } = extra.firstLogin.reward;
+              createToast(`{slot-i18ntran-loginGuide.rewardTips}`, {
+                i18nParams: {
+                  text: 'Jolicoin Used',
+                  coin: rewardValue
+                },
+                position: 'top',
+                duration: 3000
+              });
+            }
+
+            rewardsEmitter.emit(UseUnloginModalResultEventName, {
+              result: 'SUCCESS',
+              rewards: {
+                jolicoin: {
+                  claimedRewardValue: extra?.firstLogin?.reward?.rewardValue ?? 0,
+                  isFirstLogin: isFirstLogin ?? false
+                }
+              }
+            });
+            modal.destroy();
+            return;
+          }
+        },
+        cancel: {
+          text: params.cancelButtonText,
+          onPress: () => {
+            rewardsEmitter.emit(UseUnloginModalResultEventName, { result: 'FAILED' });
+            modal.destroy();
+          }
+        }
+      }
+    });
+    await updateUnloginModalFrequency();
+  } catch (e) {
+    reportError(new InternalInvokeMethodError(e as Error));
+    rewardsEmitter.emit(UseUnloginModalResultEventName, { result: 'FAILED' });
+  }
+});
+
+interface IRewardCoinResponse {
+  firstLogin: {
+    reward: {
+      rewardType: 'JOLI_COIN';
+      rewardValue: number;
+    };
+  };
+}
+
+const getRewardCoin = async (): Promise<IRewardCoinResponse | undefined> => {
+  const { response } = await fetch<StandardResponse<IRewardCoinResponse>>('/api/base/global-config', {
+    method: 'GET',
+    appendHostCookie: true,
+    responseType: 'json'
+  });
+
+  return response.data?.data;
+};

package/src/native/rewards/ui/use-modal.ts

@@ -0,0 +1,104 @@
+import { checkUseModalFrequency, updateUseModalFrequency } from '../check-frequency';
+import { updateAutoDeductConfig } from './utils';
+import {
+  IUseModalFrequencyConfig,
+  rewardsEmitter,
+  UseModalFrequencyEventName,
+  IUseModalEvent
+} from '@/common/rewards/reward-emitter';
+import { UseModalEventName, UseModalResultEventName } from '@/common/rewards/reward-emitter';
+import { createConfirmJolicoinModal, createLoading } from '@jolibox/ui';
+import { track } from '@/native/report';
+import { EventType } from '@jolibox/common';
+import {} from '@jolibox/ui';
+import { createEventPromiseHandler } from '@/common/rewards/registers/utils/event-listener';
+
+const loading = createLoading();
+
+const modalUseFrequencyConfig = createEventPromiseHandler<
+  IUseModalFrequencyConfig,
+  typeof UseModalFrequencyEventName
+>(rewardsEmitter, UseModalFrequencyEventName);
+
+modalUseFrequencyConfig.getData();
+/**
+ * confirm jolicoin modal
+ */
+rewardsEmitter.on(UseModalEventName, async (type: 'JOLI_COIN' | 'ADS-JOLI_COIN', params: IUseModalEvent) => {
+  if (type === 'ADS-JOLI_COIN') {
+    //TODO
+    await loading.show({
+      duration: 3000
+    });
+    const config = await modalUseFrequencyConfig.getData();
+    const { canShow: canShowUseModal, isFirst: isFirstUseModal } = await checkUseModalFrequency(
+      config.joliCoinUseAndCharge.useJolicoin
+    );
+    console.log('use modal show by frequency', canShowUseModal, isFirstUseModal);
+    loading.hide();
+
+    // First, check for direct use: sufficient balance, auto-deduct enabled, and not the first modal.
+    const { balance } = params.userJoliCoin;
+    const useDirectly = balance >= params.joliCoinQuantity && params.enableAutoDeduct;
+
+    if (useDirectly && !isFirstUseModal) {
+      rewardsEmitter.emit(UseModalResultEventName, { useModalResult: 'CONFIRM' });
+      return;
+    }
+
+    // If not used directly, then check frequency control.
+    if (!canShowUseModal) {
+      // confirm by frequency control
+      rewardsEmitter.emit(UseModalResultEventName, { useModalResult: 'FAILED' });
+      return;
+    }
+  }
+
+  track('unlock_popup_show', {
+    eventType: EventType.View,
+    targetType: 'game'
+  });
+
+  const modal = createConfirmJolicoinModal({
+    data: {
+      enableAutoDeduct: params.enableAutoDeduct,
+      userJolicoin: params.userJoliCoin,
+      joliCoinQuantity: params.joliCoinQuantity
+    },
+    buttons: {
+      confirm: {
+        text: params.confirmButtonText,
+        onPress: () => {
+          track('coin_unlock_click', {
+            targetType: 'game',
+            eventType: EventType.Click,
+            coinConsume: params.joliCoinQuantity,
+            ifAutoUnlock: params.enableAutoDeduct
+          });
+          rewardsEmitter.emit(UseModalResultEventName, { useModalResult: 'CONFIRM' });
+          modal.destroy();
+        }
+      },
+      cancel: {
+        text: params.cancelButtonText,
+        onPress: ({ type }) => {
+          if (type === 'FAILED') {
+            track('ad_unlock_click', {
+              targetType: 'game',
+              eventType: EventType.Click
+            });
+          }
+          rewardsEmitter.emit(UseModalResultEventName, {
+            useModalResult: (type ?? '') === 'CANCEL' ? 'CANCEL' : 'FAILED'
+          });
+          modal.destroy();
+        }
+      },
+      onEnableDeductChanged: async (enabled: boolean) => {
+        await updateAutoDeductConfig(enabled);
+      }
+    }
+  });
+
+  await updateUseModalFrequency();
+});

package/src/native/rewards/ui/utils.ts

@@ -0,0 +1,25 @@
+import { innerFetch as fetch } from '@/native/network';
+/**
+ * update config
+ */
+
+let updateEnableConfigPromise = Promise.resolve();
+
+/**
+ * 更新自动扣费配置的函数
+ * @param enabled 是否启用自动扣费
+ * @returns Promise 更新操作的Promise
+ */
+export const updateAutoDeductConfig = async (enabled: boolean): Promise<void> => {
+  updateEnableConfigPromise = updateEnableConfigPromise.then(async () => {
+    await fetch('/api/joli-coin/user-config', {
+      method: 'POST',
+      appendHostCookie: true,
+      data: {
+        enableAutoDeduct: enabled
+      }
+    });
+  });
+
+  await updateEnableConfigPromise;
+};