Merge branch 'main' into fix/added-support-link-unlock-ui

Author: smgv

ui/contexts/shield/shield-subscription.tsx

@@ -14,19 +14,14 @@ import {
   setShowShieldEntryModalOnce,
   subscriptionsStartPolling,
 } from '../../store/actions';
-import {
-  getSelectedInternalAccount,
-  getUseExternalServices,
-} from '../../selectors';
-import { useAccountTotalFiatBalance } from '../../hooks/useAccountTotalFiatBalance';
+import { getUseExternalServices } from '../../selectors';
 import { selectIsSignedIn } from '../../selectors/identity/authentication';
 import { getIsMetaMaskShieldFeatureEnabled } from '../../../shared/modules/environment';
 import {
   getHasShieldEntryModalShownOnce,
   getIsActiveShieldSubscription,
 } from '../../selectors/subscription';
 import { getIsUnlocked } from '../../ducks/metamask/metamask';
-import { getUserBalanceCategory } from '../../../shared/modules/shield';
 import { useSubscriptionMetrics } from '../../hooks/shield/metrics/useSubscriptionMetrics';
 import { MetaMetricsEventName } from '../../../shared/constants/metametrics';
 
@@ -60,14 +55,8 @@ export const ShieldSubscriptionProvider: React.FC = ({ children }) => {
   const hasShieldEntryModalShownOnce = useSelector(
     getHasShieldEntryModalShownOnce,
   );
-  const selectedAccount = useSelector(getSelectedInternalAccount);
   const { getSubscriptionEligibility: getShieldSubscriptionEligibility } =
     useSubscriptionEligibility(PRODUCT_TYPES.SHIELD);
-  const { totalFiatBalance } = useAccountTotalFiatBalance(
-    selectedAccount,
-    false,
-    true, // use USD conversion rate instead of the current currency
-  );
   const { captureShieldEligibilityCohortEvent } = useSubscriptionMetrics();
 
   /**
@@ -158,29 +147,15 @@ export const ShieldSubscriptionProvider: React.FC = ({ children }) => {
           return;
         }
 
-        if (
-          !selectedAccount ||
-          !isSignedIn ||
-          !isUnlocked ||
-          hasShieldEntryModalShownOnce
-        ) {
+        if (!isSignedIn || !isUnlocked || hasShieldEntryModalShownOnce) {
           return;
         }
 
-        const balanceCategory = totalFiatBalance
-          ? getUserBalanceCategory(Number(totalFiatBalance))
-          : undefined;
-
-        const shieldEligibility = await getShieldSubscriptionEligibility({
-          balanceCategory,
-        });
+        const shieldEligibility = await getShieldSubscriptionEligibility();
 
         if (
           !shieldEligibility?.canSubscribe ||
-          !shieldEligibility.canViewEntryModal ||
-          !shieldEligibility.minBalanceUSD ||
-          !totalFiatBalance ||
-          Number(totalFiatBalance) < shieldEligibility.minBalanceUSD
+          !shieldEligibility.canViewEntryModal
         ) {
           return;
         }
@@ -264,11 +239,9 @@ export const ShieldSubscriptionProvider: React.FC = ({ children }) => {
       isMetaMaskShieldFeatureEnabled,
       isBasicFunctionalityEnabled,
       isShieldSubscriptionActive,
-      selectedAccount,
       isSignedIn,
       isUnlocked,
       hasShieldEntryModalShownOnce,
-      totalFiatBalance,
       getShieldSubscriptionEligibility,
       assignToCohort,
       captureShieldEligibilityCohortEvent,
@@ -279,7 +252,6 @@ export const ShieldSubscriptionProvider: React.FC = ({ children }) => {
     if (
       isMetaMaskShieldFeatureEnabled &&
       isBasicFunctionalityEnabled &&
-      selectedAccount &&
       isSignedIn &&
       isUnlocked
     ) {
@@ -289,7 +261,6 @@ export const ShieldSubscriptionProvider: React.FC = ({ children }) => {
   }, [
     isMetaMaskShieldFeatureEnabled,
     isSignedIn,
-    selectedAccount,
     dispatch,
     isUnlocked,
     isBasicFunctionalityEnabled,

ui/hooks/subscription/useSubscription.ts

@@ -7,7 +7,6 @@ import {
   ProductType,
   RecurringInterval,
   Subscription,
-  BalanceCategory,
   SubscriptionEligibility,
   SubscriptionStatus,
   ModalType,
@@ -52,17 +51,22 @@ import { getInternalAccountBySelectedAccountGroupAndCaip } from '../../selectors
 import {
   getMetaMetricsId,
   getModalTypeForShieldEntryModal,
+  getSelectedInternalAccount,
   getUnapprovedConfirmations,
   selectNetworkConfigurationByChainId,
 } from '../../selectors';
 import { useSubscriptionMetrics } from '../shield/metrics/useSubscriptionMetrics';
 import { CaptureShieldSubscriptionRequestParams } from '../shield/metrics/types';
 import { EntryModalSourceEnum } from '../../../shared/constants/subscriptions';
 import { DefaultSubscriptionPaymentOptions } from '../../../shared/types';
-import { getLatestSubscriptionStatus } from '../../../shared/modules/shield';
+import {
+  getLatestSubscriptionStatus,
+  getUserBalanceCategory,
+} from '../../../shared/modules/shield';
 import { openWindow } from '../../helpers/utils/window';
 import { SUPPORT_LINK } from '../../../shared/lib/ui-utils';
 import { MetaMetricsEventName } from '../../../shared/constants/metametrics';
+import { useAccountTotalFiatBalance } from '../useAccountTotalFiatBalance';
 import {
   TokenWithApprovalAmount,
   useSubscriptionPricing,
@@ -396,41 +400,46 @@ export const useSubscriptionEligibility = (product: ProductType) => {
   const dispatch = useDispatch<MetaMaskReduxDispatch>();
   const isSignedIn = useSelector(selectIsSignedIn);
   const isUnlocked = useSelector(getIsUnlocked);
+  const selectedAccount = useSelector(getSelectedInternalAccount);
+  const { totalFiatBalance } = useAccountTotalFiatBalance(
+    selectedAccount,
+    false,
+    true, // use USD conversion rate instead of the current currency
+  );
 
-  const getSubscriptionEligibility = useCallback(
-    async (params?: {
-      balanceCategory?: BalanceCategory;
-    }): Promise<SubscriptionEligibility | undefined> => {
-      try {
-        // if user is not signed in or unlocked, return undefined
-        if (!isSignedIn || !isUnlocked) {
-          return undefined;
-        }
-
-        // get the subscriptions before making the eligibility request
-        // here, we cannot `useUserSubscriptions` hook as the hook's initial state has empty subscriptions array and loading state is false
-        // that mistakenly makes `user does not have a subscription` and triggers the eligibility request
-        const subscriptions = await dispatch(getSubscriptions());
-        const isShieldSubscriptionActive =
-          getIsShieldSubscriptionActive(subscriptions);
-
-        if (!isShieldSubscriptionActive) {
-          // only if shield subscription is not active, get the eligibility
-          const eligibilities = await dispatch(
-            getSubscriptionsEligibilities(params),
-          );
-          return eligibilities.find(
-            (eligibility) => eligibility.product === product,
-          );
-        }
-        return undefined;
-      } catch (error) {
-        log.warn('[useSubscriptionEligibility] error', error);
+  const getSubscriptionEligibility = useCallback(async (): Promise<
+    SubscriptionEligibility | undefined
+  > => {
+    try {
+      // if user is not signed in or unlocked, return undefined
+      if (!isSignedIn || !isUnlocked) {
         return undefined;
       }
-    },
-    [isSignedIn, isUnlocked, dispatch, product],
-  );
+
+      const balanceCategory = getUserBalanceCategory(Number(totalFiatBalance));
+
+      // get the subscriptions before making the eligibility request
+      // here, we cannot `useUserSubscriptions` hook as the hook's initial state has empty subscriptions array and loading state is false
+      // that mistakenly makes `user does not have a subscription` and triggers the eligibility request
+      const subscriptions = await dispatch(getSubscriptions());
+      const isShieldSubscriptionActive =
+        getIsShieldSubscriptionActive(subscriptions);
+
+      if (!isShieldSubscriptionActive) {
+        // only if shield subscription is not active, get the eligibility
+        const eligibilities = await dispatch(
+          getSubscriptionsEligibilities({ balanceCategory }),
+        );
+        return eligibilities.find(
+          (eligibility) => eligibility.product === product,
+        );
+      }
+      return undefined;
+    } catch (error) {
+      log.warn('[useSubscriptionEligibility] error', error);
+      return undefined;
+    }
+  }, [isSignedIn, isUnlocked, dispatch, product, totalFiatBalance]);
 
   return {
     getSubscriptionEligibility,