fix: when you click on phygitals in templates page, it should redirec… (

#1080)
bosonprotocol · May 14, 2024 · d7db7fa · d7db7fa
1 parent d57438c
commit d7db7fa
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 6 deletions.
diff --git a/src/components/product/utils/useInitialValues.ts b/src/components/product/utils/useInitialValues.ts
@@ -58,6 +58,7 @@ import {
   OPTIONS_UNIT,
   OPTIONS_WEIGHT,
   ProductMetadataAttributeKeys,
+  ProductTypeTypeValues,
   ProductTypeVariantsValues,
   SUPPORTED_FILE_FORMATS,
   TOKEN_CRITERIA,
@@ -80,6 +81,12 @@ export function useInitialValues() {
   const isTokenGated = searchParams.get(
     SellerLandingPageParameters.sltokenGated
   );
+  const productTypeQueryParam = searchParams.get(
+    SellerLandingPageParameters.slproductType
+  );
+  const productType = Object.values(ProductTypeTypeValues).find(
+    (validProductType) => validProductType === productTypeQueryParam
+  );
   const fromProductUuid = searchParams.get(
     SellerHubQueryParameters.fromProductUuid
   );
@@ -208,6 +215,14 @@ export function useInitialValues() {
       cloneInitialValues.productType.tokenGatedOffer = "true";
     }
   }
+  if (productType) {
+    if (cloneBaseValues.productType) {
+      cloneBaseValues.productType.productType = productType;
+    }
+    if (cloneInitialValues?.productType) {
+      cloneInitialValues.productType.productType = productType;
+    }
+  }
 
   return {
     shouldDisplayModal:

diff --git a/src/lib/routing/parameters.ts b/src/lib/routing/parameters.ts
@@ -35,7 +35,8 @@ export const UrlParameters = {
 export const SellerLandingPageParameters = {
   slsteps: "slsteps", // slsteps = seller landing steps
   sltitle: "sltitle",
-  sltokenGated: "sltokenGated"
+  sltokenGated: "sltokenGated",
+  slproductType: "slproductType"
 };
 
 export const configQueryParameters = {

diff --git a/src/pages/sell/landing/SellerLandingPage.tsx b/src/pages/sell/landing/SellerLandingPage.tsx
@@ -1,3 +1,4 @@
+import { ProductTypeTypeValues } from "components/product/utils";
 import React from "react";
 import styled from "styled-components";
 
@@ -197,7 +198,13 @@ export const SellerLandingPage: React.FC = () => {
                     VariableStep.AddSalesChannels
                   ],
                   to: {
-                    pathname: SellerCenterRoutes.CreateProduct
+                    pathname: SellerCenterRoutes.CreateProduct,
+                    search: [
+                      [
+                        SellerLandingPageParameters.slproductType,
+                        ProductTypeTypeValues.physical
+                      ]
+                    ]
                   },
                   firstActiveStep: hasSeller ? 1 : 0,
                   doSetQueryParams: true
@@ -208,10 +215,27 @@ export const SellerLandingPage: React.FC = () => {
               image={<img src={sneakerNftImg} width="128" height="128" />}
               title="Create Phygitals"
               subtitle="Bundle physical products with a digital twin all in one offer"
-              as="a"
-              href="https://form.typeform.com/to/NaiNUsqn"
-              target="_blank"
-              rel="noopener noreferrer"
+              onClick={() => {
+                showModal("VARIABLE_STEPS_EXPLAINER", {
+                  title: "Create Phygitals",
+                  order: [
+                    VariableStep.CreateYourProfile,
+                    VariableStep.CreateYourProducts,
+                    VariableStep.AddSalesChannels
+                  ],
+                  to: {
+                    pathname: SellerCenterRoutes.CreateProduct,
+                    search: [
+                      [
+                        SellerLandingPageParameters.slproductType,
+                        ProductTypeTypeValues.phygital
+                      ]
+                    ]
+                  },
+                  firstActiveStep: hasSeller ? 1 : 0,
+                  doSetQueryParams: true
+                });
+              }}
             />
             <CreateTokenGatedOffers
               hasSeller={hasSeller}