more no enough balance description

2 files changed, 160 insertions, 11 deletions

diff --git a/packages/taler-wallet-webextension/src/cta/Payment/stories.tsx b/packages/taler-wallet-webextension/src/cta/Payment/stories.tsx
index b63190236..2ac3ab57d 100644
--- a/packages/taler-wallet-webextension/src/cta/Payment/stories.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Payment/stories.tsx
@@ -36,16 +36,106 @@ export default {
   argTypes: {},
 };
 
-export const NoBalance = tests.createExample(BaseView, {
-  status: "no-balance-for-currency",
+export const NoEnoughBalanceAvailable = tests.createExample(BaseView, {
+  status: "no-enough-balance",
+  error: undefined,
+  amount: Amounts.parseOrThrow("USD:10"),
+  balance: {
+    currency: "USD",
+    fraction: 40000000,
+    value: 12,
+  },
+
+  uri: "",
+  payStatus: {
+    status: PreparePayResultType.InsufficientBalance,
+    balanceDetails: {
+      amountRequested: "USD:10",
+      balanceAvailable: "USD:9",
+      balanceMaterial: "USD:9",
+      balanceAgeAcceptable: "USD:9",
+      balanceMerchantAcceptable: "USD:9",
+      balanceMerchantDepositable: "USD:9",
+      feeGapEstimate: "USD:1",
+    },
+    talerUri: "taler://pay/..",
+    noncePriv: "",
+    proposalId: "96YY92RQZGF3V7TJSPN4SF9549QX7BRF88Q5PYFCSBNQ0YK4RPK0",
+    contractTerms: {
+      merchant: {
+        name: "the merchant",
+        logo: merchantIcon,
+        website: "https://www.themerchant.taler",
+        email: "contact@merchant.taler",
+      },
+      summary: "some beers",
+      amount: "USD:10",
+    } as Partial<ContractTerms> as any,
+    amountRaw: "USD:10",
+  },
+});
+
+export const NoEnoughBalanceMaterial = tests.createExample(BaseView, {
+  status: "no-enough-balance",
+  error: undefined,
+  amount: Amounts.parseOrThrow("USD:10"),
+  balance: {
+    currency: "USD",
+    fraction: 40000000,
+    value: 12,
+  },
+
+  uri: "",
+  payStatus: {
+    status: PreparePayResultType.InsufficientBalance,
+    balanceDetails: {
+      amountRequested: "USD:10",
+      balanceAvailable: "USD:10",
+      balanceMaterial: "USD:9",
+      balanceAgeAcceptable: "USD:9",
+      balanceMerchantAcceptable: "USD:9",
+      balanceMerchantDepositable: "USD:0",
+      feeGapEstimate: "USD:1",
+    },
+    talerUri: "taler://pay/..",
+    noncePriv: "",
+    proposalId: "96YY92RQZGF3V7TJSPN4SF9549QX7BRF88Q5PYFCSBNQ0YK4RPK0",
+    contractTerms: {
+      merchant: {
+        name: "the merchant",
+        logo: merchantIcon,
+        website: "https://www.themerchant.taler",
+        email: "contact@merchant.taler",
+      },
+      summary: "some beers",
+      amount: "USD:10",
+    } as Partial<ContractTerms> as any,
+    amountRaw: "USD:10",
+  },
+});
+
+export const NoEnoughBalanceAgeAcceptable = tests.createExample(BaseView, {
+  status: "no-enough-balance",
   error: undefined,
   amount: Amounts.parseOrThrow("USD:10"),
-  balance: undefined,
+  balance: {
+    currency: "USD",
+    fraction: 40000000,
+    value: 12,
+  },
 
   uri: "",
   payStatus: {
     status: PreparePayResultType.InsufficientBalance,
-    balanceDetails: {} as any,
+    balanceDetails: {
+      amountRequested: "USD:10",
+      balanceAvailable: "USD:10",
+      balanceMaterial: "USD:10",
+      balanceAgeAcceptable: "USD:9",
+      balanceMerchantAcceptable: "USD:9",
+      balanceMerchantDepositable: "USD:9",
+      feeGapEstimate: "USD:1",
+    },
     talerUri: "taler://pay/..",
     noncePriv: "",
     proposalId: "96YY92RQZGF3V7TJSPN4SF9549QX7BRF88Q5PYFCSBNQ0YK4RPK0",
@@ -56,6 +146,7 @@ export const NoBalance = tests.createExample(BaseView, {
         website: "https://www.themerchant.taler",
         email: "contact@merchant.taler",
       },
+      minimum_age: 18,
       summary: "some beers",
       amount: "USD:10",
     } as Partial<ContractTerms> as any,
@@ -63,20 +154,28 @@ export const NoBalance = tests.createExample(BaseView, {
   },
 });
 
-export const NoEnoughBalance = tests.createExample(BaseView, {
+export const NoEnoughBalanceMerchantAcceptable = tests.createExample(BaseView, {
   status: "no-enough-balance",
   error: undefined,
   amount: Amounts.parseOrThrow("USD:10"),
   balance: {
     currency: "USD",
     fraction: 40000000,
-    value: 9,
+    value: 12,
   },
 
   uri: "",
   payStatus: {
     status: PreparePayResultType.InsufficientBalance,
-    balanceDetails: {} as any,
+    balanceDetails: {
+      amountRequested: "USD:10",
+      balanceAvailable: "USD:10",
+      balanceMaterial: "USD:10",
+      balanceAgeAcceptable: "USD:10",
+      balanceMerchantAcceptable: "USD:9",
+      balanceMerchantDepositable: "USD:9",
+      feeGapEstimate: "USD:1",
+    },
     talerUri: "taler://pay/..",
     noncePriv: "",
     proposalId: "96YY92RQZGF3V7TJSPN4SF9549QX7BRF88Q5PYFCSBNQ0YK4RPK0",
@@ -94,20 +193,70 @@ export const NoEnoughBalance = tests.createExample(BaseView, {
   },
 });
 
-export const EnoughBalanceButRestricted = tests.createExample(BaseView, {
+export const NoEnoughBalanceMerchantDepositable = tests.createExample(
+  BaseView,
+  {
+    status: "no-enough-balance",
+    error: undefined,
+    amount: Amounts.parseOrThrow("USD:10"),
+    balance: {
+      currency: "USD",
+      fraction: 40000000,
+      value: 12,
+    },
+
+    uri: "",
+    payStatus: {
+      status: PreparePayResultType.InsufficientBalance,
+      balanceDetails: {
+        amountRequested: "USD:10",
+        balanceAvailable: "USD:10",
+        balanceMaterial: "USD:10",
+        balanceAgeAcceptable: "USD:10",
+        balanceMerchantAcceptable: "USD:10",
+        balanceMerchantDepositable: "USD:9",
+        feeGapEstimate: "USD:1",
+      },
+      talerUri: "taler://pay/..",
+      noncePriv: "",
+      proposalId: "96YY92RQZGF3V7TJSPN4SF9549QX7BRF88Q5PYFCSBNQ0YK4RPK0",
+      contractTerms: {
+        merchant: {
+          name: "the merchant",
+          logo: merchantIcon,
+          website: "https://www.themerchant.taler",
+          email: "contact@merchant.taler",
+        },
+        summary: "some beers",
+        amount: "USD:10",
+      } as Partial<ContractTerms> as any,
+      amountRaw: "USD:10",
+    },
+  },
+);
+
+export const NoEnoughBalanceFeeGap = tests.createExample(BaseView, {
   status: "no-enough-balance",
   error: undefined,
   amount: Amounts.parseOrThrow("USD:10"),
   balance: {
     currency: "USD",
     fraction: 40000000,
-    value: 19,
+    value: 12,
   },
 
   uri: "",
   payStatus: {
     status: PreparePayResultType.InsufficientBalance,
-    balanceDetails: {} as any,
+    balanceDetails: {
+      amountRequested: "USD:10",
+      balanceAvailable: "USD:10",
+      balanceMaterial: "USD:10",
+      balanceAgeAcceptable: "USD:10",
+      balanceMerchantAcceptable: "USD:10",
+      balanceMerchantDepositable: "USD:10",
+      feeGapEstimate: "USD:1",
+    },
     talerUri: "taler://pay/..",
     noncePriv: "",
     proposalId: "96YY92RQZGF3V7TJSPN4SF9549QX7BRF88Q5PYFCSBNQ0YK4RPK0",
@@ -118,6 +267,7 @@ export const EnoughBalanceButRestricted = tests.createExample(BaseView, {
         website: "https://www.themerchant.taler",
         email: "contact@merchant.taler",
       },
+      minimum_age: 18,
       summary: "some beers",
       amount: "USD:10",
     } as Partial<ContractTerms> as any,
diff --git a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx
index 53bc0c95f..f5a354786 100644
--- a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx
@@ -105,7 +105,6 @@ export function BaseView(state: SupportedStates): VNode {
       </section>
       <PaymentButtons
         amount={state.amount}
-        balance={state.balance}
         payStatus={state.payStatus}
         uri={state.uri}
         payHandler={state.status === "ready" ? state.payHandler : undefined}