Dynamically generate amount required to spend for credits to be given…

… based on currency (#812)
woocommerce · Sep 5, 2023 · 7c61566 · 7c61566
2 parents f49ed33 + 5c47fa8
commit 7c61566
Show file tree

Hide file tree

Showing 7 changed files with 202 additions and 45 deletions.
diff --git a/assets/source/catalog-sync/components/OnboardingModals/OnboardingAdsModal.js b/assets/source/catalog-sync/components/OnboardingModals/OnboardingAdsModal.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { createInterpolateElement } from '@wordpress/element';
 import { Icon, external as externalIcon } from '@wordpress/icons';
 import {
@@ -18,13 +18,21 @@ import { useSettingsSelect } from '../../../setup-guide/app/helpers/effects';
 import { useBillingSetupFlowEntered } from '../../helpers/effects';
 
 const OnboardingModalText = ( { isBillingSetup } ) => {
+	const appSettings = useSettingsSelect();
+	const currencyCreditInfo = appSettings?.account_data?.currency_credit_info;
+
 	if ( ! isBillingSetup ) {
 		return (
 			<Text variant="body">
 				{ createInterpolateElement(
-					__(
-						'You are eligible for $125 of Pinterest ad credits. To claim the credits, <strong>you would need to add your billing details and spend $15 on Pinterest ads.</strong>',
-						'pinterest-for-woocommerce'
+					sprintf(
+						// translators: %1$s: Amount of ad credit given with currency. %2$s: Amount of money required to spend to claim ad credits with currency.
+						__(
+							'You are eligible for %1$s of Pinterest ad credits. To claim the credits, <strong>you would need to add your billing details and spend %2$s on Pinterest ads.</strong>',
+							'pinterest-for-woocommerce'
+						),
+						currencyCreditInfo.creditsGiven,
+						currencyCreditInfo.spendRequire
 					),
 					{
 						strong: <strong />,
@@ -36,14 +44,22 @@ const OnboardingModalText = ( { isBillingSetup } ) => {
 
 	return (
 		<Text variant="body">
-			{ __(
-				'You are eligible for $125 of Pinterest ad credits. To claim the credits, head over to the Pinterest ads manager and ',
-				'pinterest-for-woocommerce'
+			{ sprintf(
+				// translators: %s: Amount of ad credit given with currency.
+				__(
+					'You are eligible for %s of Pinterest ad credits. To claim the credits, head over to the Pinterest ads manager and ',
+					'pinterest-for-woocommerce'
+				),
+				currencyCreditInfo.creditsGiven
 			) }
 			<strong>
-				{ __(
-					'spend $15 on Pinterest ads.',
-					'pinterest-for-woocommerce'
+				{ sprintf(
+					// translators: %s: Amount of money required to spend to claim ad credits with currency.
+					__(
+						'spend %s on Pinterest ads.',
+						'pinterest-for-woocommerce'
+					),
+					currencyCreditInfo.spendRequire
 				) }
 			</strong>
 		</Text>
@@ -61,6 +77,7 @@ const OnboardingModalText = ( { isBillingSetup } ) => {
 const OnboardingAdsModal = ( { onCloseModal } ) => {
 	const appSettings = useSettingsSelect();
 	const isBillingSetup = appSettings?.account_data?.is_billing_setup;
+	const currencyCreditInfo = appSettings?.account_data?.currency_credit_info;
 	const billingSetupFlowEntered = useBillingSetupFlowEntered();
 
 	const onClickBilling = () => {
@@ -83,9 +100,13 @@ const OnboardingAdsModal = ( { onCloseModal } ) => {
 			className="pinterest-for-woocommerce-catalog-sync__onboarding-modal"
 		>
 			<Text variant="title.small">
-				{ __(
-					'You are one step away from claiming $125 of Pinterest ad credits.',
-					'pinterest-for-woocommerce'
+				{ sprintf(
+					// translators: %s: Amount of ad credit given with currency.
+					__(
+						'You are one step away from claiming %s of Pinterest ad credits.',
+						'pinterest-for-woocommerce'
+					),
+					currencyCreditInfo.creditsGiven
 				) }
 			</Text>
 			<Text variant="body">

diff --git a/assets/source/catalog-sync/sections/AdCreditsNotice.js b/assets/source/catalog-sync/sections/AdCreditsNotice.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { recordEvent } from '@woocommerce/tracks';
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import {
 	createInterpolateElement,
 	useCallback,
@@ -49,6 +49,7 @@ const AdCreditsNotice = () => {
 	const appSettings = useSettingsSelect();
 	const isBillingSetup = appSettings?.account_data?.is_billing_setup;
 	const trackingAdvertiser = appSettings?.tracking_advertiser;
+	const currencyCreditInfo = appSettings?.account_data?.currency_credit_info;
 
 	const closeAdCreditsNotice = () => {
 		setIsNoticeDisplayed( false );
@@ -79,16 +80,27 @@ const AdCreditsNotice = () => {
 				/>
 				{ isBillingSetup ? (
 					<Text>
-						{ __(
-							'Spend $15 to claim $125 Pinterest ad credits. (Ad credits may take up to 24 hours to be credited to account).'
+						{ sprintf(
+							// translators: %1$s: Amount of money required to spend to claim ad credits with currency. %2$s: Amount of ad credits given with currency.
+							__(
+								'Spend %1$s to claim %2$s in Pinterest ad credits. (Ad credits may take up to 24 hours to be credited to account).',
+								'pinterest-for-woocommerce'
+							),
+							currencyCreditInfo.spendRequire,
+							currencyCreditInfo.creditsGiven
 						) }
 					</Text>
 				) : (
 					<Text>
 						{ createInterpolateElement(
-							__(
-								'Spend $15 to get $125 in Pinterest ad credits. To claim the credits, <adsBillingDetails>add your billing details.</adsBillingDetails>',
-								'pinterest-for-woocommerce'
+							sprintf(
+								// translators: %1$s: Amount of money required to spend to claim ad credits with currency. %2$s: Amount of ad credits given with currency.
+								__(
+									'Spend %1$s to claim %2$s in Pinterest ad credits. To claim the credits, <adsBillingDetails>add your billing details.</adsBillingDetails>',
+									'pinterest-for-woocommerce'
+								),
+								currencyCreditInfo.spendRequire,
+								currencyCreditInfo.creditsGiven
 							),
 							{
 								adsBillingDetails: trackingAdvertiser ? (

diff --git a/assets/source/setup-guide/app/components/TermsAndConditionsModal.js b/assets/source/setup-guide/app/components/TermsAndConditionsModal.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { createInterpolateElement } from '@wordpress/element';
 import {
 	Modal,
@@ -11,6 +11,7 @@ import {
 /**
  * Internal dependencies
  */
+import { useSettingsSelect } from '../helpers/effects';
 import documentationLinkProps from '../helpers/documentation-link-props';
 
 const tosHref = 'https://business.pinterest.com/business-terms-of-service/';
@@ -30,6 +31,9 @@ const advertisingServicesAgreementHref =
  * @return {JSX.Element} Rendered element.
  */
 const AdsCreditsTermsAndConditionsModal = ( { onModalClose } ) => {
+	const appSettings = useSettingsSelect();
+	const currencyCreditInfo = appSettings?.account_data?.currency_credit_info;
+
 	return (
 		<Modal
 			title={
@@ -44,9 +48,14 @@ const AdsCreditsTermsAndConditionsModal = ( { onModalClose } ) => {
 			className="pinterest-for-woocommerce-landing-page__credits-section__tac-modal"
 		>
 			<Text>
-				{ __(
-					'To be eligible and redeem the $125 ad credit from Pinterest, you must complete the setup of Pinterest for WooCommerce, set up your billing with Pinterest Ads manager, and spend $15 with Pinterest ads. Credits may take up to 24 hours to be credited to the user.',
-					'pinterest-for-woocommerce'
+				{ sprintf(
+					// translators: %1$s: Amount of ad credit given with currency. %2$s: Amount of money required to spend to claim ad credits with currency.
+					__(
+						'To be eligible and redeem the %1$s ad credit from Pinterest, you must complete the setup of Pinterest for WooCommerce, set up your billing with Pinterest Ads manager, and spend %2$s with Pinterest ads. Credits may take up to 24 hours to be credited to the user.',
+						'pinterest-for-woocommerce'
+					),
+					currencyCreditInfo.creditsGiven,
+					currencyCreditInfo.spendRequire
 				) }
 			</Text>
 			<Text>

diff --git a/assets/source/setup-guide/app/steps/components/AdsCreditsPromo.js b/assets/source/setup-guide/app/steps/components/AdsCreditsPromo.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { useState, createInterpolateElement } from '@wordpress/element';
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { recordEvent } from '@woocommerce/tracks';
 import {
 	CardDivider,
@@ -42,6 +42,8 @@ const AdsCreditsPromo = () => {
 		} );
 	};
 
+	const currencyCreditInfo = appSettings?.account_data?.currency_credit_info;
+
 	return appSettings?.ads_campaign_is_active ? (
 		<>
 			<CardDivider
@@ -54,9 +56,14 @@ const AdsCreditsPromo = () => {
 				<FlexBlock className="content-block">
 					<Text variant="body">
 						{ createInterpolateElement(
-							__(
-								'As a new Pinterest customer, you can get $125 in free ad credits when you successfully set up Pinterest for WooCommerce and spend $15 on Pinterest Ads. <a>Pinterest Terms and conditions</a> apply.',
-								'pinterest-for-woocommerce'
+							sprintf(
+								//  translators: %1$s: Amount of ad credits given with currency. %2$s: Amount of money required to spend to claim ad credits with currency.
+								__(
+									'As a new Pinterest customer, you can get %1$s in free ad credits when you successfully set up Pinterest for WooCommerce and spend %2$s on Pinterest Ads. <a>Pinterest Terms and conditions</a> apply.',
+									'pinterest-for-woocommerce'
+								),
+								currencyCreditInfo.creditsGiven,
+								currencyCreditInfo.spendRequire
 							),
 							{
 								a: (

diff --git a/assets/source/setup-guide/app/views/LandingPageApp.js b/assets/source/setup-guide/app/views/LandingPageApp.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { getNewPath, getHistory } from '@woocommerce/navigation';
 import {
 	createInterpolateElement,
@@ -159,6 +159,9 @@ const AdsCreditSection = () => {
 		} );
 	};
 
+	const appSettings = useSettingsSelect();
+	const currencyCreditInfo = appSettings?.account_data?.currency_credit_info;
+
 	return (
 		<Card className="woocommerce-table pinterest-for-woocommerce-landing-page__credits-section">
 			<Flex>
@@ -173,16 +176,25 @@ const AdsCreditSection = () => {
 				</FlexBlock>
 				<FlexBlock className="content-block">
 					<Text variant="subtitle">
-						{ __(
-							'Try Pinterest for WooCommerce and get $125 in ad credits!',
-							'pinterest-for-woocommerce'
+						{ sprintf(
+							// translators: %s: Amount of ad credits given with currency.
+							__(
+								'Try Pinterest for WooCommerce and get %s in ad credits!',
+								'pinterest-for-woocommerce'
+							),
+							currencyCreditInfo.creditsGiven
 						) }
 					</Text>
 					<Text variant="body">
 						{ createInterpolateElement(
-							__(
-								'To help you get started with Pinterest Ads, new Pinterest customers can get $125 in ad credits when they have successfully set up Pinterest for WooCommerce and spend $15 on Pinterest Ads. <a>Pinterest Terms and conditions</a> apply.',
-								'pinterest-for-woocommerce'
+							sprintf(
+								// translators: %1$s: Amount of ad credits given with currency. %2$s: Amount of money required to spend to claim ad credits with currency.
+								__(
+									'To help you get started with Pinterest Ads, new Pinterest customers can get %1$s in ad credits when they have successfully set up Pinterest for WooCommerce and spend %2$s on Pinterest Ads. <a>Pinterest Terms and conditions</a> apply.',
+									'pinterest-for-woocommerce'
+								),
+								currencyCreditInfo.creditsGiven,
+								currencyCreditInfo.spendRequire
 							),
 							{
 								a: (
@@ -269,6 +281,9 @@ const Feature = ( { title, text, imageUrl } ) => {
 };
 
 const FaqSection = () => {
+	const appSettings = useSettingsSelect();
+	const currencyCreditInfo = appSettings?.account_data?.currency_credit_info;
+
 	return (
 		<Card className="woocommerce-table pinterest-for-woocommerce-landing-page__faq-section">
 			<Panel
@@ -299,17 +314,28 @@ const FaqSection = () => {
 						'pinterest-for-woocommerce'
 					) }
 				/>
-				<FaqQuestion
-					questionId={ 'can-i-connect-to-multiple-accounts' }
-					question={ __(
-						'How do I redeem the $125 ad credit from Pinterest?',
-						'pinterest-for-woocommerce'
-					) }
-					answer={ __(
-						'To be eligible and redeem the $125 ad credit from Pinterest, you must complete the setup of Pinterest for WooCommerce, set up your billing with Pinterest Ads manager, and spend $15 with Pinterest ads. Ad credits may vary by country and is subject to availability. Credits may take up to 24 hours to be credited to the user. Each user is only eligible to receive the ad credits once.',
-						'pinterest-for-woocommerce'
-					) }
-				/>
+				{ currencyCreditInfo && (
+					<FaqQuestion
+						questionId={ 'how-to-redeem-ad-credits' }
+						question={ sprintf(
+							// translators: %s: Amount of ad credits given with currency.
+							__(
+								'How do I redeem the %s ad credit from Pinterest?',
+								'pinterest-for-woocommerce'
+							),
+							currencyCreditInfo.creditsGiven
+						) }
+						answer={ sprintf(
+							// translators: %1$s: Amount of ad credits given with currency. %2$s: Amount of money required to spend to claim ad credits with currency.
+							__(
+								'To be eligible and redeem the %1$s ad credit from Pinterest, you must complete the setup of Pinterest for WooCommerce, set up your billing with Pinterest Ads manager, and spend %2$s with Pinterest ads. Ad credits may vary by country and is subject to availability. Credits may take up to 24 hours to be credited to the user. Each user is only eligible to receive the ad credits once.',
+								'pinterest-for-woocommerce'
+							),
+							currencyCreditInfo.creditsGiven,
+							currencyCreditInfo.spendRequire
+						) }
+					/>
+				) }
 			</Panel>
 		</Card>
 	);

diff --git a/class-pinterest-for-woocommerce.php b/class-pinterest-for-woocommerce.php
@@ -9,6 +9,7 @@
 use Automattic\WooCommerce\Pinterest as Pinterest;
 use Automattic\WooCommerce\Pinterest\AdCredits;
 use Automattic\WooCommerce\Pinterest\AdCreditsCoupons;
+use Automattic\WooCommerce\Pinterest\AdsCreditCurrency;
 use Automattic\WooCommerce\Pinterest\Billing;
 use Automattic\WooCommerce\Pinterest\Heartbeat;
 use Automattic\WooCommerce\Pinterest\Notes\MarketingNotifications;
@@ -279,6 +280,9 @@ public function init_plugin() {
 			// Verify that the ads_campaign is active or not.
 			add_action( 'admin_init', array( Pinterest\AdCredits::class, 'check_if_ads_campaign_is_active' ) );
 
+			// Append credits info to account data.
+			add_action( 'init', array( $this, 'add_currency_credits_info_to_account_data' ) );
+
 			add_action( 'pinterest_for_woocommerce_token_saved', array( $this, 'set_default_settings' ) );
 			add_action( 'pinterest_for_woocommerce_token_saved', array( $this, 'update_account_data' ) );
 
@@ -1020,6 +1024,20 @@ public static function add_redeem_credits_info_to_account_data() {
 			self::save_setting( 'account_data', $account_data );
 		}
 
+		/**
+		 * Add currency_credit_info information to the account data option.
+		 *
+		 * @since x.x.x
+		 *
+		 * @return void
+		 */
+		public static function add_currency_credits_info_to_account_data() {
+			$account_data                         = self::get_setting( 'account_data' );
+			$currency_credit_info                 = AdsCreditCurrency::get_currency_credits();
+			$account_data['currency_credit_info'] = $currency_credit_info;
+			self::save_setting( 'account_data', $account_data );
+		}
+
 		/**
 		 * Add available credits information to the account data option.
 		 *