diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index cecca0bb1..b26323396 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -81,7 +81,26 @@ const App = () => { method: "POST", }); if (!response.ok) { - dispatch({ type: "SET_STATE", state: { linkToken: null } }); + let errorDetail; + try { + const data = await response.json(); + errorDetail = data.error || { + error_code: data.error_code || "UNKNOWN", + error_type: data.error_type || "API_ERROR", + error_message: + data.error_message || `Request failed with status ${response.status}`, + }; + } catch { + errorDetail = { + error_code: "UNKNOWN", + error_type: "API_ERROR", + error_message: `Request failed with status ${response.status}`, + }; + } + dispatch({ + type: "SET_STATE", + state: { linkToken: null, linkTokenError: errorDetail }, + }); return; } const data = await response.json(); diff --git a/frontend/src/Components/Error/index.tsx b/frontend/src/Components/Error/index.tsx index 9c8b04746..b49d49c78 100644 --- a/frontend/src/Components/Error/index.tsx +++ b/frontend/src/Components/Error/index.tsx @@ -2,6 +2,8 @@ import React, { useEffect, useState } from "react"; import Button from "plaid-threads/Button"; import Note from "plaid-threads/Note"; +import InlineLink from "plaid-threads/InlineLink"; + import { ErrorDataItem } from "../../dataUtilities"; import styles from "./index.module.scss"; @@ -68,6 +70,39 @@ const Error = (props: Props) => { + {props.error.error_code === "INVALID_LINK_CUSTOMIZATION" && ( +
+ + Tip: In the{" "} + + dashboard under Link > Link Customization Data Transparency + Messaging + + , ensure at least one use case is selected. After selecting a use + case, make sure to click Publish Changes. + +
+ )} + {props.error.error_code === "INSTITUTION_REGISTRATION_REQUIRED" && ( +
+ + Certain OAuth institutions, including Bank of America, Chase, + Capital One, and American Express, may take up to 24 hours to + become available after obtaining Production access. PNC and Charles + Schwab require a{" "} + + special registration process + {" "} + to access Production data. + +
+ )}