@stigg/react-sdk 4.4.0-beta.1 → 4.4.0-beta.2

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "4.4.0-beta.1",
+  "version": "4.4.0-beta.2",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/checkout/Checkout.tsx

@@ -22,8 +22,7 @@ export const Checkout = ({
       planId={planId}
       preferredBillingPeriod={preferredBillingPeriod}
       billingCountryCode={billingCountryCode}
-      billableFeatures={billableFeatures}
-    >
+      billableFeatures={billableFeatures}>
       <CheckoutContainer {...containerProps} />
     </CheckoutProvider>
   );

package/src/components/checkout/CheckoutProvider.tsx

@@ -1,5 +1,5 @@
 import { produce } from 'immer';
-import React, { useCallback, useContext, useMemo, useState } from 'react';
+import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 
 import { BillableFeature, BillingPeriod, GetCheckoutStateResults } from '@stigg/js-client-sdk';
 
@@ -58,12 +58,16 @@ const CheckoutContextProvider: React.FC<{ children: React.ReactNode; initialStat
 }) => {
   const [state, innerSetState] = useState(initialState);
 
+  useEffect(() => {
+    innerSetState(initialState);
+  }, [initialState]);
+
   const setState = useCallback(
     (updater: (state: CheckoutContextState) => void) => innerSetState((old) => produce(old, (draft) => updater(draft))),
     [innerSetState],
   );
 
-  const [contextValue, setContextValue] = useMemo(() => [state, setState], [state]);
+  const [contextValue, setContextValue] = useMemo(() => [state, setState], [setState, state]);
 
   return <CheckoutContext.Provider value={[contextValue, setContextValue]}>{children}</CheckoutContext.Provider>;
 };
@@ -82,11 +86,11 @@ export function CheckoutProvider({
   children,
   textOverrides,
   theme,
+  preferredBillingPeriod,
+  billableFeatures,
   resourceId,
   planId,
-  preferredBillingPeriod,
   billingCountryCode,
-  billableFeatures,
 }: {
   children: React.ReactNode;
 } & CheckoutProviderProps) {
@@ -130,16 +134,8 @@ export function CheckoutProvider({
     };
 
     return initialState;
-  }, [
-    theme,
-    textOverrides,
-    preferredBillingPeriod,
-    billingCountryCode,
-    billableFeatures,
-    globalTheme,
-    checkout,
-    isLoading,
-  ]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [preferredBillingPeriod, billingCountryCode, checkout, isLoading]);
 
   return (
     <SdkThemeProvider key={checkout?.plan.id} componentTheme={configuration}>

package/src/components/checkout/hooks/usePreviewSubscription.ts

@@ -10,7 +10,7 @@ export const usePreviewSubscriptionAction = () => {
   const subscription = useSubscriptionModel();
   const [{ resourceId, planStep }] = useCheckoutContext();
   const { checkoutState } = useCheckoutModel();
-  const { plan, activeSubscription, customer } = checkoutState || {};
+  const { plan, customer } = checkoutState || {};
 
   const previewSubscriptionAction = useCallback(
     async ({ promotionCode }: { promotionCode?: string | null } = {}) => {
@@ -43,7 +43,6 @@ export const usePreviewSubscriptionAction = () => {
       return { subscriptionPreview, errorMessage };
     },
     [
-      activeSubscription,
       customer,
       plan,
       resourceId,

package/src/components/checkout/index.ts

@@ -1,3 +1,4 @@
 export { CheckoutTheme } from './theme';
 export { Checkout, CheckoutProps } from './Checkout';
+export { OnCheckoutCompletedParams, OnCheckoutParams, CheckoutResult } from './CheckoutContainer';
 export { CheckoutLocalization } from './textOverrides';

package/src/stories/Checkout.stories.tsx

@@ -46,7 +46,7 @@ const Template: ComponentStory<any> = (args) => (
       onChangePlan={({ currentPlan }) => {
         console.log('plan changed clicked!', { currentPlan });
       }}
-      billingInformation={{ taxPercentage: 27 }}
+      // billingInformation={{ taxPercentage: 27 }}
     />
   </Wrapper>
 );
@@ -55,8 +55,9 @@ export const DefaultCheckout = Template.bind({});
 DefaultCheckout.args = {
   ...defaultArgsWithCustomer,
   planId: 'plan-revvenu-essentials',
-  baseUri: 'http://localhost:4000',
-  apiKey: 'client-72b058a6-0f22-4c86-adce-bf266d12e12e:9f356ceb-c94c-42a4-9572-10b12824da81',
-  // baseUri: 'https://api-staging.stigg.io',
-  // apiKey: 'client-79584f52-7ef9-4c58-b9ac-5080acf492e4:71f2274c-100a-4fa4-8a43-48fa3b16c627',
+  // baseUri: 'http://localhost:4000',
+  // apiKey: 'client-72b058a6-0f22-4c86-adce-bf266d12e12e:9f356ceb-c94c-42a4-9572-10b12824da81',
+  // disableEdge: false,
+  baseUri: 'https://api-staging.stigg.io',
+  apiKey: 'client-79584f52-7ef9-4c58-b9ac-5080acf492e4:71f2274c-100a-4fa4-8a43-48fa3b16c627',
 };