Merge pull request #2884 from FromDoppler/update-summary-page

fix(checkout-summary): unificar textos y labels del resumen de compra

Author: jhoffman-ms

src/components/Plans/Checkout/CheckoutSummary/AddOnPlanInformation/index.js

@@ -1,5 +1,4 @@
 import { useIntl } from 'react-intl';
-import { thousandSeparatorNumber } from '../../../../../utils';
 import { AddOnType } from '../../../../../doppler-types';
 
 export const AddOnPlanInformation = ({ addOnType, quantity, discount }) => {
@@ -46,7 +45,7 @@ export const AddOnPlanInformation = ({ addOnType, quantity, discount }) => {
               }`,
             )}
           </span>
-          <h3>{thousandSeparatorNumber(intl.defaultLocale, quantity)}</h3>
+          <h3>{quantity}</h3>
         </li>
         <li>
           {discount ? (

src/components/Plans/Checkout/CheckoutSummary/CheckoutSummary.js

@@ -17,7 +17,6 @@ import { exception } from 'react-ga';
 import { UnexpectedError } from '../../PlanCalculator/UnexpectedError';
 import { ACCOUNT_TYPE, thousandSeparatorNumber } from '../../../../utils';
 import { TransferInformation } from './TransferInformation/index';
-import { CheckoutSummaryButton } from './CheckoutSummaryButton';
 import { CheckoutSummaryTitle } from './CheckoutSummaryTitle/index';
 import { MercadoPagoInformation } from './MercadoPagoInformation';
 import {
@@ -222,7 +221,7 @@ const PlanMarketingInformation = ({
 
   return (
     <>
-      <h4 className="dp-tit-plan-purchased">Tu plan de email marketing</h4>
+      <h4 className="dp-tit-plan-purchased">{_(`checkoutProcessSuccess.plan_type_title`)}</h4>
       <ul className="dp-purchase-summary-list">
         <li>
           <span>{_(`checkoutProcessSuccess.plan_type`)}</span>
@@ -238,12 +237,6 @@ const PlanMarketingInformation = ({
             <h3>{thousandSeparatorNumber(intl.defaultLocale, extraCredits)}</h3>
           </li>
         ) : null}
-        <li>
-          <span>
-            {_(`checkoutProcessSuccess.plan_type_${planType.replace('-', '_')}_availables`)}
-          </span>
-          <h3>{thousandSeparatorNumber(intl.defaultLocale, remainingCredits)}</h3>
-        </li>
         <li>
           {planType === PLAN_TYPE.byContact && discount ? (
             <>
@@ -507,7 +500,6 @@ export const CheckoutSummary = InjectAppServices(
         hasError,
         chatUserPlan,
         addOnUserPlan,
-        addOnPromotions,
       },
       dispatch,
     ] = useReducer(checkoutSummaryReducer, INITIAL_STATE_CHECKOUT_SUMMARY);
@@ -628,7 +620,6 @@ export const CheckoutSummary = InjectAppServices(
     }
 
     const title = getTitle(paymentMethod, upgradePending);
-    const isBuyMarketingPlan = buyType && Number(buyType) !== BUY_LANDING_PACK;
     const landingsEditorEnabled = appSessionRef?.current?.userData?.features?.landingsEditorEnabled;
 
     const canBuyOnSitePlan = process.env.REACT_APP_DOPPLER_CAN_BUY_ONSITE_PLAN === 'true';
@@ -665,22 +656,52 @@ export const CheckoutSummary = InjectAppServices(
               ) : buyType && Number(buyType) === BUY_CHAT_PLAN ? (
                 chatUserPlan !== null && (
                   <AddOnPlanInformation
-                    quantity={addOnUserPlan.quantity}
+                    quantity={
+                      <FormattedMessage
+                        id={'checkoutProcessSuccess.chat_plan_quantity_title'}
+                        values={{
+                          quantity: thousandSeparatorNumber(
+                            intl.defaultLocale,
+                            addOnUserPlan.quantity,
+                          ),
+                        }}
+                      />
+                    }
                     discount={discount}
                     addOnType={AddOnType.Conversations}
                   />
                 )
               ) : buyType && Number(buyType) === BUY_ONSITE_PLAN && addOnUserPlan !== null ? (
                 <AddOnPlanInformation
-                  quantity={addOnUserPlan.quantity}
+                  quantity={
+                    <FormattedMessage
+                      id={'checkoutProcessSuccess.onsite_plan_quantity_title'}
+                      values={{
+                        quantity: thousandSeparatorNumber(
+                          intl.defaultLocale,
+                          addOnUserPlan.quantity,
+                        ),
+                      }}
+                    />
+                  }
                   discount={discount}
                   addOnType={AddOnType.OnSite}
                 />
               ) : buyType &&
                 Number(buyType) === BUY_PUSH_NOTIFICATION_PLAN &&
                 addOnUserPlan !== null ? (
                 <AddOnPlanInformation
-                  quantity={addOnUserPlan.quantity}
+                  quantity={
+                    <FormattedMessage
+                      id={'checkoutProcessSuccess.push_notification_plan_quantity_title'}
+                      values={{
+                        quantity: thousandSeparatorNumber(
+                          intl.defaultLocale,
+                          addOnUserPlan.quantity,
+                        ),
+                      }}
+                    />
+                  }
                   discount={discount}
                   addOnType={AddOnType.PushNotifications}
                 />
@@ -696,12 +717,12 @@ export const CheckoutSummary = InjectAppServices(
                 <MercadoPagoInformation upgradePending={upgradePending} />
               ) : null}
 
-              {isBuyMarketingPlan && (
+              {/* {isBuyMarketingPlan && (
                 <CheckoutSummaryButton
                   paymentMethod={paymentMethod}
                   upgradePending={upgradePending}
                 />
-              )}
+              )} */}
             </div>
             {landingsEditorEnabled && (
               <div className="col-sm-4 m-b-24">
@@ -719,7 +740,6 @@ export const CheckoutSummary = InjectAppServices(
               </div>
             )}
           </div>
-          {<ModalPromoAddons addOnPromotions={addOnPromotions} />}
         </section>
       </>
     );

src/i18n/en.js

@@ -600,22 +600,23 @@ other {}}}}}}}}}}
     title: `Payment process`,
   },
   checkoutProcessSuccess: {
-    chat_plan_acquired_conversations: 'Acquired messages',
+    chat_plan_acquired_conversations: 'Quantity',
     chat_plan_billing_title: 'Billing',
     chat_plan_default_billing: 'Monthly',
     chat_plan_label: 'Conversations',
-    chat_plan_title: 'Your conversations plan',
+    chat_plan_quantity_title: '{quantity} messages',
+    chat_plan_title: 'Summary of your purchase',
     chat_plan_type_label: 'Plan Type',
-    discount_half_yearly: '6 months',
-    discount_monthly: '1 month',
-    discount_quarterly: '3 months',
-    discount_yearly: '12 months',
+    discount_half_yearly: 'Biannual',
+    discount_monthly: 'Monthly',
+    discount_quarterly: 'Quarterly',
+    discount_yearly: 'Annual',
     enjoy_doppler_title: 'Enjoy Doppler',
     enjoying_benefits_doppler_title: 'You can now start enjoying the benefits of your Doppler plans.',
     go_to_home_link: 'GO TO HOME',
-    landing_billing_title: 'Renovation',
-    landing_packages_title: 'Packages',
-    landing_your_landings_pages_plan_title: 'Your Landings Pages plan',
+    landing_billing_title: 'Billing',
+    landing_packages_title: 'Quantity',
+    landing_your_landings_pages_plan_title: 'Summary of your purchase',
     mercado_pago_check_email_with_invoice_message: `
 Within the first 48 business hours, you will receive an email with the payment confirmation then you will be able to start enjoying your new plan.
 Payment details will be included in the invoice sent to the recipient you have indicated.`,
@@ -625,35 +626,38 @@ Payment details will be included in the invoice sent to the recipient you have i
     mercado_pago_purchase_finished_title: 'Your payment is being processed',
     mercado_pago_steps_title: 'Be sure to read the following information:',
     mercado_pago_warning_message: 'We are processing your payment through Mercado Pago, this may take up to 48 business hours.',
-    onsite_plan_acquired_prints: 'Impressions acquired',
+    onsite_plan_acquired_prints: 'Quantity',
     onsite_plan_billing_title: 'Billing',
     onsite_plan_default_billing: 'Monthly',
     onsite_plan_label: 'OnSite',
-    onsite_plan_title: 'Your OnSite Plan',
+    onsite_plan_quantity_title: '{quantity} impressions',
+    onsite_plan_title: 'Summary of your purchase',
     onsite_plan_type_label: 'Type of plan',
-    plan_type: 'Plan Type',
-    plan_type_monthly_deliveries: 'Emails by Plan',
+    plan_type: 'Details',
+    plan_type_monthly_deliveries: 'Amount of Emails',
     plan_type_monthly_deliveries_availables: 'Available Emails',
-    plan_type_monthly_deliveries_label: 'By Emails',
+    plan_type_monthly_deliveries_label: 'Emails Plan',
     plan_type_monthly_deliveries_monthly_renovation: 'Monthly',
-    plan_type_prepaid: 'Credits by Plan',
+    plan_type_prepaid: 'Amount of Credits',
     plan_type_prepaid_availables: 'Available Credits',
-    plan_type_prepaid_label: 'By Credits',
+    plan_type_prepaid_label: 'Credit Purchase',
     plan_type_prepaid_no_expiration: 'No expiration',
     plan_type_prepaid_promocode: 'Gift Credits',
-    plan_type_subscribers: 'Contacts by Plan',
+    plan_type_subscribers: 'Amount of Contacts',
     plan_type_subscribers_availables: 'Available Contacts',
-    plan_type_subscribers_label: 'By Contacts',
+    plan_type_subscribers_label: 'Contacts Plan',
+    plan_type_title: 'Summary of your purchase',
     purchase_finished_title: 'Purchase Finished',
-    push_notification_plan_acquired_emails: 'Purchased shipments',
+    push_notification_plan_acquired_emails: 'Quantity',
     push_notification_plan_billing_title: 'Billing',
     push_notification_plan_default_billing: 'Monthly',
     push_notification_plan_label: 'Push Notifications',
-    push_notification_plan_title: 'Your Push Notifications Plan',
+    push_notification_plan_quantity_title: '{quantity} shipments',
+    push_notification_plan_title: 'Summary of your purchase',
     push_notification_plan_type_label: 'Plan Type',
-    renewal_type_title: 'Renovation',
+    renewal_type_title: 'Billing',
     start_using_new_plan_button: 'Start using your new Plan',
-    title: `Excellent! You’ve updated your Plan`,
+    title: `Your purchase has been successful!`,
     transfer_check_email_with_invoice_message: 'Check your email, and during the next 24 business hours you’ll receive your invoice with all the information to make the payment.',
     transfer_confirmation_message: 'Once we confirm the payment reception, we’ll tell you by email. You will be able to use your new Plan!',
     transfer_explore_button: 'Explore',

src/i18n/es.js

@@ -602,58 +602,62 @@ other {}}}}}}}}}}
     title: `Proceso de pago`,
   },
   checkoutProcessSuccess: {
-    chat_plan_acquired_conversations: 'Mensajes adquiridas',
-    chat_plan_billing_title: 'Renovación',
+    chat_plan_acquired_conversations: 'Cantidad',
+    chat_plan_billing_title: 'Facturación',
     chat_plan_default_billing: 'Mensual',
     chat_plan_label: 'Conversaciones',
-    chat_plan_title: 'Tu plan de conversaciones',
+    chat_plan_quantity_title: '{quantity} mensajes',
+    chat_plan_title: 'Resumen de tu compra',
     chat_plan_type_label: 'Tipo de Plan',
-    discount_half_yearly: '6 meses',
-    discount_monthly: '1 mes',
-    discount_quarterly: '3 meses',
-    discount_yearly: '12 meses',
+    discount_half_yearly: 'Semestral',
+    discount_monthly: 'Mensual',
+    discount_quarterly: 'Trimestral',
+    discount_yearly: 'Anual',
     enjoy_doppler_title: 'Disfruta Doppler',
     enjoying_benefits_doppler_title: 'Ya puedes empezar a disfrutar de los beneficios de tus planes de Doppler.',
     go_to_home_link: 'IR AL INICIO',
     landing_billing_title: 'Facturación',
-    landing_packages_title: 'Paquetes',
-    landing_your_landings_pages_plan_title: 'Tu plan de Landings Pages',
+    landing_packages_title: 'Cantidad',
+    landing_your_landings_pages_plan_title: 'Resumen de tu compra',
     mercado_pago_check_email_with_invoice_message: 'Dentro de las próximas 48 horas hábiles recibirás un mail con la confirmación de pago y podrás empezar a disfrutar de tu nuevo plan.',
     mercado_pago_contact_support: 'Si tienes dudas respecto al estado del pago puedes escribirnos a <Bold>billing@fromdoppler.com</Bold>',
     mercado_pago_error_in_pay: 'En caso de que el cobro sea rechazado te contactaremos para ayudarte a elegir otro medio de pago.',
     mercado_pago_pay_the_invoice_message: 'La factura con el detalle de pago será enviada al destinatario que hayas indicado.',
     mercado_pago_purchase_finished_title: 'Tu pago está siendo procesado',
     mercado_pago_steps_title: 'No dejes de leer la siguiente información:',
     mercado_pago_warning_message: 'Estamos procesando tu pago a través de Mercado Pago, esto puede demorar hasta 48 horas hábiles.',
-    onsite_plan_acquired_prints: 'Impresiones adquiridas',
-    onsite_plan_billing_title: 'Renovación',
+    onsite_plan_acquired_prints: 'Cantidad',
+    onsite_plan_billing_title: 'Facturación',
     onsite_plan_default_billing: 'Mensual',
     onsite_plan_label: 'OnSite',
-    onsite_plan_title: 'Tu plan de on-site',
+    onsite_plan_quantity_title: '{quantity} impresiones',
+    onsite_plan_title: 'Resumen de tu compra',
     onsite_plan_type_label: 'Tipo de Plan',
-    plan_type: 'Tipo de Plan',
-    plan_type_monthly_deliveries: 'Envíos por Plan',
+    plan_type: 'Detalle',
+    plan_type_monthly_deliveries: 'Cantidad de Envíos',
     plan_type_monthly_deliveries_availables: 'Envíos Disponibles',
-    plan_type_monthly_deliveries_label: 'Por Envíos',
+    plan_type_monthly_deliveries_label: 'Plan Envíos',
     plan_type_monthly_deliveries_monthly_renovation: 'Mensual',
-    plan_type_prepaid: 'Créditos por Plan',
+    plan_type_prepaid: 'Cantidad de Créditos',
     plan_type_prepaid_availables: 'Créditos Disponibles',
     plan_type_prepaid_label: 'Por Créditos',
     plan_type_prepaid_no_expiration: 'Sin vencimiento',
     plan_type_prepaid_promocode: 'Créditos de regalo',
-    plan_type_subscribers: 'Contactos por Plan',
+    plan_type_subscribers: 'Cantidad de Contactos',
     plan_type_subscribers_availables: 'Contactos disponibles',
-    plan_type_subscribers_label: 'Por Contactos',
+    plan_type_subscribers_label: 'Plan Contactos',
+    plan_type_title: 'Resumen de tu compra',
     purchase_finished_title: 'Compra Finalizada',
-    push_notification_plan_acquired_emails: 'Envíos adquiridos',
-    push_notification_plan_billing_title: 'Renovación',
+    push_notification_plan_acquired_emails: 'Cantidad',
+    push_notification_plan_billing_title: 'Facturación',
     push_notification_plan_default_billing: 'Mensual',
     push_notification_plan_label: 'Notificaciones Push',
-    push_notification_plan_title: 'Tu plan de notificaciones push',
+    push_notification_plan_quantity_title: '{quantity} envíos',
+    push_notification_plan_title: 'Resumen de tu compra',
     push_notification_plan_type_label: 'Tipo de Plan',
-    renewal_type_title: 'Renovación',
+    renewal_type_title: 'Facturación',
     start_using_new_plan_button: 'Comienza a usar tu nuevo Plan',
-    title: `¡Excelente! Has actualizado tu Plan`,
+    title: `¡Tu compra ha sido exitosa!`,
     transfer_check_email_with_invoice_message: 'Revisa tu correo, y dentro de las proximas 24 horas hábiles recibirás la factura con todos los datos para realizar el pago.',
     transfer_confirmation_message: 'Una vez que confirmemos la recepción del pago te avisaremos por mail. ¡Ya podrás disfrutar de tu nuevo Plan!',
     transfer_explore_button: 'Explorar',