diff options
Diffstat (limited to 'packages/merchant-backoffice-ui/src/paths/instance/token')
| -rw-r--r-- | packages/merchant-backoffice-ui/src/paths/instance/token/DetailPage.tsx | 49 | ||||
| -rw-r--r-- | packages/merchant-backoffice-ui/src/paths/instance/token/index.tsx | 12 |
2 files changed, 31 insertions, 30 deletions
diff --git a/packages/merchant-backoffice-ui/src/paths/instance/token/DetailPage.tsx b/packages/merchant-backoffice-ui/src/paths/instance/token/DetailPage.tsx index 1e9186624..f2b1db29b 100644 --- a/packages/merchant-backoffice-ui/src/paths/instance/token/DetailPage.tsx +++ b/packages/merchant-backoffice-ui/src/paths/instance/token/DetailPage.tsx @@ -25,19 +25,23 @@ import { useState } from "preact/hooks"; import { AsyncButton } from "../../../components/exception/AsyncButton.js"; import { FormProvider } from "../../../components/form/FormProvider.js"; import { Input } from "../../../components/form/Input.js"; -import { useInstanceContext } from "../../../context/instance.js"; -import { AccessToken } from "../../../declaration.js"; import { NotificationCard } from "../../../components/menu/index.js"; +import { useSessionContext } from "../../../context/session.js"; +import { AccessToken } from "@gnu-taler/taler-util"; interface Props { - instanceId: string; hasToken: boolean | undefined; onClearToken: (c: AccessToken | undefined) => void; onNewToken: (c: AccessToken | undefined, s: AccessToken) => void; onBack?: () => void; } -export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearToken }: Props): VNode { +export function DetailPage({ + hasToken, + onBack, + onNewToken, + onClearToken, +}: Props): VNode { type State = { old_token: string; new_token: string; repeat_token: string }; const [form, setValue] = useState<Partial<State>>({ old_token: "", @@ -47,9 +51,10 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo const { i18n } = useTranslationContext(); const errors = { - old_token: hasToken && !form.old_token - ? i18n.str`you need your access token to perform the operation` - : undefined, + old_token: + hasToken && !form.old_token + ? i18n.str`you need your access token to perform the operation` + : undefined, new_token: !form.new_token ? i18n.str`cannot be empty` : form.new_token === form.old_token @@ -65,15 +70,17 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo (k) => (errors as any)[k] !== undefined, ); - const instance = useInstanceContext(); + const { state } = useSessionContext(); - const text = i18n.str`You are updating the access token from instance with id "${instance.id}"`; + const text = i18n.str`You are updating the access token from instance with id "${state.instance}"`; async function submitForm() { if (hasErrors) return; - const oldToken = hasToken ? `secret-token:${form.old_token}` as AccessToken : undefined; + const oldToken = hasToken + ? (`secret-token:${form.old_token}` as AccessToken) + : undefined; const newToken = `secret-token:${form.new_token}` as AccessToken; - onNewToken(oldToken, newToken) + onNewToken(oldToken, newToken); } return ( @@ -84,9 +91,7 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo <div class="level"> <div class="level-left"> <div class="level-item"> - <span class="is-size-4"> - {text} - </span> + <span class="is-size-4">{text}</span> </div> </div> </div> @@ -94,7 +99,7 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo </section> <hr /> - {!hasToken && + {!hasToken && ( <NotificationCard notification={{ message: i18n.str`This instance doesn't have authentication token.`, @@ -102,7 +107,7 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo type: "WARN", }} /> - } + )} <div class="columns"> <div class="column" /> @@ -119,7 +124,8 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo /> <p> <i18n.Translate> - Clearing the access token will mean public access to the instance. + Clearing the access token will mean public access to the + instance. </i18n.Translate> </p> <div class="buttons is-right mt-5"> @@ -127,10 +133,11 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo class="button" onClick={() => { if (hasToken) { - const oldToken = `secret-token:${form.old_token}` as AccessToken; - onClearToken(oldToken) + const oldToken = + `secret-token:${form.old_token}` as AccessToken; + onClearToken(oldToken); } else { - onClearToken(undefined) + onClearToken(undefined); } }} > @@ -140,7 +147,6 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo </Fragment> )} - <Input<State> name="new_token" label={i18n.str`New access token`} @@ -176,7 +182,6 @@ export function DetailPage({ instanceId, hasToken, onBack, onNewToken, onClearTo </div> <div class="column" /> </div> - </section> </div> ); diff --git a/packages/merchant-backoffice-ui/src/paths/instance/token/index.tsx b/packages/merchant-backoffice-ui/src/paths/instance/token/index.tsx index 13642ec22..d7bf7a6d5 100644 --- a/packages/merchant-backoffice-ui/src/paths/instance/token/index.tsx +++ b/packages/merchant-backoffice-ui/src/paths/instance/token/index.tsx @@ -16,15 +16,13 @@ import { HttpStatusCode } from "@gnu-taler/taler-util"; import { ErrorType, HttpError, useTranslationContext } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; -import { Loading } from "../../../components/exception/loading.js"; -import { AccessToken, MerchantBackend } from "../../../declaration.js"; -import { useInstanceAPI, useInstanceDetails } from "../../../hooks/instance.js"; -import { DetailPage } from "./DetailPage.js"; -import { useInstanceContext } from "../../../context/instance.js"; import { useState } from "preact/hooks"; +import { Loading } from "../../../components/exception/loading.js"; import { NotificationCard } from "../../../components/menu/index.js"; +import { MerchantBackend } from "../../../declaration.js"; +import { useInstanceAPI, useInstanceDetails } from "../../../hooks/instance.js"; import { Notification } from "../../../utils/types.js"; -import { useBackendContext } from "../../../context/backend.js"; +import { DetailPage } from "./DetailPage.js"; interface Props { onUnauthorized: () => VNode; @@ -45,7 +43,6 @@ export default function Token({ const [notif, setNotif] = useState<Notification | undefined>(undefined); const { clearAccessToken, setNewAccessToken } = useInstanceAPI(); - const { id } = useInstanceContext(); const result = useInstanceDetails() if (result.loading) return <Loading />; @@ -69,7 +66,6 @@ export default function Token({ <Fragment> <NotificationCard notification={notif} /> <DetailPage - instanceId={id} onBack={onCancel} hasToken={hasToken} onClearToken={async (currentToken): Promise<void> => { |