Jameson/CT-1659

package.json

@@ -46,7 +46,7 @@
     "@kyper/utilityrow": "^2.1.0",
     "@mui/icons-material": "^6.1.5",
     "@mui/material": "^6.1.5",
-    "@mxenabled/mxui": "^1.5.1",
+    "@mxenabled/mxui": "^1.5.2",
     "@reduxjs/toolkit": "^2.2.7",
     "@types/node": "^22.1.0",
     "axios": "^1.8.4",

src/components/RenderConnectStep.js

@@ -23,6 +23,7 @@ import {
 import Disclosure from 'src/views/disclosure/Disclosure'
 import { Search } from 'src/views/search/Search'
 import MFAStep from 'src/views/mfa/MFAStep'
+import { InstitutionDisabled } from 'src/views/institutionDisabled/InstitutionDisabled'
 import { OAuthStep } from 'src/views/oauth/OAuthStep'
 import { OAuthError } from 'src/views/oauth/OAuthError'
 import { UpdateMemberForm } from 'src/views/credentials/UpdateMemberForm'
@@ -110,7 +111,7 @@ const RenderConnectStep = (props) => {
     )
 
     // The institution doesn't have credentials until we request it again from server
-    handleSelectInstitution(institution.guid)
+    handleSelectInstitution(institution)
   }
 
   let connectStepView = null
@@ -142,6 +143,8 @@ const RenderConnectStep = (props) => {
         usePopularOnly={usePopularOnly}
       />
     )
