Merge pull request #54901 from parasharrajat/parasharrajat/early-discount

Early discount countdown banner

Author: youssef-lr

src/CONST.ts

@@ -512,6 +512,7 @@ const CONST = {
         MIN_DATE: '0001-01-01',
         ORDINAL_DAY_OF_MONTH: 'do',
         MONTH_DAY_YEAR_ORDINAL_FORMAT: 'MMMM do, yyyy',
+        SECONDS_PER_DAY: 24 * 60 * 60,
     },
     SMS: {
         DOMAIN: '@expensify.sms',
@@ -897,6 +898,7 @@ const CONST = {
     get DIRECT_REIMBURSEMENT_CURRENCIES() {
         return [this.CURRENCY.USD, this.CURRENCY.AUD, this.CURRENCY.CAD, this.CURRENCY.GBP, this.CURRENCY.EUR];
     },
+    TRIAL_DURATION_DAYS: 8,
     EXAMPLE_PHONE_NUMBER: '+15005550006',
     CONCIERGE_CHAT_NAME: 'Concierge',
     CLOUDFRONT_URL,

src/languages/en.ts

@@ -60,6 +60,8 @@ import type {
     DeleteActionParams,
     DeleteConfirmationParams,
     DidSplitAmountMessageParams,
+    EarlyDiscountSubtitleParams,
+    EarlyDiscountTitleParams,
     EditActionParams,
     EditDestinationSubtitleParams,
     ElectronicFundsParams,
@@ -5363,6 +5365,19 @@ const translations = {
                 title: 'Your free trial has ended',
                 subtitle: 'Add a payment card to continue using all of your favorite features.',
             },
+            earlyDiscount: {
+                claimOffer: 'Claim Offer',
+                noThanks: 'No thanks',
+                subscriptionPageTitle: {
+                    phrase1: ({discountType}: EarlyDiscountTitleParams) => `${discountType}% off your first year!`,
+                    phrase2: `Just add a payment card and start an annual subscription!`,
+                },
+                onboardingChatTitle: {
+                    phrase1: 'Limited time offer:',
+                    phrase2: ({discountType}: EarlyDiscountTitleParams) => `${discountType}% off your first year!`,
+                },
+                subtitle: ({days, hours, minutes, seconds}: EarlyDiscountSubtitleParams) => `Claim within ${days > 0 ? `${days}d : ` : ''}${hours}h : ${minutes}m : ${seconds}s`,
+            },
         },
         cardSection: {
             title: 'Payment',

src/languages/es.ts

@@ -59,6 +59,8 @@ import type {
     DeleteActionParams,
     DeleteConfirmationParams,
     DidSplitAmountMessageParams,
+    EarlyDiscountSubtitleParams,
+    EarlyDiscountTitleParams,
     EditActionParams,
     EditDestinationSubtitleParams,
     ElectronicFundsParams,
@@ -5880,6 +5882,19 @@ const translations = {
                 title: 'Tu prueba gratuita ha terminado',
                 subtitle: 'Añade una tarjeta de pago para seguir utilizando tus funciones favoritas.',
             },
+            earlyDiscount: {
+                claimOffer: 'Solicitar oferta',
+                noThanks: 'No, gracias',
+                subscriptionPageTitle: {
+                    phrase1: ({discountType}: EarlyDiscountTitleParams) => `¡${discountType}% de descuento en tu primer año!`,
+                    phrase2: `¡Solo añade una tarjeta de pago y comienza una suscripción anual!`,
+                },
+                onboardingChatTitle: {
+                    phrase1: 'Oferta por tiempo limitado:',
+                    phrase2: ({discountType}: EarlyDiscountTitleParams) => `¡${discountType}% de descuento en tu primer año!`,
+                },
+                subtitle: ({days, hours, minutes, seconds}: EarlyDiscountSubtitleParams) => `Solicítala en ${days > 0 ? `${days}d : ` : ''}${hours}h : ${minutes}m : ${seconds}s`,
+            },
         },
         cardSection: {
             title: 'Pago',

src/languages/params.ts

@@ -419,6 +419,10 @@ type BillingBannerCardOnDisputeParams = {amountOwed: string; cardEnding: string}
 
 type TrialStartedTitleParams = {numOfDays: number};
 
+type EarlyDiscountTitleParams = {discountType: number};
+
+type EarlyDiscountSubtitleParams = {days: number; hours: number; minutes: number; seconds: number};
+
 type CardNextPaymentParams = {nextPaymentDate: string};
 
 type CardEndingParams = {cardNumber: string};
@@ -644,6 +648,8 @@ export type {
     BillingBannerCardExpiredParams,
     BillingBannerCardOnDisputeParams,
     TrialStartedTitleParams,
+    EarlyDiscountTitleParams,
+    EarlyDiscountSubtitleParams,
     RemoveMemberPromptParams,
     StatementTitleParams,
     RenamedWorkspaceNameActionParams,

src/libs/API/parameters/AddPaymentCardParams.ts

@@ -10,5 +10,6 @@ type AddPaymentCardParams = {
     addressZip: string;
     currency: ValueOf<typeof CONST.PAYMENT_CARD_CURRENCY>;
     isP2PDebitCard: boolean;
+    shouldClaimEarlyDiscountOffer?: boolean;
 };
 export default AddPaymentCardParams;

src/libs/ReportUtils.ts

@@ -702,6 +702,12 @@ let isAnonymousUser = false;
 // Example case: when we need to get a report name of a thread which is dependent on a report action message.
 const parsedReportActionMessageCache: Record<string, string> = {};
 
+let conciergeChatReportID: string | undefined;
+Onyx.connect({
+    key: ONYXKEYS.CONCIERGE_REPORT_ID,
+    callback: (value) => (conciergeChatReportID = value),
+});
+
 const defaultAvatarBuildingIconTestID = 'SvgDefaultAvatarBuilding Icon';
 Onyx.connect({
     key: ONYXKEYS.SESSION,
@@ -1456,7 +1462,7 @@ function isConciergeChatReport(report: OnyxInputOrEntry<Report>): boolean {
         return false;
     }
 
-    return participantAccountIDs.has(CONCIERGE_ACCOUNT_ID_STRING);
+    return participantAccountIDs.has(CONCIERGE_ACCOUNT_ID_STRING) || report?.reportID === conciergeChatReportID;
 }
 
 function findSelfDMReportID(): string | undefined {

src/libs/SubscriptionUtils.ts

@@ -1,11 +1,13 @@
 import {differenceInSeconds, fromUnixTime, isAfter, isBefore} from 'date-fns';
+import {fromZonedTime} from 'date-fns-tz';
 import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
 import Onyx from 'react-native-onyx';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {BillingGraceEndPeriod, BillingStatus, Fund, FundList, Policy, StripeCustomerID} from '@src/types/onyx';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import {translateLocal} from './Localize';
-import * as PolicyUtils from './PolicyUtils';
+import {getOwnedPaidPolicies, isPolicyOwner} from './PolicyUtils';
 
 const PAYMENT_STATUS = {
     POLICY_OWNER_WITH_AMOUNT_OWED: 'policy_owner_with_amount_owed',
@@ -22,11 +24,19 @@ const PAYMENT_STATUS = {
     GENERIC_API_ERROR: 'generic_api_error',
 } as const;
 
+type DiscountInfo = {
+    days: number;
+    hours: number;
+    minutes: number;
+    seconds: number;
+    discountType: number;
+};
+
 let currentUserAccountID = -1;
 Onyx.connect({
     key: ONYXKEYS.SESSION,
     callback: (value) => {
-        currentUserAccountID = value?.accountID ?? -1;
+        currentUserAccountID = value?.accountID ?? CONST.DEFAULT_NUMBER_ID;
     },
 });
 
@@ -234,6 +244,53 @@ function hasCardExpiringSoon(): boolean {
     return isExpiringThisMonth || isExpiringNextMonth;
 }
 
+function shouldShowDiscountBanner(): boolean {
+    if (!isUserOnFreeTrial()) {
+        return false;
+    }
+
+    if (doesUserHavePaymentCardAdded()) {
+        return false;
+    }
+
+    const dateNow = Math.floor(Date.now() / 1000);
+    const firstDayTimestamp = fromZonedTime(`${firstDayFreeTrial}`, 'UTC').getTime() / 1000;
+    const lastDayTimestamp = fromZonedTime(`${lastDayFreeTrial}`, 'UTC').getTime() / 1000;
+    if (dateNow > lastDayTimestamp) {
+        return false;
+    }
+
+    return dateNow <= firstDayTimestamp + CONST.TRIAL_DURATION_DAYS * CONST.DATE.SECONDS_PER_DAY;
+}
+
+function getEarlyDiscountInfo(): DiscountInfo | null {
+    if (!firstDayFreeTrial) {
+        return null;
+    }
+    const dateNow = Math.floor(Date.now() / 1000);
+    const firstDayTimestamp = fromZonedTime(`${firstDayFreeTrial}`, 'UTC').getTime() / 1000;
+
+    let timeLeftInSeconds;
+    const timeLeft24 = CONST.DATE.SECONDS_PER_DAY - (dateNow - firstDayTimestamp);
+    if (timeLeft24 > 0) {
+        timeLeftInSeconds = timeLeft24;
+    } else {
+        timeLeftInSeconds = firstDayTimestamp + CONST.TRIAL_DURATION_DAYS * CONST.DATE.SECONDS_PER_DAY - dateNow;
+    }
+
+    if (timeLeftInSeconds <= 0) {
+        return null;
+    }
+
+    return {
+        days: Math.floor(timeLeftInSeconds / CONST.DATE.SECONDS_PER_DAY),
+        hours: Math.floor((timeLeftInSeconds % CONST.DATE.SECONDS_PER_DAY) / 3600),
+        minutes: Math.floor((timeLeftInSeconds % 3600) / 60),
+        seconds: Math.floor(timeLeftInSeconds % 60),
+        discountType: timeLeft24 > 0 ? 50 : 25,
+    };
+}
+
 /**
  * @returns Whether there is a retry billing error.
  */
@@ -385,7 +442,7 @@ function calculateRemainingFreeTrialDays(): number {
  * @returns The free trial badge text .
  */
 function getFreeTrialText(policies: OnyxCollection<Policy> | null): string | undefined {
-    const ownedPaidPolicies = PolicyUtils.getOwnedPaidPolicies(policies, currentUserAccountID);
+    const ownedPaidPolicies = getOwnedPaidPolicies(policies, currentUserAccountID);
     if (isEmptyObject(ownedPaidPolicies)) {
         return undefined;
     }
@@ -456,7 +513,7 @@ function shouldRestrictUserBillableActions(policyID: string): boolean {
             // Extracts the owner account ID from the collection member key.
             const ownerAccountID = Number(entryKey.slice(ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_USER_BILLING_GRACE_PERIOD_END.length));
 
-            if (PolicyUtils.isPolicyOwner(policy, ownerAccountID)) {
+            if (isPolicyOwner(policy, ownerAccountID)) {
                 return true;
             }
         }
@@ -465,7 +522,7 @@ function shouldRestrictUserBillableActions(policyID: string): boolean {
     // If it reached here it means that the user is actually the workspace's owner.
     // We should restrict the workspace's owner actions if it's past its grace period end date and it's owing some amount.
     if (
-        PolicyUtils.isPolicyOwner(policy, currentUserAccountID) &&
+        isPolicyOwner(policy, currentUserAccountID) &&
         ownerBillingGraceEndPeriod &&
         amountOwed !== undefined &&
         amountOwed > 0 &&
@@ -494,4 +551,6 @@ export {
     PAYMENT_STATUS,
     shouldRestrictUserBillableActions,
     shouldShowPreTrialBillingBanner,
+    shouldShowDiscountBanner,
+    getEarlyDiscountInfo,
 };

src/libs/actions/PaymentMethods.ts

@@ -235,6 +235,7 @@ function addSubscriptionPaymentCard(
         addressZip,
         currency,
         isP2PDebitCard: false,
+        shouldClaimEarlyDiscountOffer: true,
     };
 
     const optimisticData: OnyxUpdate[] = [