diff options
author | Sebastian <sebasjm@gmail.com> | 2023-10-19 02:55:57 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2023-10-19 02:56:15 -0300 |
commit | 366cccb8fcae6a9971a1e8a9143d821e289339d1 (patch) | |
tree | fcaa481f7053ef11c92e988d3fb84bf3cedbaba3 /packages/demobank-ui/src/pages/ShowAccountDetails.tsx | |
parent | a67518ab1a865fc79374a19bce6513b0caa2eab6 (diff) | |
download | wallet-core-366cccb8fcae6a9971a1e8a9143d821e289339d1.tar.xz |
integrate bank into the new taler-util API
Diffstat (limited to 'packages/demobank-ui/src/pages/ShowAccountDetails.tsx')
-rw-r--r-- | packages/demobank-ui/src/pages/ShowAccountDetails.tsx | 123 |
1 files changed, 72 insertions, 51 deletions
diff --git a/packages/demobank-ui/src/pages/ShowAccountDetails.tsx b/packages/demobank-ui/src/pages/ShowAccountDetails.tsx index 6acf0361e..3534f9733 100644 --- a/packages/demobank-ui/src/pages/ShowAccountDetails.tsx +++ b/packages/demobank-ui/src/pages/ShowAccountDetails.tsx @@ -1,67 +1,88 @@ -import { ErrorType, HttpResponsePaginated, RequestError, notify, notifyError, useTranslationContext } from "@gnu-taler/web-util/browser"; +import { HttpStatusCode, TalerCorebankApi, TalerError, TranslatedString } from "@gnu-taler/taler-util"; +import { HttpResponsePaginated, RequestError, notify, notifyError, useTranslationContext } from "@gnu-taler/web-util/browser"; import { VNode, h } from "preact"; -import { useAdminAccountAPI, useBusinessAccountDetails } from "../hooks/circuit.js"; import { useState } from "preact/hooks"; -import { HttpStatusCode, TranslatedString } from "@gnu-taler/taler-util"; -import { buildRequestErrorMessage } from "../utils.js"; +import { ErrorLoading } from "../components/ErrorLoading.js"; +import { Loading } from "../components/Loading.js"; +import { useBankCoreApiContext } from "../context/config.js"; +import { useAccountDetails } from "../hooks/access.js"; +import { useBackendState } from "../hooks/backend.js"; +import { buildRequestErrorMessage, undefinedIfEmpty } from "../utils.js"; +import { assertUnreachable } from "./HomePage.js"; +import { LoginForm } from "./LoginForm.js"; import { AccountForm } from "./admin/AccountForm.js"; export function ShowAccountDetails({ account, onClear, onUpdateSuccess, - onLoadNotOk, onChangePassword, }: { - onLoadNotOk: <T>( - error: HttpResponsePaginated<T, SandboxBackend.SandboxError>, - ) => VNode; onClear?: () => void; onChangePassword: () => void; onUpdateSuccess: () => void; account: string; }): VNode { const { i18n } = useTranslationContext(); - const result = useBusinessAccountDetails(account); - const { updateAccount } = useAdminAccountAPI(); + const { state: credentials } = useBackendState(); + const creds = credentials.status !== "loggedIn" ? undefined : credentials + const { api } = useBankCoreApiContext() + const [update, setUpdate] = useState(false); - const [submitAccount, setSubmitAccount] = useState< - SandboxBackend.Circuit.CircuitAccountData | undefined - >(); + const [submitAccount, setSubmitAccount] = useState<TalerCorebankApi.AccountData | undefined>(); - if (!result.ok) { - if (result.loading || result.type === ErrorType.TIMEOUT) { - return onLoadNotOk(result); - } - if (result.status === HttpStatusCode.NotFound) { - return <div>account not found</div>; + const result = useAccountDetails(account); + if (!result) { + return <Loading /> + } + if (result instanceof TalerError) { + return <ErrorLoading error={result} /> + } + if (result.type === "fail") { + switch (result.case) { + case "not-found": return <LoginForm reason="not-found" /> + case "unauthorized": return <LoginForm reason="forbidden" /> + default: assertUnreachable(result) } - return onLoadNotOk(result); } async function doUpdate() { if (!update) { setUpdate(true); } else { - if (!submitAccount) return; + if (!submitAccount || !creds) return; try { - await updateAccount(account, { - cashout_address: submitAccount.cashout_address, - contact_data: submitAccount.contact_data, + const resp = await api.updateAccount(creds, { + cashout_address: submitAccount.cashout_payto_uri, + challenge_contact_data: undefinedIfEmpty({ + email: submitAccount.contact_data?.email, + phone: submitAccount.contact_data?.phone, + }), + is_exchange: false, + name: submitAccount.name, }); - onUpdateSuccess(); + if (resp.type === "ok") { + onUpdateSuccess(); + } else { + switch (resp.case) { + case "unauthorized": return notify({ + type: "error", + title: i18n.str`The rights to change the account are not sufficient`, + description: resp.detail.hint as TranslatedString, + debug: resp.detail, + }) + case "not-found": return notify({ + type: "error", + title: i18n.str`The username was not found`, + description: resp.detail.hint as TranslatedString, + debug: resp.detail, + }) + default: assertUnreachable(resp) + } + } } catch (error) { - if (error instanceof RequestError) { - notify( - buildRequestErrorMessage(i18n, error.cause, { - onClientError: (status) => - status === HttpStatusCode.Forbidden - ? i18n.str`The rights to change the account are not sufficient` - : status === HttpStatusCode.NotFound - ? i18n.str`The username was not found` - : undefined, - }), - ); + if (error instanceof TalerError) { + notify(buildRequestErrorMessage(i18n, error)) } else { notifyError( i18n.str`Operation failed, please report`, @@ -86,24 +107,24 @@ export function ShowAccountDetails({ } </h2> <div class="mt-4"> - <div class="flex items-center justify-between"> - <span class="flex flex-grow flex-col"> - <span class="text-sm text-black font-medium leading-6 " id="availability-label"> - <i18n.Translate>change the account details</i18n.Translate> - </span> - </span> - <button type="button" data-enabled={!update} class="bg-indigo-600 data-[enabled=true]:bg-gray-200 relative inline-flex h-5 w-10 flex-shrink-0 cursor-pointer rounded-full ring-2 border-gray-600 transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2" role="switch" aria-checked="false" aria-labelledby="availability-label" aria-describedby="availability-description" - onClick={() => { - setUpdate(!update) - }}> - <span aria-hidden="true" data-enabled={!update} class="translate-x-5 data-[enabled=true]:translate-x-0 pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"></span> - </button> - </div> - </div> + <div class="flex items-center justify-between"> + <span class="flex flex-grow flex-col"> + <span class="text-sm text-black font-medium leading-6 " id="availability-label"> + <i18n.Translate>change the account details</i18n.Translate> + </span> + </span> + <button type="button" data-enabled={!update} class="bg-indigo-600 data-[enabled=true]:bg-gray-200 relative inline-flex h-5 w-10 flex-shrink-0 cursor-pointer rounded-full ring-2 border-gray-600 transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2" role="switch" aria-checked="false" aria-labelledby="availability-label" aria-describedby="availability-description" + onClick={() => { + setUpdate(!update) + }}> + <span aria-hidden="true" data-enabled={!update} class="translate-x-5 data-[enabled=true]:translate-x-0 pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"></span> + </button> + </div> + </div> </div> <AccountForm - template={result.data} + template={result.body} purpose={update ? "update" : "show"} onChange={(a) => setSubmitAccount(a)} > |