FE Hotfix Stripe

frontend/src/components/WorkspaceSettings/Billing/Billing.tsx

@@ -5,6 +5,7 @@ import { getSubscriptionsApiV1BillingSubscriptionGet } from 'api/generated';
 import BillingPaidSkeleton from './BillingPaidView/BillingPaidSkeleton';
 import BillingPaidView from './BillingPaidView/BillingPaidView';
 import FirstBilling from './FirstBilling/FirstBilling';
+
 import { Subscriptions } from './billing.types';
 
 const Billing = () => {
@@ -13,15 +14,15 @@ const Billing = () => {
 
   const getSubscription = async () => {
     const response = (await getSubscriptionsApiV1BillingSubscriptionGet()) as Subscriptions[];
-    setSubscriptions([...response]);
+    response && setSubscriptions([...response]);
     setIsLoading(false);
   };
 
   useEffect(() => {
     getSubscription();
   }, []);
 
-  const isPaid = subscriptions.length > 0;
+  const isPaid = subscriptions.length > 0 && subscriptions[0]?.status === 'active';
 
   if (isLoading) {
     return <BillingPaidSkeleton />;

frontend/src/components/WorkspaceSettings/Billing/BillingHistory/BillingHistory.tsx

@@ -22,7 +22,7 @@ const BillingHistory = () => {
     try {
       const response = await listAllChargesApiV1BillingChargesGet();
 
-      setTransactions([...response]);
+      response && setTransactions([...response]);
       setLoading(false);
     } catch (err) {
       logger.error(err);

frontend/src/components/WorkspaceSettings/Billing/BillingMethods/BillingMethodDialog.tsx

@@ -3,6 +3,7 @@ import { useStripe, useElements, CardElement } from '@stripe/react-stripe-js';
 import { StripeCardElement } from '@stripe/stripe-js';
 
 import { updatePaymentMethodApiV1BillingPaymentMethodPost } from 'api/generated';
+
 import logger from 'helpers/services/logger';
 
 import ActionDialog from 'components/base/Dialog/ActionDialog/ActionDialog';
@@ -41,10 +42,12 @@ const BillingMethodDialog = ({ isDialogOpen, handleCloseDialog }: BillingMethodD
 
     if (paymentMethod.error) {
       setErrorMessage(paymentMethod.error.message as string);
+
       logger.error(paymentMethod.error);
     } else {
       updatePaymentMethodApiV1BillingPaymentMethodPost({ payment_method_id: paymentMethod.paymentMethod.id });
-      handleCloseDialog();
+
+      window.location.reload();
     }
   };
 

frontend/src/components/WorkspaceSettings/Billing/BillingMethods/BillingMethods.tsx

@@ -32,7 +32,7 @@ const BillingMethods = ({ clientSecret }: { clientSecret: string }) => {
   const getPaymentMethods = async () => {
     try {
       const response = await getPaymentMethodApiV1BillingPaymentMethodGet();
-      setPaymentMethods(response as any[]);
+      response && setPaymentMethods(response as any[]);
     } catch (err) {
       logger.error(err);
     }

frontend/src/components/WorkspaceSettings/Billing/BillingPlanCard/BillingPlanCardDialog.tsx

@@ -4,15 +4,15 @@ import ActionDialog from 'components/base/Dialog/ActionDialog/ActionDialog';
 
 import { updateSubscriptionApiV1BillingSubscriptionSubscriptionIdPut } from 'api/generated';
 
-import logger from 'helpers/services/logger';
-
 import { BillingText } from '../Billing.styles';
 import { FlexContainer } from 'components/base/Container/Container.styles';
 
 import { Loader } from 'components/Loader';
 
 import { constants } from '../billing.constants';
 
+import { resError } from 'helpers/types/resError';
+
 interface BillingPlanCardDialogProps {
   isDialogOpen: boolean;
   handleCloseDialog: () => void;
@@ -37,18 +37,18 @@ const BillingPlanCardDialog = (props: BillingPlanCardDialogProps) => {
   const handleSubmit = async () => {
     setLoading(true);
 
-    try {
-      await updateSubscriptionApiV1BillingSubscriptionSubscriptionIdPut(subscriptionId, {
-        price_id: priceId,
-        quantity: quantity
-      });
-
-      window.location.reload();
-    } catch (err) {
-      setErrorMsg(constants.firstBilling.errorMassageContent);
-      setLoading(false);
-
-      logger.error(err);
+    const response = await updateSubscriptionApiV1BillingSubscriptionSubscriptionIdPut(subscriptionId, {
+      price_id: priceId,
+      quantity: quantity
+    });
+
+    if (response) {
+      if ((response as unknown as resError).error_message) {
+        setErrorMsg(constants.firstBilling.errorMassageContent);
+        setLoading(false);
+      } else {
+        response && response.client_secret && window.location.reload();
+      }
     }
   };
 

frontend/src/components/WorkspaceSettings/Billing/FirstBilling/FirstBilling.tsx

@@ -5,8 +5,6 @@ import {
   listAllProductsApiV1BillingAvailableProductsGet
 } from 'api/generated';
 
-import logger from 'helpers/services/logger';
-
 import BillingPlanCard from '../BillingPlanCard/BillingPlanCard';
 import BillingPaymentWrapper from '../BillingPaymentWrapper';
 import FirstBillingPayment from './FirstBillingPayment';
@@ -15,6 +13,8 @@ import { BillingText, FirstBillingContainer } from '../Billing.styles';
 
 import { constants } from '../billing.constants';
 
+import { resError } from 'helpers/types/resError';
+
 interface ProductsResponseType {
   default_price: string;
   id: string;
@@ -34,21 +34,22 @@ const FirstBilling = () => {
   };
 
   const handleUpgradeClick = async (quantity: number) => {
-    try {
-      const payload = { price_id: product.default_price, quantity: quantity as number };
-      const response = (await createSubscriptionApiV1BillingSubscriptionPost(payload)) as { client_secret: string };
+    const payload = { price_id: product.default_price, quantity: quantity as number };
+    const response = (await createSubscriptionApiV1BillingSubscriptionPost(payload)) as { client_secret: string };
 
-      setClientSecret(response.client_secret);
-    } catch (err) {
-      logger.error(err);
-      setErrorMassage(constants.firstBilling.errorMassageContent);
-    }
+    response && setClientSecret(response.client_secret);
   };
 
   useEffect(() => {
     getProductDetails();
   }, []);
 
+  useEffect(() => {
+    if (clientSecret && (clientSecret as unknown as resError).error_message) {
+      setErrorMassage(constants.firstBilling.errorMassageContent);
+    }
+  }, [clientSecret]);
+
   return (
     <FirstBillingContainer>
       <BillingPlanCard handleUpgradeClick={handleUpgradeClick} productQuantity={1} />

frontend/src/components/WorkspaceSettings/WorkspaceSettings.tsx

@@ -25,11 +25,13 @@ const WorkspaceSettings = () => {
   const [memberSettings, setMemberSettings] = useState<MemberSchema[]>();
   const [isLoading, setIsLoading] = useState(true);
 
-  const isAdmin = memberSettings && memberSettings[0].is_admin;
+  const isAdmin = memberSettings && memberSettings[0]?.is_admin;
 
   const getMemberSettings = async () => {
     const response = await retrieveOrganizationMembersApiV1OrganizationMembersGet();
-    setMemberSettings(response);
+
+    response && setMemberSettings(response);
+
     setIsLoading(false);
   };