integrate bank into the new taler-util API

1 files changed, 20 insertions, 16 deletions

diff --git a/packages/demobank-ui/src/pages/BankFrame.tsx b/packages/demobank-ui/src/pages/BankFrame.tsx
index 6ab6ba3e4..c75964f8e 100644
--- a/packages/demobank-ui/src/pages/BankFrame.tsx
+++ b/packages/demobank-ui/src/pages/BankFrame.tsx
@@ -14,7 +14,7 @@
  GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
  */
 
-import { Amounts, Logger, TranslatedString, parsePaytoUri } from "@gnu-taler/taler-util";
+import { Amounts, Logger, TalerError, TranslatedString, parsePaytoUri } from "@gnu-taler/taler-util";
 import { notifyError, notifyException, useNotifications, useTranslationContext } from "@gnu-taler/web-util/browser";
 import { ComponentChildren, Fragment, VNode, h } from "preact";
 import { useEffect, useErrorBoundary, useState } from "preact/hooks";
@@ -27,6 +27,7 @@ import { useAccountDetails } from "../hooks/access.js";
 import { useSettings } from "../hooks/settings.js";
 import { bankUiSettings } from "../settings.js";
 import { RenderAmount } from "./PaytoWireTransferForm.js";
+import { Loading } from "../components/Loading.js";
 
 const GIT_HASH = typeof __GIT_HASH__ !== "undefined" ? __GIT_HASH__ : undefined;
 const VERSION = typeof __VERSION__ !== "undefined" ? __VERSION__ : undefined;
@@ -237,7 +238,6 @@ export function BankFrame({
                                       </span>
                                     </span>
                                     <button type="button" data-enabled={settings.showDebugInfo} class="bg-indigo-600 data-[enabled=false]:bg-gray-200 relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2" role="switch" aria-checked="false" aria-labelledby="availability-label" aria-describedby="availability-description"
-
                                       onClick={() => {
                                         updateSettings("showDebugInfo", !settings.showDebugInfo);
                                       }}>
@@ -346,14 +346,6 @@ function StatusBanner(): VNode {
               </div>
             }
             <MaybeShowDebugInfo info={n.message.debug} />
-            {/* <a href="#" class="text-gray-500">
-                show debug info
-              </a>
-              {n.message.debug &&
-                <div class="mt-2 text-sm text-red-700 font-mono break-all">
-                  {n.message.debug}
-                </div>
-              } */}
           </Attention>
         case "info":
           return <Attention type="success" title={n.message.title} onClose={() => {
@@ -411,16 +403,22 @@ function WelcomeAccount({ account }: { account: string }): VNode {
   const { i18n } = useTranslationContext();
 
   const result = useAccountDetails(account);
-  if (!result.ok) return <div />
+  if (!result) {
+    return <Loading />
+  }
+  if (result instanceof TalerError) {
+    return <div />
+  }
+  if (result.type === "fail") return <div />
 
-  const payto = parsePaytoUri(result.data.payto_uri)
+  const payto = parsePaytoUri(result.body.payto_uri)
   if (!payto) return <div />
 
   const accountNumber = !payto.isKnown ? undefined : payto.targetType === "iban" ? payto.iban : payto.targetType === "x-taler-bank" ? payto.account : undefined;
   return <i18n.Translate>
     Welcome,  {account} {accountNumber !== undefined ?
       <span>
-        (<a href={result.data.payto_uri}>{accountNumber}</a> <CopyButton getContent={() => result.data.payto_uri} />)
+        (<a href={result.body.payto_uri}>{accountNumber}</a> <CopyButton getContent={() => result.body.payto_uri} />)
       </span>
       : <Fragment />}!
   </i18n.Translate>
@@ -429,10 +427,16 @@ function WelcomeAccount({ account }: { account: string }): VNode {
 
 function AccountBalance({ account }: { account: string }): VNode {
   const result = useAccountDetails(account);
-  if (!result.ok) return <div />
+  if (!result) {
+    return <Loading />
+  }
+  if (result instanceof TalerError) {
+    return <div />
+  }
+  if (result.type === "fail") return <div />
 
   return <RenderAmount
-    value={Amounts.parseOrThrow(result.data.balance.amount)}
-    negative={result.data.balance.credit_debit_indicator === "debit"}
+    value={Amounts.parseOrThrow(result.body.balance.amount)}
+    negative={result.body.balance.credit_debit_indicator === "debit"}
   />
 }