diff --git a/src/components/palmistry/step-subscription-plan/step-subscription-plan.tsx b/src/components/palmistry/step-subscription-plan/step-subscription-plan.tsx index 3620bc7..e8b0e38 100644 --- a/src/components/palmistry/step-subscription-plan/step-subscription-plan.tsx +++ b/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