From 1488665499d8431034596c384620b6ae915ac70b Mon Sep 17 00:00:00 2001
From: Darcy Ye <darcyye@silverhand.io>
Date: Tue, 22 Oct 2024 00:20:34 +0800
Subject: [PATCH] fix(console): fix app creation modal footer

---
 .../CreateForm/Footer/index.tsx               | 150 +++++++++---------
 1 file changed, 75 insertions(+), 75 deletions(-)

diff --git a/packages/console/src/components/ApplicationCreation/CreateForm/Footer/index.tsx b/packages/console/src/components/ApplicationCreation/CreateForm/Footer/index.tsx
index 0ae1d908d..b8ba29eae 100644
--- a/packages/console/src/components/ApplicationCreation/CreateForm/Footer/index.tsx
+++ b/packages/console/src/components/ApplicationCreation/CreateForm/Footer/index.tsx
@@ -42,83 +42,83 @@ function Footer({ selectedType, isLoading, onClickCreate, isThirdParty }: Props)
   } = useUserPreferences();
 
   if (selectedType) {
-    if (
-      selectedType === ApplicationType.MachineToMachine &&
-      hasMachineToMachineAppsReachedLimit &&
-      // Just in case the enterprise plan has reached the resource limit, we still need to show charge notice.
-      isPaidPlan(planId, isEnterprisePlan) &&
-      !m2mUpsellNoticeAcknowledged
-    ) {
-      return (
-        <AddOnNoticeFooter
-          isLoading={isLoading}
-          buttonTitle="applications.create"
-          onClick={() => {
-            void update({ m2mUpsellNoticeAcknowledged: true });
-            onClickCreate();
-          }}
-        >
-          <Trans
-            components={{
-              span: <span className={styles.strong} />,
-              a: <TextLink to={addOnPricingExplanationLink} />,
-            }}
-          >
-            {t('add_on.footer.machine_to_machine_app', {
-              price: machineToMachineAddOnUnitPrice,
-            })}
-          </Trans>
-        </AddOnNoticeFooter>
-      );
-    }
+    if (selectedType === ApplicationType.MachineToMachine) {
+      if (hasMachineToMachineAppsReachedLimit) {
+        if (
+          // Just in case the enterprise plan has reached the resource limit, we still need to show charge notice.
+          isPaidPlan(planId, isEnterprisePlan) &&
+          !m2mUpsellNoticeAcknowledged
+        ) {
+          return (
+            <AddOnNoticeFooter
+              isLoading={isLoading}
+              buttonTitle="applications.create"
+              onClick={() => {
+                void update({ m2mUpsellNoticeAcknowledged: true });
+                onClickCreate();
+              }}
+            >
+              <Trans
+                components={{
+                  span: <span className={styles.strong} />,
+                  a: <TextLink to={addOnPricingExplanationLink} />,
+                }}
+              >
+                {t('add_on.footer.machine_to_machine_app', {
+                  price: machineToMachineAddOnUnitPrice,
+                })}
+              </Trans>
+            </AddOnNoticeFooter>
+          );
+        }
 
-    if (
-      selectedType === ApplicationType.MachineToMachine &&
-      hasMachineToMachineAppsReachedLimit &&
-      // For paid plan (pro plan), we don't guard the m2m app creation since it's an add-on feature.
-      currentSku.id === ReservedPlanId.Free
-    ) {
-      return (
-        <QuotaGuardFooter>
-          <Trans
-            components={{
-              a: <ContactUsPhraseLink />,
-            }}
-          >
-            {t('paywall.machine_to_machine_feature')}
-          </Trans>
-        </QuotaGuardFooter>
-      );
-    }
+        // For paid plan (pro plan), we don't guard the m2m app creation since it's an add-on feature.
+        if (currentSku.id === ReservedPlanId.Free) {
+          return (
+            <QuotaGuardFooter>
+              <Trans
+                components={{
+                  a: <ContactUsPhraseLink />,
+                }}
+              >
+                {t('paywall.machine_to_machine_feature')}
+              </Trans>
+            </QuotaGuardFooter>
+          );
+        }
+      }
+    } else {
+      // Third party app is only available for paid plan (pro plan).
+      if (isThirdParty && hasThirdPartyAppsReachedLimit) {
+        return (
+          <QuotaGuardFooter>
+            <Trans
+              components={{
+                a: <ContactUsPhraseLink />,
+              }}
+            >
+              {t('paywall.third_party_apps')}
+            </Trans>
+          </QuotaGuardFooter>
+        );
+      }
 
-    // Third party app is only available for paid plan (pro plan).
-    if (isThirdParty && hasThirdPartyAppsReachedLimit) {
-      return (
-        <QuotaGuardFooter>
-          <Trans
-            components={{
-              a: <ContactUsPhraseLink />,
-            }}
-          >
-            {t('paywall.third_party_apps')}
-          </Trans>
-        </QuotaGuardFooter>
-      );
-    }
-
-    if (hasAppsReachedLimit) {
-      return (
-        <QuotaGuardFooter>
-          <Trans
-            components={{
-              a: <ContactUsPhraseLink />,
-              planName: <SkuName skuId={planId} isEnterprisePlan={isEnterprisePlan} />,
-            }}
-          >
-            {t('paywall.applications', { count: currentSubscriptionQuota.applicationsLimit ?? 0 })}
-          </Trans>
-        </QuotaGuardFooter>
-      );
+      if (hasAppsReachedLimit) {
+        return (
+          <QuotaGuardFooter>
+            <Trans
+              components={{
+                a: <ContactUsPhraseLink />,
+                planName: <SkuName skuId={planId} isEnterprisePlan={isEnterprisePlan} />,
+              }}
+            >
+              {t('paywall.applications', {
+                count: currentSubscriptionQuota.applicationsLimit ?? 0,
+              })}
+            </Trans>
+          </QuotaGuardFooter>
+        );
+      }
     }
   }