+  } else if (step === STEPS.INSTITUTION_DISABLED) {
+    connectStepView = <InstitutionDisabled ref={props.navigationRef} />
   } else if (step === STEPS.CONSENT) {
     connectStepView = (
       <div>

src/const/Analytics.js

@@ -66,6 +66,7 @@ export const PageviewInfo = {
   CONNECT_DYNAMIC_DISCLOSURE: ['Connect Dynamic Disclosure', '/dynamic_disclosure'],
   CONNECT_GENERIC_ERROR: ['Connect Generic Error', '/generic_error'],
   CONNECT_IE_11_DEPRECATION: ['Connect IE 11 Deprecation', '/ie_11_deprecation'],
+  CONNECT_INSTITUTION_DISABLED: ['Connect Institution Disabled', '/institution_disabled'],
   CONNECT_LOGIN_ERROR: ['Connect Login Error', '/login_error'],
   CONNECT_MANUAL_ACCOUNT: ['Manual Account Connect', '/manual_account_connect'],
   CONNECT_MANUAL_ACCOUNT_FORM: ['Connect Manual Account Form', '/manual_account_form'],

src/const/Connect.js

@@ -14,6 +14,7 @@ export const STEPS = {
   DISCLOSURE: 'disclosure',
   ENTER_CREDENTIALS: 'enterCreds',
   EXISTING_MEMBER: 'existingMember',
+  INSTITUTION_DISABLED: 'institutionDisabled',
   MFA: 'mfa',
   MICRODEPOSITS: 'microdeposits',
   OAUTH_ERROR: 'oauthError',

src/const/language/es.json

@@ -130,7 +130,6 @@
   "This helps verify account ownership, and should match the first and last name on this account.": "Esto ayuda a verificar la propiedad de la cuenta y debe coincidir con el nombre y el apellido de esta cuenta.",
   "Continue to account details": "Continuar con los detalles de la cuenta",
   "Confirm account number": "Confirmar número de cuenta",
-  "Account Type": "Tipo de cuenta",
   "Savings": "Ahorros",
   "Continue to confirm details": "Continuar para confirmar los detalles",
   "Help finding your account number": "Ayuda para encontrar su número de cuenta",
@@ -404,6 +403,10 @@
   "No, only add transfers and payments": "No, solo agrega transferencias y pagos",
   "You're connecting this account for financial management. Would you like to also enable transfers and payments so you can quickly move money to and from this institution?": "Estás conectando esta cuenta para la gestión financiera. ¿Te gustaría habilitar también transferencias y pagos para poder transferir dinero rápidamente desde y hacia esta institución?",
   "No, only add financial management": "No, solo añadir gestión financiera",
+  "DISABLED": "DESACTIVADO",
+  "Logo for %1": "Logotipo de %1",
+  "Free %1 Connections Are No Longer Available": "Las conexiones gratuitas de %1 ya no están disponibles",
+  "%1 now charges a fee for us to access your account data. To avoid passing that cost on to you, we no longer support %1 connections.": "%1 ahora cobra una comisión por acceder a los datos de su cuenta. Para evitar que usted pague ese costo, ya no ofrecemos conexiones con %1.",
   "connect/disclosure/button\u0004Continue": "Continuar",
   "connect/disclosure/policy/text\u0004By clicking Continue, you agree to the ": "Al hacer clic en Continuar, tu aceptas la ",
   "connect/disclosure/policy/link\u0004MX Privacy Policy.": "Política de privacidad de Money Experience.",

src/const/language/es.po

@@ -282,6 +282,7 @@ msgid "Loading ..."
 msgstr "Cargando…"
 
 #: src/views/verification/VerifyError.js
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
 msgid "Go back"
 msgstr "Regresar"
 
@@ -614,6 +615,7 @@ msgid "Return to verify the deposit amounts."
 msgstr "Regrese para verificar los montos del depósito."
 
 #: src/views/microdeposits/MicrodepositErrors.js
+#: src/views/microdeposits/AccountInfo.js
 #: src/views/microdeposits/ConfirmDetails.js
 msgid "Account type"
 msgstr "Tipo de cuenta"
@@ -662,10 +664,6 @@ msgstr "Continuar con los detalles de la cuenta"
 msgid "Confirm account number"
 msgstr "Confirmar número de cuenta"
 
-#: src/views/microdeposits/AccountInfo.js
-msgid "Account Type"
-msgstr "Tipo de cuenta"
-
 #: src/views/microdeposits/const.js src/views/manualAccount/constants.js
 msgid "Savings"
 msgstr "Ahorros"
@@ -2015,6 +2013,22 @@ msgstr ""
 msgid "No, only add financial management"
 msgstr "No, solo añadir gestión financiera"
 
-#: src/views/mfa/MFAOptions.js
-msgid "Select an account to connect"
-msgstr "Seleccione una cuenta para conectarse"
+#: src/components/InstitutionTile.js
+msgid "DISABLED"
+msgstr "DESACTIVADO"
+
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
+msgid "Logo for %1"
+msgstr "Logotipo de %1"
+
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
+msgid "Free %1 Connections Are No Longer Available"
+msgstr "Las conexiones gratuitas de %1 ya no están disponibles"
+
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
+msgid ""
+"%1 now charges a fee for us to access your account data. To avoid passing "
+"that cost on to you, we no longer support %1 connections."
+msgstr ""
+"%1 ahora cobra una comisión por acceder a los datos de su cuenta. Para "
+"evitar que usted pague ese costo, ya no ofrecemos conexiones con %1."

src/const/language/frCa.json

@@ -156,7 +156,6 @@
   "Your %1 number is on the bottom of your checks.": "Votre numéro %1 se trouve au bas de vos chèques.",
   "Bank statement": "Relevé bancaire",
   "Your %1 number is usually included on your bank statement.": "Votre numéro %1 est généralement inclus sur votre relevé bancaire.",
-  "Account Type": "Type de compte",
   "Institution is not supported for microdeposit verification.": "L'établissement n'est pas pris en charge pour la vérification des micro-dépôts.",
   "Enter routing number": "Entrez le numéro d'acheminement",
   "Help finding your routing number": "Aide à trouver votre numéro de routage",
@@ -405,6 +404,10 @@
   "No, only add transfers and payments": "Non, ajoutez uniquement les virements et les paiements",
   "You're connecting this account for financial management. Would you like to also enable transfers and payments so you can quickly move money to and from this institution?": "Vous connectez ce compte à des fins de gestion financière. Souhaitez-vous également activer les virements et les paiements afin de transférer rapidement de l'argent vers et depuis cette institution ?",
   "No, only add financial management": "Non, ajoutez uniquement la gestion financière",
+  "DISABLED": "DÉSACTIVÉ",
+  "Logo for %1": "Logo pour %1",
+  "Free %1 Connections Are No Longer Available": "Les connexions gratuites %1 ne sont plus disponibles",
+  "%1 now charges a fee for us to access your account data. To avoid passing that cost on to you, we no longer support %1 connections.": "$1 facture désormais des frais pour accéder à vos données de compte. Pour éviter de vous les répercuter, nous ne prenons plus en charge les connexions $1.",
   "connect/disclosure/policy/text\u0004By clicking Continue, you agree to the ": "En cliquant sur Continuer, vous acceptez la ",
   "connect/disclosure/policy/link\u0004MX Privacy Policy.": "Politique de confidentialité de MX.",
   "connect/disclosure/policy/link\u0004MX Privacy Policy": "Politique de confidentialité de MX.",

src/const/language/frCa.po

@@ -698,6 +698,7 @@ msgid "Return to verify the deposit amounts."
 msgstr "Retour pour vérifier les montants des dépôts."
 
 #: src/views/microdeposits/MicrodepositErrors.js
+#: src/views/microdeposits/AccountInfo.js
 #: src/views/microdeposits/ConfirmDetails.js
 msgid "Account type"
 msgstr "Type de compte"
@@ -857,10 +858,6 @@ msgstr "Relevé bancaire"
 msgid "Your %1 number is usually included on your bank statement."
 msgstr "Votre numéro %1 est généralement inclus sur votre relevé bancaire."
 
-#: src/views/microdeposits/AccountInfo.js
-msgid "Account Type"
-msgstr "Type de compte"
-
 #: src/views/microdeposits/RoutingNumber.js
 msgid "Institution is not supported for microdeposit verification."
 msgstr ""
@@ -1747,6 +1744,7 @@ msgid "You have successfully connected %1 to %2."
 msgstr "Vous avez réussi à connecter %1 à %2"
 
 #: src/views/verification/VerifyError.js
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
 msgid "Go back"
 msgstr "Retourner"
 
@@ -2091,3 +2089,24 @@ msgstr ""
 #: src/views/additionalProduct/AdditionalProductStep.tsx
 msgid "No, only add financial management"
 msgstr "Non, ajoutez uniquement la gestion financière"
+
+#: src/components/InstitutionTile.js
+msgid "DISABLED"
+msgstr "DÉSACTIVÉ"
+
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
+msgid "Logo for %1"
+msgstr "Logo pour %1"
+
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
+msgid "Free %1 Connections Are No Longer Available"
+msgstr "Les connexions gratuites %1 ne sont plus disponibles"
+
+#: src/views/institutionDisabled/InstitutionDisabled.tsx
+msgid ""
+"%1 now charges a fee for us to access your account data. To avoid passing "
+"that cost on to you, we no longer support %1 connections."
+msgstr ""
+"$1 facture désormais des frais pour accéder à vos données de compte. Pour "
+"éviter de vous les répercuter, nous ne prenons plus en charge les connexions "
+"$1."

src/hooks/__tests__/useSelectInstitution-test.tsx

@@ -10,7 +10,7 @@ const TestSelectInstitutionComponent = () => {
   const { handleSelectInstitution } = useSelectInstitution()
   return (
     <div>
-      <button onClick={() => handleSelectInstitution(institutionData.institution.guid)}>
+      <button onClick={() => handleSelectInstitution(institutionData.institution)}>
         Select institution
       </button>
       <p>Selected institution: {selectedInstitution.name}</p>

src/hooks/useSelectInstitution.tsx

@@ -8,48 +8,52 @@ import { ActionTypes, selectInstitutionError } from 'src/redux/actions/Connect'
 import { selectConnectConfig } from 'src/redux/reducers/configSlice'
 import { isConsentEnabled } from 'src/redux/reducers/userFeaturesSlice'
 import { RootState } from 'src/redux/Store'
+import { institutionIsBlockedForCostReasons } from 'src/utilities/institutionBlocks'
 
 const useSelectInstitution = () => {
   const { api } = useApi()
-  const [institutionGuid, setInstitutionGuid] = useState('')
+  const [institution, setInstitution] = useState<InstitutionResponseType | null>(null)
   const dispatch = useDispatch()
   const consentIsEnabled = useSelector((state: RootState) => isConsentEnabled(state))
   const connectConfig = useSelector(selectConnectConfig)
 
   const handleSelectInstitution = useCallback(
-    (institutionGuid: string) => {
-      setInstitutionGuid(institutionGuid)
+    (institution: InstitutionResponseType) => {
+      setInstitution(institution)
     },
-    [institutionGuid],
+    [institution],
   )
 
   useEffect(() => {
-    if (!institutionGuid) return () => {}
+    if (!institution) return () => {}
 
-    const selectInstitution$ = from(api.loadInstitutionByGuid(institutionGuid))
+    const selectInstitution$ = from(api.loadInstitutionByGuid(institution.guid))
       .pipe(
-        map((institution) => {
+        map((insWithCreds) => {
           return dispatch({
             type: ActionTypes.SELECT_INSTITUTION_SUCCESS,
             payload: {
-              institution,
+              institution: {
+                ...insWithCreds,
+                is_disabled_by_client: institutionIsBlockedForCostReasons(institution), // Temporary workaround till backend/core is fixed
+              },
               consentIsEnabled: consentIsEnabled || false,
               additionalProductOption: connectConfig?.additional_product_option || null,
             },
           })
         }),
         catchError((err) => {
-          setInstitutionGuid('')
+          setInstitution(null)
           return of(selectInstitutionError(err))
         }),
       )
       .subscribe((action) => {
-        setInstitutionGuid('')
+        setInstitution(null)
         dispatch(action)
       })
 
     return () => selectInstitution$.unsubscribe()
-  }, [institutionGuid])
+  }, [institution])
 
   return { handleSelectInstitution }
 }

src/redux/actions/Connect.js

@@ -9,6 +9,7 @@ export const ActionTypes = {
   FINISH_MICRODEPOSITS: 'connect/finish_microdeposits',
   GO_BACK_CREDENTIALS: 'connect/go_back_credentials',
   GO_BACK_CONSENT: 'connect/go_back_consent',
+  GO_BACK_INSTITUTION_DISABLED: 'connect/go_back_institution_disabled',
   GO_BACK_MANUAL_ACCOUNT: 'connect/go_back_manual_account',
   GO_BACK_OAUTH: 'connect/go_back_oauth',
   GO_BACK_POST_MESSAGE: 'connect/go_back_post_message',

src/redux/reducers/Connect.js

@@ -12,6 +12,10 @@ import { hasNoSingleAccountSelectOptions } from 'src/utilities/memberUtils'
 import { COMBO_JOB_DATA_TYPES } from 'src/const/comboJobDataTypes'
 import { addAggregationData, addVerificationData } from './configSlice'
 import { canHandleActionableError } from 'src/views/actionableError/consts'
+import {
+  institutionIsBlockedForCostReasons,
+  memberIsBlockedForCostReasons,
+} from 'src/utilities/institutionBlocks'
 
 export const defaultState = {
   error: null, // The most recent job request error, if any
@@ -241,6 +245,7 @@ const selectInstitutionSuccess = (state, action) => {
   // 1. Enter credentials - default next step
   // 2. Additional product - if the client is offering a product AND the institution has support for the product
   // 3. Consent - if the Client has enabled consent
+  // 4. Institution disabled - if the institution is disabled by the client
   let nextStep = STEPS.ENTER_CREDENTIALS
 
   const canOfferVerification =
@@ -249,7 +254,12 @@ const selectInstitutionSuccess = (state, action) => {
   const canOfferAggregation =
     action.payload.additionalProductOption === COMBO_JOB_DATA_TYPES.TRANSACTIONS
 
-  if (canOfferVerification || canOfferAggregation) {
+  if (
+    action.payload.institution &&
+    institutionIsBlockedForCostReasons(action.payload.institution)
+  ) {
+    nextStep = STEPS.INSTITUTION_DISABLED
+  } else if (canOfferVerification || canOfferAggregation) {
     nextStep = STEPS.ADDITIONAL_PRODUCT
   } else if (action.payload.consentIsEnabled) {
     nextStep = STEPS.CONSENT
@@ -283,7 +293,12 @@ const continueAfterAdditionalProduct = (state, action) => {
 // Oauth reducers
 const startOauth = (state, action) => ({
   ...state,
-  location: pushLocation(state.location, STEPS.ENTER_CREDENTIALS),
+  location: pushLocation(
+    state.location,
+    action.payload.institution && institutionIsBlockedForCostReasons(action.payload.institution)
+      ? STEPS.INSTITUTION_DISABLED
+      : STEPS.ENTER_CREDENTIALS,
+  ),
   currentMemberGuid: action.payload.member.guid,
   selectedInstitution: action.payload.institution,
 })
@@ -372,7 +387,12 @@ const verifyExistingConnection = (state, action) => {
   return {
     ...state,
     currentMemberGuid: action.payload.member.guid,
-    location: pushLocation(state.location, STEPS.CONNECTING),
+    location: pushLocation(
+      state.location,
+      action.payload.institution && institutionIsBlockedForCostReasons(action.payload.institution)
+        ? STEPS.INSTITUTION_DISABLED
+        : STEPS.CONNECTING,
+    ),
     selectedInstitution: action.payload.institution,
   }
 }
@@ -490,8 +510,13 @@ function getStartingStep(members, member, microdeposit, config, institution, wid
   const shouldStepToConnecting =
     member?.connection_status === ReadableStatuses.REJECTED ||
     member?.connection_status === ReadableStatuses.EXPIRED
+  const shouldStepToInstitutionDisabled =
+    (institution && institutionIsBlockedForCostReasons(institution)) ||
+    (member && memberIsBlockedForCostReasons(member))
 
-  if (shouldStepToMFA)
+  if (shouldStepToInstitutionDisabled) {
+    return STEPS.INSTITUTION_DISABLED
+  } else if (shouldStepToMFA)
     // They configured connect to resolve MFA on a member.
     return STEPS.MFA
   else if (shouldUpdateCredentials)
@@ -517,7 +542,9 @@ function getStartingStep(members, member, microdeposit, config, institution, wid
 function getStepFromMember(member) {
   const connection_status = member.connection_status
 
-  if (
+  if (member && memberIsBlockedForCostReasons(member)) {
+    return STEPS.INSTITUTION_DISABLED
+  } else if (
     (member?.error?.error_code && canHandleActionableError(member?.error?.error_code)) ||
     hasNoSingleAccountSelectOptions(member)
   )
@@ -608,6 +635,7 @@ export const connect = createReducer(defaultState, {
   [ActionTypes.CONNECT_COMPLETE]: connectComplete,
   [ActionTypes.GO_BACK_CREDENTIALS]: connectGoBack,
   [ActionTypes.GO_BACK_CONSENT]: goBackSearchOrVerify,
+  [ActionTypes.GO_BACK_INSTITUTION_DISABLED]: connectGoBack,
   [ActionTypes.GO_BACK_POST_MESSAGE]: goBackSearchOrVerify,
   [ActionTypes.EXIT_MICRODEPOSITS]: exitMicrodeposits,
   [ActionTypes.FINISH_MICRODEPOSITS]: finishMicrodeposits,