@mxenabled/connect-widget 0.20.6 → 1.0.0

package/dist/index.es.js

@@ -9191,7 +9191,7 @@ const loadConnect = (state, { payload }) => {
 };
 const loadConnectSuccess = (state, action) => {
   const {
-    members,
+    members = [],
     member,
     microdeposit,
     config = {},
@@ -9560,7 +9560,7 @@ function getStartingStep(members, member, microdeposit, config, institution, wid
 }
 function getStepFromMember(member) {
   const connection_status = member.connection_status;
-  if (member?.most_recent_job_detail_code && canHandleActionableError(member?.most_recent_job_detail_code) || hasNoSingleAccountSelectOptions(member))
+  if (member?.error?.error_code && canHandleActionableError(member?.error?.error_code) || hasNoSingleAccountSelectOptions(member))
     return STEPS.ACTIONABLE_ERROR;
   else if (connection_status === ReadableStatuses$1.CHALLENGED)
     return STEPS.MFA;
@@ -66683,11 +66683,23 @@ const MFAOptions = (props) => {
         );
       });
     }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { color: "#666", fontSize: 13, marginBottom: 12 }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "#E32727", fontSize: 13 }, children: "*" }),
-      " ",
-      __("Required")
-    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "span",
+      {
+        style: {
+          color: "#666",
+          fontSize: tokens.FontSize.Small,
+          marginBottom: tokens.Spacing.XSmall,
+          display: "inline-block",
+          marginTop: tokens.Spacing.Tiny
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "#E32727", fontSize: 13 }, children: "*" }),
+          " ",
+          __("Required")
+        ]
+      }
+    ),
     isSubmitted && _isEmpty(selectedOption) && /* @__PURE__ */ jsxRuntimeExports.jsxs("section", { role: "alert", style: styles.errorContent, children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(AttentionFilled, { color: tokens.Color.Error300 }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("p", { style: styles.errorMessage, children: isSAS ? __("Account selection is required.") : __("Choose an option") })
@@ -66708,7 +66720,7 @@ const MFAOptions = (props) => {
 const getStyles$Z = (tokens) => {
   return {
     label: {
-      marginBottom: tokens.Spacing.Medium
+      marginBottom: tokens.Spacing.Small
     },
     optionLabel: {
       textAlign: "left",
@@ -67064,7 +67076,7 @@ const MFAForm = (props) => {
   const mfaCredentials = _get(currentMember, "mfa.credentials", []);
   const mfaType = getMFAFieldType(mfaCredentials);
   const isSAS = mfaCredentials[0].external_id === "single_account_select";
-  const styles = getStyles$W(tokens, isSAS);
+  const styles = getStyles$W(tokens);
   const handleSubmit = (credentials) => {
     const posthogEventMetadata = {
       institution_guid: institution.guid,
@@ -67114,11 +67126,11 @@ const MFAForm = (props) => {
     );
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles.container, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.title, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ViewTitle, { title: isSAS ? __("Select an account") : __("Verify identity") }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: styles.title, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ViewTitle, { title: isSAS ? __("Account selection") : __("Verify identity") }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx("form", { onSubmit: (e) => e.preventDefault(), children: Form })
   ] });
 };
-const getStyles$W = (tokens, isSAS) => {
+const getStyles$W = (tokens) => {
   return {
     container: {
       display: "flex",
@@ -67127,7 +67139,7 @@ const getStyles$W = (tokens, isSAS) => {
       height: "100%"
     },
     title: {
-      marginBottom: isSAS ? tokens.Spacing.Medium : tokens.Spacing.Tiny
+      marginBottom: tokens.Spacing.XLarge
     },
     credentialLabel: {
       lineHeight: tokens.LineHeight.Paragraph,
@@ -68910,13 +68922,13 @@ const DEFAULT_POLLING_STATE = {
   userMessage: CONNECTING_MESSAGES.STARTING
   // message to show the end user
 };
-function pollMember(memberGuid, api, onPostMessage, sendPosthogEvent) {
+function pollMember(memberGuid, api, onPostMessage, sendPosthogEvent, clientLocale) {
   return interval(3e3).pipe(
     switchMap(
       () => (
         // Poll the currentMember. Catch errors but don't handle it here
         // the scan will handle it below
-        defer(() => api.loadMemberByGuid(memberGuid)).pipe(
+        defer(() => api.loadMemberByGuid(memberGuid, clientLocale)).pipe(
           mergeMap(
             (member) => defer(() => api.loadJob(member.most_recent_job_guid)).pipe(
               map((job) => {
@@ -70912,6 +70924,9 @@ const CreateMemberForm = (props) => {
   const config = useSelector(selectConfig);
   const isHuman = useSelector((state2) => state2.app.humanEvent);
   const currentMembers = useSelector((state2) => state2.connect.members);
+  const clientLocale = useMemo(() => {
+    return document.querySelector("html")?.getAttribute("lang") || "en";
+  }, [document.querySelector("html")?.getAttribute("lang")]);
   const [isCreatingMember, setIsCreatingMember] = useState(false);
   const [memberCreateError, setMemberCreateError] = useState(null);
   const [userCredentials, setUserCredentials] = useState(null);
@@ -70994,7 +71009,7 @@ const CreateMemberForm = (props) => {
               };
             })
           );
-          return defer(() => api.loadMemberByGuid(memberGuid)).pipe(
+          return defer(() => api.loadMemberByGuid(memberGuid, clientLocale)).pipe(
             mergeMap((member) => {
               const shouldStepToMFA = member.connection_status === ReadableStatuses$1.CHALLENGED;
               return shouldStepToMFA ? stepToMFA$(member) : updateMember$;
@@ -71358,6 +71373,9 @@ const Connecting = (props) => {
   } = props;
   const selectedInstitution = useSelector(getSelectedInstitution);
   const sendPosthogEvent = useAnalyticsEvent();
+  const clientLocale = useMemo(() => {
+    return document.querySelector("html")?.getAttribute("lang") || "en";
+  }, [document.querySelector("html")?.getAttribute("lang")]);
   const currentMember = useSelector(getCurrentMember);
   const isComboJobsEnabled = useSelector(isConnectComboJobsEnabled);
   const jobSchedule = useSelector((state) => state.connect.jobSchedule);
@@ -71483,7 +71501,7 @@ const Connecting = (props) => {
       const startJob$ = defer(
         () => api.runJob(activeJob?.type, currentMember.guid, connectConfig, true)
       ).pipe(
-        mergeMap(() => api.loadMemberByGuid(currentMember.guid)),
+        mergeMap(() => api.loadMemberByGuid(currentMember.guid, clientLocale)),
         catchError((error) => {
           const isSafeConflictError = error?.response?.status === 409;
           if (isSafeConflictError) {
@@ -71496,7 +71514,7 @@ const Connecting = (props) => {
       return needsJobStarted ? startJob$ : of(currentMember);
     }).pipe(
       concatMap(
-        (member) => pollMember(member.guid, api, onPostMessage, sendPosthogEvent).pipe(
+        (member) => pollMember(member.guid, api, onPostMessage, sendPosthogEvent, clientLocale).pipe(
           tap((pollingState) => handleMemberPoll(pollingState)),
           filter((pollingState) => pollingState.jobIsDone),
           pluck("currentResponse"),
@@ -72122,7 +72140,7 @@ const ActionableError = () => {
   const institution = useSelector((state) => state.connect.selectedInstitution);
   const currentMember = useSelector(getCurrentMember);
   const initialConfig = useSelector(selectInitialConfig);
-  const jobDetailCode = currentMember.most_recent_job_detail_code;
+  const jobDetailCode = currentMember.error.error_code;
   const tokens = useTokens();
   const styles = getStyles$A(tokens);
   const getNextDelay = getDelay();
@@ -72131,10 +72149,6 @@ const ActionableError = () => {
     () => ({
       [ACTIONABLE_ERROR_CODES.NO_ELIGIBLE_ACCOUNTS]: {
         title: __("No eligible accounts"),
-        userMessage: (institution2) => __(
-          "Only checking or savings accounts can be used for transfers. If you have one at %1, make sure to select it when connecting. Otherwise, try connecting a different institution.",
-          institution2.name
-        ),
         primaryAction: {
           label: __("Log in again"),
           action: () => dispatch({ type: ActionTypes$2.ACTIONABLE_ERROR_LOG_IN_AGAIN })
@@ -72190,7 +72204,7 @@ const ActionableError = () => {
           style: styles.paragraph,
           truncate: false,
           variant: "Paragraph",
-          children: messagingMap[jobDetailCode].userMessage(institution)
+          children: currentMember.error.user_message
         }
       )
     ] }),
@@ -76179,6 +76193,9 @@ const ManualAccountForm = React__default.forwardRef(
     useAnalyticsPath(name, path);
     const { api } = useApi();
     const members = useSelector(getMembers);
+    const clientLocale = useMemo(() => {
+      return document.querySelector("html")?.getAttribute("lang") || "en";
+    }, [document.querySelector("html")?.getAttribute("lang")]);
     const [saving, setSaving] = useState(false);
     const [isPersonal, setIsPersonal] = useState(true);
     const [returnField, setReturnField] = useState(null);
@@ -76266,7 +76283,7 @@ const ManualAccountForm = React__default.forwardRef(
             return of(addManualAccountSuccess(savedAccount));
           }
           return zip(
-            from(api.loadMemberByGuid(savedAccount.member_guid)),
+            from(api.loadMemberByGuid(savedAccount.member_guid, clientLocale)),
             from(api.loadInstitutionByGuid(savedAccount.institution_guid))
           ).pipe(
             map(([loadedMember, loadedInstitution]) => {
@@ -77519,8 +77536,8 @@ const RenderConnectStep = (props) => {
       }
     );
   } else if (step === STEPS.ACTIONABLE_ERROR) {
-    const jobDetailCode = currentMember?.most_recent_job_detail_code ?? null;
-    connectStepView = canHandleActionableError(jobDetailCode) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ActionableError, {}) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+    const errorCode = currentMember?.error?.error_code ?? null;
+    connectStepView = canHandleActionableError(errorCode) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ActionableError, {}) : /* @__PURE__ */ jsxRuntimeExports.jsx(
       LoginError,
       {
         institution: selectedInstitution,
@@ -79436,6 +79453,9 @@ const getErrorResource = (err) => {
 const useLoadConnect = () => {
   const { api } = useApi();
   const profiles = useSelector((state) => state.profiles);
+  const clientLocale = useMemo(() => {
+    return document.querySelector("html")?.getAttribute("lang") || "en";
+  }, [document.querySelector("html")?.getAttribute("lang")]);
   const [config, setConfig] = useState({});
   const dispatch = useDispatch();
   const loadConnect = useCallback((config2) => setConfig(config2), [config]);
@@ -79445,7 +79465,7 @@ const useLoadConnect = () => {
     dispatch(loadConnect$1(config));
     let request$;
     if (config.current_member_guid) {
-      request$ = loadConnectFromMemberConfig(config, api);
+      request$ = loadConnectFromMemberConfig(config, api, clientLocale);
     } else if (config.current_institution_guid || config.current_institution_code) {
       request$ = loadConnectFromInstitutionConfig(config, api);
     } else if (config.mode === VERIFY_MODE && config.current_microdeposit_guid) {
@@ -79456,9 +79476,9 @@ const useLoadConnect = () => {
     const requestSubscription$ = request$.pipe(
       mergeMap((dependencies) => {
         if (clientSupportRequestedProducts(config, profiles.clientProfile)) {
-          return from(api.loadMembers()).pipe(
+          return from(api.loadMembers(clientLocale)).pipe(
             map(
-              (members) => loadConnectSuccess$1({
+              (members = []) => loadConnectSuccess$1({
                 members,
                 widgetProfile: profiles.widgetProfile,
                 ...dependencies
@@ -79511,8 +79531,8 @@ const useLoadConnect = () => {
   }, [config]);
   return { loadConnect };
 };
-function loadConnectFromMemberConfig(config, api) {
-  return from(api.loadMemberByGuid(config.current_member_guid)).pipe(
+function loadConnectFromMemberConfig(config, api, clientLocale) {
+  return from(api.loadMemberByGuid(config.current_member_guid, clientLocale)).pipe(
     mergeMap((member) => {
       return defer(() => api.loadInstitutionByGuid(member.institution_guid)).pipe(
         map((institution) => {
@@ -80208,7 +80228,7 @@ const frCa = {
 	"Enter account number": "Entrer le numéro de compte",
 	Recommended: Recommended$1,
 	Manual: Manual$1,
-	"Select an account": "Sélectionner un compte",
+	"Account selection": "Sélection du compte",
 	"Loading …": "Chargement …",
 	"Load more institutions": "Charger plus d'institutions",
 	"Log in at %1": "Connectez-vous à %1",
@@ -80328,11 +80348,9 @@ const frCa = {
 	"Log in again": "Connectez-vous à nouveau",
 	"Connect a different institution": "Mettre en relation un autre établissement",
 	"No eligible accounts": "Aucun compte admissible",
-	"Only checking or savings accounts can be used for transfers. If you have one at %1, make sure to select it when connecting. Otherwise, try connecting a different institution.": "Seuls les comptes chèques ou d’épargne peuvent être utilisés pour les transferts. Si vous en avez un à %1, assurez-vous de le sélectionner lors de la connexion. Sinon, essayez de connecter une autre institution.",
 	Required: Required$1,
 	"Add financial management?": "Ajouter la gestion financière ?",
 	"Yes, add financial management": "Oui, ajoutez la gestion financière",
-	"No, just transfers and payment": "Non, juste des virements et des paiements",
 	"Add transfers and payments?": "Ajouter des transferts et des paiements ?",
 	"Yes, add transfers and payments": "Oui, ajouter des transferts et des paiements",
 	"Select an account to connect": "Sélectionnez un compte pour vous connecter",
@@ -80703,7 +80721,7 @@ const es = {
 	"Enter account number": "Ingrese el número de cuenta",
 	Recommended: Recommended,
 	Manual: Manual,
-	"Select an account": "Seleccione una cuenta",
+	"Account selection": "Selección de cuenta",
 	"Loading …": "Cargando …",
 	"Load more institutions": "Cargar más instituciones",
 	"Log in at %1": "Iniciar sesión en %1",
@@ -80825,7 +80843,6 @@ const es = {
 	"Log in again": "Inicie sesión nuevamente",
 	"Connect a different institution": "Conecte una institución diferente",
 	"No eligible accounts": "No hay cuentas elegibles",
-	"Only checking or savings accounts can be used for transfers. If you have one at %1, make sure to select it when connecting. Otherwise, try connecting a different institution.": "Solo se pueden usar cuentas de control o ahorro para transferencias. Si tiene uno en %1, asegúrese de seleccionarlo al conectarlo. De lo contrario, intente conectar una institución diferente.",
 	Required: Required,
 	"Add financial management?": "¿Añadir gestión financiera?",
 	"Yes, add financial management": "Sí, añadir gestión financiera",