diff options
Diffstat (limited to 'packages')
6 files changed, 95 insertions, 28 deletions
diff --git a/packages/demobank-ui/src/components/Transactions/index.ts b/packages/demobank-ui/src/components/Transactions/index.ts index 618fcfb71..0c9084946 100644 --- a/packages/demobank-ui/src/components/Transactions/index.ts +++ b/packages/demobank-ui/src/components/Transactions/index.ts @@ -55,7 +55,7 @@ export interface Transaction { negative: boolean; counterpart: string; when: AbsoluteTime; - amount: AmountJson; + amount: AmountJson | undefined; subject: string; } diff --git a/packages/demobank-ui/src/components/Transactions/state.ts b/packages/demobank-ui/src/components/Transactions/state.ts index ac76e31e2..5d613c5d0 100644 --- a/packages/demobank-ui/src/components/Transactions/state.ts +++ b/packages/demobank-ui/src/components/Transactions/state.ts @@ -114,7 +114,7 @@ export function useComponentState({ accountLabel, pageNumber, balanceValue }: Pr const when: AbsoluteTime = { t_ms: date.getTime() } - const amount = Amounts.parseOrThrow(`${anyItem.currency}:${anyItem.amount}`); + const amount = Amounts.parse(`${anyItem.currency}:${anyItem.amount}`); const subject = anyItem.subject; return { negative, diff --git a/packages/demobank-ui/src/components/Transactions/views.tsx b/packages/demobank-ui/src/components/Transactions/views.tsx index b3683b743..1822f9d94 100644 --- a/packages/demobank-ui/src/components/Transactions/views.tsx +++ b/packages/demobank-ui/src/components/Transactions/views.tsx @@ -54,7 +54,13 @@ export function ReadyView({ transactions }: State.Ready): VNode { </td> <td> {item.negative ? "-" : ""} - {Amounts.stringifyValue(item.amount)} {item.amount.currency} + {item.amount ? ( + `${Amounts.stringifyValue(item.amount)} ${ + item.amount.currency + }` + ) : ( + <span style={{ color: "grey" }}><invalid value></span> + )} </td> <td>{item.counterpart}</td> <td>{item.subject}</td> diff --git a/packages/demobank-ui/src/pages/AccountPage.tsx b/packages/demobank-ui/src/pages/AccountPage.tsx index 5dd820b53..8d29bd933 100644 --- a/packages/demobank-ui/src/pages/AccountPage.tsx +++ b/packages/demobank-ui/src/pages/AccountPage.tsx @@ -174,7 +174,8 @@ function Account({ accountLabel }: { accountLabel: string }): VNode { } } } - const balance = !data ? undefined : Amounts.parseOrThrow(data.balance.amount); + const balance = !data ? undefined : Amounts.parse(data.balance.amount); + const errorParsingBalance = data && !balance; const accountNumber = !data ? undefined : getIbanFromPayto(data.paytoUri); const balanceIsDebit = data && data.balance.credit_debit_indicator == "debit"; @@ -216,28 +217,42 @@ function Account({ accountLabel }: { accountLabel: string }): VNode { </i18n.Translate> </h1> </div> - <section id="assets"> - <div class="asset-summary"> - <h2>{i18n.str`Bank account balance`}</h2> - {!balance ? ( - <div class="large-amount" style={{ color: "gray" }}> - Waiting server response... + + {errorParsingBalance ? ( + <div class="informational informational-fail" style={{ marginTop: 8 }}> + <div style={{ display: "flex", justifyContent: "space-between" }}> + <p> + <b>Server Error: invalid balance</b> + </p> + </div> + <p>Your account is in an invalid state.</p> + </div> + ) : ( + <Fragment> + <section id="assets"> + <div class="asset-summary"> + <h2>{i18n.str`Bank account balance`}</h2> + {!balance ? ( + <div class="large-amount" style={{ color: "gray" }}> + Waiting server response... + </div> + ) : ( + <div class="large-amount amount"> + {balanceIsDebit ? <b>-</b> : null} + <span class="value">{`${balanceValue}`}</span> + <span class="currency">{`${balance.currency}`}</span> + </div> + )} </div> - ) : ( - <div class="large-amount amount"> - {balanceIsDebit ? <b>-</b> : null} - <span class="value">{`${balanceValue}`}</span> - <span class="currency">{`${balance.currency}`}</span> + </section> + <section id="payments"> + <div class="payments"> + <h2>{i18n.str`Payments`}</h2> + <PaymentOptions currency={balance?.currency} /> </div> - )} - </div> - </section> - <section id="payments"> - <div class="payments"> - <h2>{i18n.str`Payments`}</h2> - <PaymentOptions currency={balance?.currency} /> - </div> - </section> + </section> + </Fragment> + )} <section id="main"> <article> <h2>{i18n.str`Latest transactions:`}</h2> diff --git a/packages/demobank-ui/src/stories.test.ts b/packages/demobank-ui/src/stories.test.ts new file mode 100644 index 000000000..f0b692ed2 --- /dev/null +++ b/packages/demobank-ui/src/stories.test.ts @@ -0,0 +1,50 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU Taler is free software; you can redistribute it and/or modify it under the + terms of the GNU General Public License as published by the Free Software + Foundation; either version 3, or (at your option) any later version. + + GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY + WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR + A PARTICULAR PURPOSE. See the GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along with + GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> + */ + +/** + * + * @author Sebastian Javier Marchano (sebasjm) + */ +import { setupI18n } from "@gnu-taler/taler-util"; +import { parseGroupImport } from "@gnu-taler/web-util/lib/index.browser"; + +import * as pages from "./pages/index.stories.js"; +import * as components from "./components/index.examples.js"; + +import { h as create } from "preact" +import { render as renderToString } from "preact-render-to-string"; + +setupI18n("en", { en: {} }); + + +describe("All the examples:", () => { + const cms = parseGroupImport({ pages, components }); + cms.forEach((group) => { + describe(`Example for group "${group.title}:"`, () => { + group.list.forEach((component) => { + describe(`Component ${component.name}:`, () => { + component.examples.forEach((example) => { + it(`should render example: ${example.name}`, () => { + const vdom = create(example.render.component, example.render.props) + const html = renderToString(vdom) + // console.log(html) + }); + }); + }); + }); + }); + }); +}); diff --git a/packages/demobank-ui/src/stories.tsx b/packages/demobank-ui/src/stories.tsx index a8ebcd867..54bda49a2 100644 --- a/packages/demobank-ui/src/stories.tsx +++ b/packages/demobank-ui/src/stories.tsx @@ -27,10 +27,6 @@ import { renderStories } from "@gnu-taler/web-util/lib/index.browser"; import "./scss/main.scss"; -function SortStories(a: any, b: any): number { - return (a?.order ?? 0) - (b?.order ?? 0); -} - function main(): void { renderStories( { pages, components }, |