button enable issue fix (#1232)

* button enable issue fix * review changes * reiview changes
EmpowerPlastic · Apr 5, 2024 · 644bc55 · 644bc55
1 parent 02c3a58
commit 644bc55
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 15 deletions.
diff --git a/frontend/marketplace/src/components/BuyButton.vue b/frontend/marketplace/src/components/BuyButton.vue
@@ -101,18 +101,21 @@ const handleModalType = (type: CertificateHolderModalTypeEnums) => {
 const buttonHandler = computed<(() => void) | undefined>(() => {
   switch (buttonState.value) {
     case BuyButtonState.ENABLED_CARD:
-      handleModalType(CertificateHolderModalTypeEnums.AUTHORIZED_USER);
+      handleModalType(CertificateHolderModalTypeEnums.EMAIL_AUTHORIZED_USER);
       tracking.trackEvent(TrackEvents.CLICKED_PAYMENT_BUTTON, {
         status: "pay with card",
       });
       return addModalToHandler(props.handleCardPayment);
     case BuyButtonState.ENABLED_WALLET:
+      handleModalType(
+        CertificateHolderModalTypeEnums.CRYPTO_WALLET_AUTHORIZED_USER,
+      );
       tracking.trackEvent(TrackEvents.CLICKED_PAYMENT_BUTTON, {
         status: "pay with crypto",
       });
       return addModalToHandler(props.handleBuyCredits);
     case BuyButtonState.ENABLED_UNAUTHORIZED:
-      handleModalType(CertificateHolderModalTypeEnums.UNAUTHORIZED_USER);
+      handleModalType(CertificateHolderModalTypeEnums.GUEST_USER);
       tracking.trackEvent(TrackEvents.CLICKED_PAYMENT_BUTTON, {
         status: "unauthorized",
       });
@@ -133,7 +136,7 @@ const isDisabled = computed(
 
 const handleContinue = (name: string, email?: string) => {
   if (
-    modalType.value === CertificateHolderModalTypeEnums.UNAUTHORIZED_USER &&
+    modalType.value === CertificateHolderModalTypeEnums.GUEST_USER &&
     continueUnauthorizedPaymentHandler.value
   ) {
     return continueUnauthorizedPaymentHandler.value(name, email || "");

diff --git a/frontend/marketplace/src/components/CertificateHolderModal.vue b/frontend/marketplace/src/components/CertificateHolderModal.vue
@@ -28,16 +28,17 @@ const isCertificateHolderEmailValid = computed<boolean>(() => {
 });
 
 const isButtonDisabled = () => {
-  if (
-    (props.modalType === CertificateHolderModalTypeEnums.UNAUTHORIZED_USER &&
-      isCertificateHolderValid.value &&
-      isCertificateHolderEmailValid.value) ||
-    (props.modalType === CertificateHolderModalTypeEnums.AUTHORIZED_USER &&
-      isCertificateHolderValid.value)
-  ) {
-    return false;
+  if (!isCertificateHolderValid.value) {
+    return true;
   }
-  return true;
+
+  return !(
+    props.modalType === CertificateHolderModalTypeEnums.EMAIL_AUTHORIZED_USER ||
+    props.modalType ===
+      CertificateHolderModalTypeEnums.CRYPTO_WALLET_AUTHORIZED_USER ||
+    (props.modalType === CertificateHolderModalTypeEnums.GUEST_USER &&
+      isCertificateHolderEmailValid.value)
+  );
 };
 
 const handleOpenModal = () => {
@@ -74,7 +75,7 @@ defineExpose({
           >
         </div>
         <input
-          v-if="modalType === CertificateHolderModalTypeEnums.UNAUTHORIZED_USER"
+          v-if="modalType === CertificateHolderModalTypeEnums.GUEST_USER"
           type="email"
           placeholder="Certificate holder email"
           class="input input-bordered w-full text-white bg-lightGray mt-5"

diff --git a/frontend/marketplace/src/types/CertificateHolderModalTypeEnums.ts b/frontend/marketplace/src/types/CertificateHolderModalTypeEnums.ts
@@ -1,4 +1,5 @@
 export enum CertificateHolderModalTypeEnums {
-  AUTHORIZED_USER = "AUTHORIZED_USER",
-  UNAUTHORIZED_USER = "UNAUTHORIZED_USER",
+  EMAIL_AUTHORIZED_USER = "EMAIL_AUTHORIZED_USER",
+  CRYPTO_WALLET_AUTHORIZED_USER = "CRYPTO_WALLET_AUTHORIZED_USER",
+  GUEST_USER = "GUEST_USER",
 }