packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

import { useTranslationContext } from "@gnu-taler/web-util/browser";
import { Fragment, VNode, h } from "preact";
import { Cashouts } from "../../components/Cashouts/index.js";
import { useBackendState } from "../../hooks/backend.js";
import { ProfileNavigation } from "../ProfileNavigation.js";
import { CreateCashout } from "../business/CreateCashout.js";

interface Props {
  account: string,
  onClose: () => void,
  onAuthorizationRequired: () => void,
  onSelected: (cid: number) => void
}

export function CashoutListForAccount({ account, onAuthorizationRequired, onSelected, onClose }: Props): VNode {
  const { i18n } = useTranslationContext();

  const { state: credentials } = useBackendState();

  const accountIsTheCurrentUser = credentials.status === "loggedIn" ?
    credentials.username === account : false

  return <Fragment>
    {accountIsTheCurrentUser ?
      <ProfileNavigation current="cashouts" />
      :
      <h1 class="text-base font-semibold leading-6 text-gray-900">
        <i18n.Translate>Cashout for account {account}</i18n.Translate>
      </h1>
    }

    <CreateCashout focus onCancel={onClose} onAuthorizationRequired={onAuthorizationRequired} account={account} />

    <Cashouts
      account={account}
      onSelected={onSelected}
    />
  </Fragment>
}