mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-29 18:13:47 +00:00
feat: add gift purchase UI states for telegram recipients
- Add recipient_in_bot and bot_link fields to PurchaseStatus API type - Show bot link instruction when gift recipient is not in bot - Show "gift sent via Telegram" message when recipient is in bot - Fix duplicate text rendering in GiftPendingActivationState - Handle recipientInBot=null edge case safely - Add gift notification translations for ru, en, zh, fa locales
This commit is contained in:
@@ -218,6 +218,9 @@ function SuccessState({
|
||||
periodDays,
|
||||
isGift,
|
||||
giftMessage,
|
||||
recipientInBot,
|
||||
botLink,
|
||||
contactType,
|
||||
}: {
|
||||
subscriptionUrl: string | null;
|
||||
cryptoLink: string | null;
|
||||
@@ -227,6 +230,9 @@ function SuccessState({
|
||||
periodDays: number | null;
|
||||
isGift: boolean;
|
||||
giftMessage: string | null;
|
||||
recipientInBot: boolean | null;
|
||||
botLink: string | null;
|
||||
contactType: string | null;
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const [copied, setCopied] = useState(false);
|
||||
@@ -299,7 +305,13 @@ function SuccessState({
|
||||
{tariffName} — {periodDays} {t('landing.daysAccess')}
|
||||
</p>
|
||||
)}
|
||||
{displayContact && (
|
||||
{isGift && contactType === 'telegram' && recipientInBot === true && (
|
||||
<p className="mt-2 text-sm text-dark-400">{t('landing.giftTelegramSent')}</p>
|
||||
)}
|
||||
{isGift && contactType === 'telegram' && recipientInBot !== true && (
|
||||
<p className="mt-2 text-sm text-dark-400">{t('landing.giftTelegramNotInBot')}</p>
|
||||
)}
|
||||
{!(isGift && contactType === 'telegram') && displayContact && (
|
||||
<p className="mt-2 text-sm text-dark-400">
|
||||
{isGift
|
||||
? t('landing.giftSentTo', { contact: displayContact })
|
||||
@@ -313,6 +325,18 @@ function SuccessState({
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Bot link for telegram gifts where recipient is not in bot */}
|
||||
{isGift && contactType === 'telegram' && recipientInBot !== true && botLink && (
|
||||
<a
|
||||
href={botLink}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex w-full items-center justify-center gap-2 rounded-xl bg-accent-500 px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-accent-400"
|
||||
>
|
||||
{t('landing.openBot')}
|
||||
</a>
|
||||
)}
|
||||
|
||||
{/* QR Code */}
|
||||
{displayUrl && (
|
||||
<div className="space-y-4">
|
||||
@@ -507,11 +531,17 @@ function GiftPendingActivationState({
|
||||
periodDays,
|
||||
recipientContactValue,
|
||||
giftMessage,
|
||||
recipientInBot,
|
||||
botLink,
|
||||
contactType,
|
||||
}: {
|
||||
tariffName: string | null;
|
||||
periodDays: number | null;
|
||||
recipientContactValue: string | null;
|
||||
giftMessage: string | null;
|
||||
recipientInBot: boolean | null;
|
||||
botLink: string | null;
|
||||
contactType: string | null;
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
@@ -556,18 +586,38 @@ function GiftPendingActivationState({
|
||||
{tariffName} — {periodDays} {t('landing.daysAccess')}
|
||||
</p>
|
||||
)}
|
||||
{recipientContactValue && (
|
||||
{contactType === 'telegram' && recipientInBot === true && (
|
||||
<p className="mt-2 text-sm text-dark-400">{t('landing.giftTelegramPendingSent')}</p>
|
||||
)}
|
||||
{contactType === 'telegram' && recipientInBot !== true && (
|
||||
<p className="mt-2 text-sm text-dark-400">{t('landing.giftTelegramPendingNotInBot')}</p>
|
||||
)}
|
||||
{contactType !== 'telegram' && (
|
||||
<p className="mt-2 text-sm text-dark-400">{t('landing.giftPendingActivationDesc')}</p>
|
||||
)}
|
||||
{contactType !== 'telegram' && recipientContactValue && (
|
||||
<p className="mt-2 text-sm text-dark-400">
|
||||
{t('landing.giftSentTo', { contact: recipientContactValue })}
|
||||
</p>
|
||||
)}
|
||||
<p className="mt-2 text-sm text-dark-400">{t('landing.giftPendingActivationDesc')}</p>
|
||||
{giftMessage && (
|
||||
<p className="mt-2 text-sm italic text-dark-400">
|
||||
{t('landing.giftMessage')}: {giftMessage}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Bot link for telegram gifts where recipient is not in bot */}
|
||||
{contactType === 'telegram' && recipientInBot !== true && botLink && (
|
||||
<a
|
||||
href={botLink}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex w-full items-center justify-center gap-2 rounded-xl bg-accent-500 px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-accent-400"
|
||||
>
|
||||
{t('landing.openBot')}
|
||||
</a>
|
||||
)}
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
@@ -756,6 +806,9 @@ export default function PurchaseSuccess() {
|
||||
periodDays={purchaseStatus.period_days}
|
||||
isGift={purchaseStatus.is_gift}
|
||||
giftMessage={purchaseStatus.gift_message}
|
||||
recipientInBot={purchaseStatus.recipient_in_bot}
|
||||
botLink={purchaseStatus.bot_link}
|
||||
contactType={purchaseStatus.contact_type}
|
||||
/>
|
||||
) : isGiftPendingActivation ? (
|
||||
<GiftPendingActivationState
|
||||
@@ -763,6 +816,9 @@ export default function PurchaseSuccess() {
|
||||
periodDays={purchaseStatus.period_days}
|
||||
recipientContactValue={purchaseStatus.recipient_contact_value}
|
||||
giftMessage={purchaseStatus.gift_message}
|
||||
recipientInBot={purchaseStatus.recipient_in_bot}
|
||||
botLink={purchaseStatus.bot_link}
|
||||
contactType={purchaseStatus.contact_type}
|
||||
/>
|
||||
) : isPendingActivation ? (
|
||||
<div className="space-y-4">
|
||||
|
||||
Reference in New Issue
Block a user