9121b50e02
Docker Image / Build and Push Docker Image (push) Successful in 3m1s
(cherry picked from commit ef9b79bc83)
98 lines
3.0 KiB
TypeScript
98 lines
3.0 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useMemo, useRef, useState } from "react";
|
|
import { shallowEqual } from "@xstate/react";
|
|
|
|
import type { LoginStatus } from "@/data/schemas/auth";
|
|
import { getDefaultPayChannelForCountryCode } from "@/lib/payment/default_pay_channel";
|
|
import { useAppNavigator } from "@/router/use-app-navigator";
|
|
import {
|
|
usePaymentDispatch,
|
|
usePaymentSelector,
|
|
} from "@/stores/payment/payment-context";
|
|
import { useUserSelector } from "@/stores/user/user-context";
|
|
|
|
import { deriveChatSupportCta } from "../chat-support-cta";
|
|
|
|
export function useChatSupportCta(input: {
|
|
characterId: string;
|
|
historyLoaded: boolean;
|
|
loginStatus: LoginStatus;
|
|
}) {
|
|
const navigator = useAppNavigator();
|
|
const paymentDispatch = usePaymentDispatch();
|
|
const initializedCharacterRef = useRef<string | null>(null);
|
|
const [nowMs, setNowMs] = useState(() => Date.now());
|
|
const payment = usePaymentSelector(
|
|
(state) => ({
|
|
commercialOffer: state.context.commercialOffer,
|
|
isFirstRecharge: state.context.isFirstRecharge,
|
|
supportCharacterId: state.context.supportCharacterId,
|
|
}),
|
|
shallowEqual,
|
|
);
|
|
const countryCode = useUserSelector(
|
|
(state) => state.context.currentUser?.countryCode,
|
|
);
|
|
const isAuthenticated =
|
|
input.loginStatus !== "notLoggedIn" && input.loginStatus !== "guest";
|
|
|
|
useEffect(() => {
|
|
if (!isAuthenticated) return;
|
|
if (initializedCharacterRef.current === input.characterId) return;
|
|
initializedCharacterRef.current = input.characterId;
|
|
paymentDispatch({
|
|
type: "PaymentInit",
|
|
characterId: input.characterId,
|
|
payChannel: getDefaultPayChannelForCountryCode(countryCode),
|
|
});
|
|
}, [countryCode, input.characterId, isAuthenticated, paymentDispatch]);
|
|
|
|
useEffect(() => {
|
|
if (!payment.commercialOffer) return;
|
|
const timer = window.setInterval(() => setNowMs(Date.now()), 1000);
|
|
return () => window.clearInterval(timer);
|
|
}, [payment.commercialOffer]);
|
|
|
|
const cta = useMemo(
|
|
() =>
|
|
deriveChatSupportCta({
|
|
isFirstRecharge:
|
|
isAuthenticated && payment.supportCharacterId === input.characterId
|
|
? payment.isFirstRecharge
|
|
: false,
|
|
commercialOffer:
|
|
isAuthenticated && payment.supportCharacterId === input.characterId
|
|
? payment.commercialOffer
|
|
: null,
|
|
nowMs,
|
|
}),
|
|
[
|
|
input.characterId,
|
|
isAuthenticated,
|
|
nowMs,
|
|
payment.commercialOffer,
|
|
payment.isFirstRecharge,
|
|
payment.supportCharacterId,
|
|
],
|
|
);
|
|
|
|
const open = () => {
|
|
navigator.openSubscription({
|
|
type: cta.planId?.startsWith("dol_") ? "topup" : "vip",
|
|
returnTo: "chat",
|
|
...(cta.planId ? { planId: cta.planId } : {}),
|
|
...(cta.commercialOfferId
|
|
? { commercialOfferId: cta.commercialOfferId }
|
|
: {}),
|
|
analytics: {
|
|
entryPoint: "chat_offer_banner",
|
|
triggerReason:
|
|
cta.kind === "support" ? "vip_cta" : "commercial_offer",
|
|
},
|
|
});
|
|
};
|
|
|
|
return { ...cta, visible: input.historyLoaded, open };
|
|
}
|