AW-102-trial-choice-palmistry

src/components/palmistry/step-subscription-plan/step-subscription-plan.tsx

@@ -20,15 +20,33 @@ export default function StepSubscriptionPlan() {
   const steps = useSteps();
   const dispatch = useDispatch();
   const activeProductFromStore = useSelector(selectors.selectActiveProduct);
-  const { products } = usePaywall({
+  const { products, properties } = usePaywall({
     placementKey: EPlacementKeys["aura.placement.palmistry.main"],
   });
+  const defaultProduct = properties.find(
+    (property) => property.key === "default.product"
+  )?._id;
 
   const storedEmail = steps.getStoredValue(Step.Email);
 
   const [product, setProduct] = React.useState("");
+
   const [email, setEmail] = React.useState(steps.getStoredValue(Step.Email));
 
+  React.useEffect(() => {
+    if (!defaultProduct) return;
+    const targetDefaultProduct = products.find((p) => p._id === defaultProduct);
+    if (!targetDefaultProduct) return;
+
+    setProduct(defaultProduct);
+    steps.saveCurrent(defaultProduct);
+    dispatch(
+      actions.payment.update({
+        activeProduct: targetDefaultProduct,
+      })
+    );
+  }, [defaultProduct, dispatch, products, steps]);
+
   React.useEffect(() => {
     if (activeProductFromStore) {
       setProduct(activeProductFromStore._id);
@@ -40,6 +58,7 @@ export default function StepSubscriptionPlan() {
   }, [storedEmail]);
 
   const onNext = () => {
+    if (!product) return;
     const targetProduct = products.find((_product) => _product._id === product);
 
     if (targetProduct) {
@@ -134,6 +153,7 @@ export default function StepSubscriptionPlan() {
         type="button"
         onClick={onNext}
         active
+        disabled={!product}
       >
         Continue
       </Button>