diff options
Diffstat (limited to 'packages/frontend/src/paths/instance/reserves/details/DetailPage.tsx')
| -rw-r--r-- | packages/frontend/src/paths/instance/reserves/details/DetailPage.tsx | 107 |
1 files changed, 51 insertions, 56 deletions
diff --git a/packages/frontend/src/paths/instance/reserves/details/DetailPage.tsx b/packages/frontend/src/paths/instance/reserves/details/DetailPage.tsx index 08942f6..06fbf20 100644 --- a/packages/frontend/src/paths/instance/reserves/details/DetailPage.tsx +++ b/packages/frontend/src/paths/instance/reserves/details/DetailPage.tsx @@ -20,22 +20,16 @@ */ import { Amounts } from "@gnu-taler/taler-util"; -import { format, isAfter } from "date-fns"; +import { format } from "date-fns"; import { Fragment, h, VNode } from "preact"; -import { useState } from "preact/hooks"; import { FormProvider } from "../../../../components/form/FormProvider"; import { Input } from "../../../../components/form/Input"; import { InputCurrency } from "../../../../components/form/InputCurrency"; import { InputDate } from "../../../../components/form/InputDate"; -import { InputDuration } from "../../../../components/form/InputDuration"; -import { InputGroup } from "../../../../components/form/InputGroup"; -import { InputLocation } from "../../../../components/form/InputLocation"; -import { NotificationCard } from "../../../../components/menu"; -import { ProductList } from "../../../../components/product/ProductList"; +import { TextField } from "../../../../components/form/TextField"; import { MerchantBackend } from "../../../../declaration"; import { useTipDetails } from "../../../../hooks/tips"; import { Translate, useTranslator } from "../../../../i18n"; -import { mergeRefunds } from "../../../../utils/amount"; type Entity = MerchantBackend.Tips.ReserveDetail; type CT = MerchantBackend.ContractTerms @@ -49,59 +43,60 @@ interface Props { export function DetailPage({ id, selected, onBack }: Props): VNode { const i18n = useTranslator() const didExchangeAckTransfer = Amounts.isNonZero(Amounts.parseOrThrow(selected.exchange_initial_amount)) - return <div class="section main-section"> - <FormProvider object={{ ...selected, id }} valueHandler={null} > - <InputDate<Entity> name="creation_time" label={i18n`Created at`} readonly /> - <InputDate<Entity> name="expiration_time" label={i18n`Valid until`} readonly /> - <InputCurrency<Entity> name="merchant_initial_amount" label={i18n`Created balance`} readonly /> - <Input<Entity> name="exchange_url" label={i18n`Exchange URL`} readonly /> - - {didExchangeAckTransfer && <Fragment> - <InputCurrency<Entity> name="exchange_initial_amount" label={i18n`Exchange balance`} readonly /> - <InputCurrency<Entity> name="pickup_amount" label={i18n`Picked up`} readonly /> - <InputCurrency<Entity> name="committed_amount" label={i18n`Committed`} readonly /> - </Fragment> - } - <Input<Entity> name="payto_uri" label={i18n`Account address`} readonly /> - <Input name="id" label={i18n`Subject`} readonly /> - </FormProvider> - - {didExchangeAckTransfer ? <Fragment> - <div class="card has-table"> - <header class="card-header"> - <p class="card-header-title"> - <span class="icon"><i class="mdi mdi-cash-register" /></span> - <Translate>Tips</Translate> - </p> - - </header> - <div class="card-content"> - <div class="b-table has-pagination"> - <div class="table-wrapper has-mobile-cards"> - {selected.tips && selected.tips.length > 0 ? <Table tips={selected.tips} /> : <EmptyTable />} - </div></div> - </div> - </div> - </Fragment> : <Fragment> - <p class="is-size-5"><Translate>Now you should transfer to the exchange into the account address indicated above and the transaction must carry the subject message.</Translate></p> - - <p class="is-size-5"><Translate>For example :</Translate></p> - <pre> - {selected.payto_uri}?message={id}&amount={selected.merchant_initial_amount} - </pre> - </Fragment> - } - - <div class="columns"> - <div class="column" /> - <div class="column is-two-thirds"> + return <div class="columns"> + <div class="column" /> + <div class="column is-four-fifths"> + <div class="section main-section"> + <FormProvider object={{ ...selected, id }} valueHandler={null} > + <InputDate<Entity> name="creation_time" label={i18n`Created at`} readonly /> + <InputDate<Entity> name="expiration_time" label={i18n`Valid until`} readonly /> + <InputCurrency<Entity> name="merchant_initial_amount" label={i18n`Created balance`} readonly /> + <TextField<Entity> name="exchange_url" label={i18n`Exchange URL`} readonly > + <a target="_blank" href={selected.exchange_url}>{selected.exchange_url}</a> + </TextField> + + {didExchangeAckTransfer && <Fragment> + <InputCurrency<Entity> name="exchange_initial_amount" label={i18n`Exchange balance`} readonly /> + <InputCurrency<Entity> name="pickup_amount" label={i18n`Picked up`} readonly /> + <InputCurrency<Entity> name="committed_amount" label={i18n`Committed`} readonly /> + </Fragment> + } + <Input<Entity> name="payto_uri" label={i18n`Account address`} readonly /> + <Input name="id" label={i18n`Subject`} readonly /> + </FormProvider> + + {didExchangeAckTransfer ? <Fragment> + <div class="card has-table"> + <header class="card-header"> + <p class="card-header-title"> + <span class="icon"><i class="mdi mdi-cash-register" /></span> + <Translate>Tips</Translate> + </p> + + </header> + <div class="card-content"> + <div class="b-table has-pagination"> + <div class="table-wrapper has-mobile-cards"> + {selected.tips && selected.tips.length > 0 ? <Table tips={selected.tips} /> : <EmptyTable />} + </div></div> + </div> + </div> + </Fragment> : <Fragment> + <p class="is-size-5"><Translate>Now you should transfer to the exchange into the account address indicated above and the transaction must carry the subject message.</Translate></p> + <p class="is-size-5"><Translate>For example :</Translate></p> + <pre> + {selected.payto_uri}?message={id}&amount={selected.merchant_initial_amount} + </pre> + </Fragment> + } + <div class="buttons is-right mt-5"> <button class="button" onClick={onBack}><Translate>Back</Translate></button> </div> + </div> - <div class="column" /> </div> - + <div class="column" /> </div> } |