From 977296361c437a303324ad269d80a3c450ddb5fc Mon Sep 17 00:00:00 2001
From: Matiss Janis Aboltins <matiss@mja.lv>
Date: Mon, 1 May 2023 18:32:48 +0100
Subject: [PATCH] :bug: (nordigen) bank-list error handling (#969)

Improving error handling for Nordigen.

Before: if loading banks failed - a loading indicator would be shown
forever.

After: is loading banks fails - an error message is shown.
---
 .../components/modals/NordigenExternalMsg.js  | 34 +++++++++++++++----
 upcoming-release-notes/969.md                 |  6 ++++
 2 files changed, 33 insertions(+), 7 deletions(-)
 create mode 100644 upcoming-release-notes/969.md

diff --git a/packages/desktop-client/src/components/modals/NordigenExternalMsg.js b/packages/desktop-client/src/components/modals/NordigenExternalMsg.js
index 662997ebb..1537bd92a 100644
--- a/packages/desktop-client/src/components/modals/NordigenExternalMsg.js
+++ b/packages/desktop-client/src/components/modals/NordigenExternalMsg.js
@@ -1,6 +1,6 @@
 import React, { useEffect, useState, useRef } from 'react';
 
-import { send } from 'loot-core/src/platform/client/fetch';
+import { send, sendCatch } from 'loot-core/src/platform/client/fetch';
 
 import AnimatedLoading from '../../icons/AnimatedLoading';
 import { colors } from '../../style';
@@ -14,9 +14,12 @@ import { COUNTRY_OPTIONS } from './countries';
 function useAvailableBanks(country) {
   const [banks, setBanks] = useState([]);
   const [isLoading, setIsLoading] = useState(false);
+  const [isError, setIsError] = useState(false);
 
   useEffect(() => {
     async function fetch() {
+      setIsError(false);
+
       if (!country) {
         setBanks([]);
         setIsLoading(false);
@@ -25,9 +28,15 @@ function useAvailableBanks(country) {
 
       setIsLoading(true);
 
-      const results = await send('nordigen-get-banks', country);
+      const { data, error } = await sendCatch('nordigen-get-banks', country);
+
+      if (error) {
+        setIsError(true);
+        setBanks([]);
+      } else {
+        setBanks(data);
+      }
 
-      setBanks(results);
       setIsLoading(false);
     }
 
@@ -37,6 +46,7 @@ function useAvailableBanks(country) {
   return {
     data: banks,
     isLoading,
+    isError,
   };
 }
 
@@ -86,8 +96,11 @@ export default function NordigenExternalMsg({
   let [error, setError] = useState(null);
   let data = useRef(null);
 
-  const { data: bankOptions, isLoading: isBankOptionsLoading } =
-    useAvailableBanks(country);
+  const {
+    data: bankOptions,
+    isLoading: isBankOptionsLoading,
+    isError: isBankOptionError,
+  } = useAvailableBanks(country);
   const { configured: isConfigured, isLoading: isConfigurationLoading } =
     useNordigenStatus();
 
@@ -134,7 +147,13 @@ export default function NordigenExternalMsg({
           />
         </FormField>
 
-        {country &&
+        {isBankOptionError ? (
+          <Error>
+            Failed loading available banks: Nordigen access credentials might be
+            misconfigured. Please set them up again.
+          </Error>
+        ) : (
+          country &&
           (isBankOptionsLoading ? (
             'Loading banks...'
           ) : (
@@ -153,7 +172,8 @@ export default function NordigenExternalMsg({
                 }}
               />
             </FormField>
-          ))}
+          ))
+        )}
 
         <Warning>
           By enabling bank-sync, you will be granting Nordigen (a third party
diff --git a/upcoming-release-notes/969.md b/upcoming-release-notes/969.md
new file mode 100644
index 000000000..2e6960296
--- /dev/null
+++ b/upcoming-release-notes/969.md
@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [MatissJanis]
+---
+
+Nordigen: improved error handling when bank-list API fails
-- 
GitLab