Merge branch 'develop' into 'main'

Develop

See merge request witapp/aura-webapp!169

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

@@ -20,15 +20,34 @@ 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"
+  )?.value;
 
   const storedEmail = steps.getStoredValue(Step.Email);
 
   const [product, setProduct] = React.useState("");
+
   const [email, setEmail] = React.useState(steps.getStoredValue(Step.Email));
 
+  React.useEffect(() => {
+    if (!defaultProduct || activeProductFromStore) return;
+    const targetDefaultProduct = products.find((p) => p.key === defaultProduct);
+    if (!targetDefaultProduct) return;
+
+    setProduct(targetDefaultProduct._id);
+    steps.saveCurrent(targetDefaultProduct._id);
+    dispatch(
+      actions.payment.update({
+        activeProduct: targetDefaultProduct,
+      })
+    );
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [defaultProduct]);
+
   React.useEffect(() => {
     if (activeProductFromStore) {
       setProduct(activeProductFromStore._id);
@@ -40,6 +59,7 @@ export default function StepSubscriptionPlan() {
   }, [storedEmail]);
 
   const onNext = () => {
+    if (!product) return;
     const targetProduct = products.find((_product) => _product._id === product);
 
     if (targetProduct) {
@@ -134,6 +154,7 @@ export default function StepSubscriptionPlan() {
         type="button"
         onClick={onNext}
         active
+        disabled={!product}
       >
         Continue
       </Button>

src/components/palmistry/step-upload/step-upload.tsx

@@ -78,11 +78,12 @@ export default function StepUpload(props: Props) {
   };
 
   const onTakePhoto = async (photo: string) => {
+    setUploadMenuModalIsOpen(false);
+    setPalmCameraModalIsOpen(false);
+    setIsUpladProcessing(true);
     const file = DataURIToBlob(photo);
     await getLines(file);
     setPalmPhoto(photo as string);
-    setUploadMenuModalIsOpen(false);
-    setPalmCameraModalIsOpen(false);
   };
 
   useEffect(() => {