1 files changed, 22 insertions, 12 deletions
diff --git a/packages/demobank-ui/src/pages/admin/AccountList.tsx b/packages/demobank-ui/src/pages/admin/AccountList.tsx
index a6899e679..8a1e8294a 100644
--- a/packages/demobank-ui/src/pages/admin/AccountList.tsx
+++ b/packages/demobank-ui/src/pages/admin/AccountList.tsx
@@ -1,10 +1,12 @@
-import { h, VNode } from "preact";
-import { useBusinessAccounts } from "../../hooks/circuit.js";
-import { handleNotOkResult } from "../HomePage.js";
-import { AccountAction } from "./Home.js";
-import { Amounts } from "@gnu-taler/taler-util";
+import { Amounts, TalerError } from "@gnu-taler/taler-util";
 import { useTranslationContext } from "@gnu-taler/web-util/browser";
+import { VNode, h } from "preact";
+import { ErrorLoading } from "../../components/ErrorLoading.js";
+import { Loading } from "../../components/Loading.js";
+import { useBusinessAccounts } from "../../hooks/circuit.js";
+import { assertUnreachable } from "../HomePage.js";
 import { RenderAmount } from "../PaytoWireTransferForm.js";
+import { AccountAction } from "./Home.js";
 
 interface Props {
   onAction: (type: AccountAction, account: string) => void;
@@ -13,15 +15,23 @@ interface Props {
 }
 
 export function AccountList({ account, onAction, onCreateAccount }: Props): VNode {
-  const result = useBusinessAccounts({ account });
+  const result = useBusinessAccounts();
   const { i18n } = useTranslationContext();
 
-  if (result.loading) return <div />;
-  if (!result.ok) {
-    return handleNotOkResult(i18n)(result);
+  if (!result) {
+    return <Loading />
+  }
+  if (result instanceof TalerError) {
+    return <ErrorLoading error={result} />
+  }
+  if (result.data.type === "fail") {
+    switch (result.data.case) {
+      case "unauthorized": return <div>un auth</div>
+      default: assertUnreachable(result.data.case)
+    }
   }
 
-  const { customers } = result.data;
+  const { accounts } = result.data.body;
   return <div class="px-4 sm:px-6 lg:px-8">
     <div class="sm:flex sm:items-center">
       <div class="sm:flex-auto">
@@ -45,7 +55,7 @@ export function AccountList({ account, onAction, onCreateAccount }: Props): VNod
     <div class="mt-8 flow-root">
       <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
         <div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
-          {!customers.length ? (
+          {!accounts.length ? (
             <div></div>
           ) : (
             <table class="min-w-full divide-y divide-gray-300">
@@ -60,7 +70,7 @@ export function AccountList({ account, onAction, onCreateAccount }: Props): VNod
                 </tr>
               </thead>
               <tbody class="divide-y divide-gray-200">
-                {customers.map((item, idx) => {
+                {accounts.map((item, idx) => {
                   const balance = !item.balance
                     ? undefined
                     : Amounts.parse(item.balance.amount);