calculation async

packages/demobank-ui/src/pages/BusinessAccount.tsx

@@ -26,7 +26,7 @@ import {
   useTranslationContext,
 } from "@gnu-taler/web-util/lib/index.browser";
 import { Fragment, h, VNode } from "preact";
-import { useEffect, useState } from "preact/hooks";
+import { useEffect, useMemo, useState } from "preact/hooks";
 import { Cashouts } from "../components/Cashouts/index.js";
 import { useBackendContext } from "../context/backend.js";
 import { ErrorMessage, usePageContext } from "../context/pageState.js";
@@ -246,6 +246,8 @@ function CreateCashout({
     ? Amounts.sub(debitThreshold, balance).amount
     : Amounts.add(balance, debitThreshold).amount;
 
+  const zeroCalc = { debit: zero, credit: zero, beforeFee: zero };
+  const [calc, setCalc] = useState(zeroCalc);
   const sellRate = config.ratios_and_fees.sell_at_ratio;
   const sellFee = !config.ratios_and_fees.sell_out_fee
     ? zero
@@ -256,11 +258,21 @@ function CreateCashout({
 
   const amount = Amounts.parse(`${balance.currency}:${form.amount}`);
 
-  const calc = !amount
-    ? { debit: zero, credit: zero, beforeFee: zero }
-    : !form.isDebit
-    ? calculateFromCredit(amount, sellFee, sellRate)
-    : calculateFromDebit(amount, sellFee, sellRate);
+  useEffect(() => {
+    if (!amount) {
+      setCalc(zeroCalc);
+    } else {
+      if (form.isDebit) {
+        calculateFromDebit(amount, sellFee, sellRate).then((r) => {
+          setCalc(r);
+        });
+      } else {
+        calculateFromCredit(amount, sellFee, sellRate).then((r) => {
+          setCalc(r);
+        });
+      }
+    }
+  }, [form.amount, form.isDebit]);
 
   const balanceAfter = Amounts.sub(balance, calc.debit).amount;
 
@@ -836,11 +848,11 @@ type TransferCalculation = {
   beforeFee: AmountJson;
 };
 
-function calculateFromDebit(
+async function calculateFromDebit(
   amount: AmountJson,
   sellFee: AmountJson,
   sellRate: number,
-): TransferCalculation {
+): Promise<TransferCalculation> {
   const debit = amount;
 
   const beforeFee = truncate(Amounts.divide(debit, 1 / sellRate));
@@ -849,11 +861,11 @@ function calculateFromDebit(
   return { debit, credit, beforeFee };
 }
 
-function calculateFromCredit(
+async function calculateFromCredit(
   amount: AmountJson,
   sellFee: AmountJson,
   sellRate: number,
-): TransferCalculation {
+): Promise<TransferCalculation> {
   const credit = amount;
 
   const beforeFee = Amounts.add(credit, sellFee).amount;