fix: show free trial messaging correctly for SSP plans (#1731)

* fix: show free trial messaging correctly for SSP plans

* fix: update tests

Author: bcitro

src/components/subscriptions/SubscriptionCard.jsx

@@ -40,7 +40,7 @@ const SubscriptionCard = ({
   const subscriptionStatus = getSubscriptionStatus(subscription);
 
   let subscriptionUpcomingPrice;
-  if (!loadingStripeSummary) {
+  if (!loadingStripeSummary && invoiceAmount) {
     const locale = getLocale();
     subscriptionUpcomingPrice = `${invoiceAmount.toLocaleString(locale, { style: 'currency', currency, maximumFractionDigits: 0 })} ${currency.toUpperCase()}`;
   }
@@ -109,7 +109,11 @@ const SubscriptionCard = ({
                       className="ml-2"
                       target="_blank"
                       rel="noopener noreferrer"
-                      onClick={() => (openStripeBillingPortal(enterpriseUuid))}
+                      destination="#"
+                      onClick={e => {
+                        e.preventDefault();
+                        openStripeBillingPortal(enterpriseUuid);
+                      }}
                     >
                       Manage subscription
                     </Hyperlink>),

src/components/subscriptions/data/constants.js

@@ -59,8 +59,8 @@ export const SUBSCRIPTION_STATUS_BADGE_MAP = {
 };
 
 // Self-service plan types
-export const SELF_SERVICE_TRIAL = 'Self-service Trial';
-export const SELF_SERVICE_PAID = 'Self-service Paid';
+export const SELF_SERVICE_TRIAL = 'self-service-trial';
+export const SELF_SERVICE_PAID = 'self-service-paid';
 
 export const FREE_TRIAL_BADGE = 'Free Trial';
 

src/components/subscriptions/data/hooks.js

@@ -252,7 +252,7 @@ export const useUpcomingInvoiceAmount = ({ subPlanUuid, planType, setErrors }) =
       try {
         const response = await EnterpriseAccessApiService.fetchStripeEvent(subPlanUuid);
         const results = camelCaseObject(response.data);
-        setInvoiceAmount(results.upcomingInvoiceAmountDue);
+        setInvoiceAmount(results.upcomingInvoiceAmountDue / 100);
         setCurrency(results.currency);
       } catch (error) {
         logError(error);

src/components/subscriptions/tests/data/hooks.test.jsx

@@ -136,7 +136,7 @@ describe('useUpcomingInvoiceAmount', () => {
 
     await waitFor(() => {
       expect(EnterpriseAccessApiService.fetchStripeEvent).toHaveBeenCalledTimes(1);
-      expect(result.current.invoiceAmount).toBe(15000);
+      expect(result.current.invoiceAmount).toBe(150);
       expect(result.current.currency).toBe('usd');
       expect(result.current.loadingStripeSummary).toBe(false);
       expect(setErrors).not.toHaveBeenCalled();