Consider "incomplete" subscription status as invalid

Author: brunolemos

landing/src/components/sections/subscribe/SubscribeForm.tsx

@@ -1,3 +1,11 @@
+import {
+  constants,
+  formatPriceAndInterval,
+  Plan,
+  UserPlan,
+  isPlanStatusValid,
+} from '@brunolemos/devhub-core'
+import classNames from 'classnames'
 import React, { useEffect, useRef, useState } from 'react'
 import { CardElement, injectStripe } from 'react-stripe-elements'
 
@@ -166,7 +174,10 @@ export const SubscribeForm = injectStripe<SubscribeFormProps>(
 
         mergeAuthData({ plan: data.subscribeToPlan })
 
-        if (data.subscribeToPlan.status === 'incomplete') {
+        if (
+          !isPlanStatusValid(data.subscribeToPlan) ||
+          data.subscribeToPlan.status === 'incomplete'
+        ) {
           throw new Error('Please try a different credit card.')
         }
 

packages/components/src/components/modals/partials/SubscribeForm.web.tsx

@@ -3,6 +3,7 @@ import {
   constants,
   formatPriceAndInterval,
   freePlan,
+  isPlanStatusValid,
   UserPlan,
 } from '@devhub/core'
 import axios from 'axios'
@@ -257,7 +258,10 @@ const SubscribeFormWithStripe = React.memo(
 
         dispatch(actions.updateUserData({ plan: data.subscribeToPlan }))
 
-        if (data.subscribeToPlan.status === 'incomplete') {
+        if (
+          !isPlanStatusValid(data.subscribeToPlan) ||
+          data.subscribeToPlan.status === 'incomplete'
+        ) {
           throw new Error('Please try a different credit card.')
         }
 

packages/core/src/helpers/plans.ts

@@ -84,11 +84,7 @@ export function isPlanStatusValid(
 ): boolean {
   if (!plan) return false
 
-  return !!(
-    plan.status === 'active' ||
-    plan.status === 'trialing' ||
-    plan.status === 'incomplete'
-  )
+  return !!(plan.status === 'active' || plan.status === 'trialing')
 }
 
 export function isPlanExpired(