diff options
Diffstat (limited to 'packages/merchant-backoffice-ui')
5 files changed, 61 insertions, 4 deletions
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx b/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx index 68f79bc35..3cd36a6e0 100644 --- a/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx +++ b/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx @@ -171,7 +171,7 @@ export function InputPaytoForm<T>({ label, tooltip, }: Props<keyof T>): VNode { - const { value: paytos, onChange } = useField<T>(name); + const { value: paytos, onChange, required } = useField<T>(name); const [value, valueHandler] = useState<Partial<Entity>>(defaultTarget); @@ -198,7 +198,10 @@ export function InputPaytoForm<T>({ const paytoURL = !url ? "" : url.href; const errors: FormErrors<Entity> = { - target: value.target === noTargetValue ? i18n.str`required` : undefined, + target: + value.target === noTargetValue && !paytos.length + ? i18n.str`required` + : undefined, path1: !value.path1 ? i18n.str`required` : value.target === "iban" @@ -368,6 +371,11 @@ export function InputPaytoForm<T>({ </div> ))} {!paytos.length && i18n.str`No accounts yet.`} + {required && ( + <span class="icon has-text-danger is-right"> + <i class="mdi mdi-alert" /> + </span> + )} </div> </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx b/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx index 495c93897..8a57a9de8 100644 --- a/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx +++ b/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx @@ -45,7 +45,6 @@ export function InputSelector<T>({ toStr = defaultToString, }: Props<keyof T>): VNode { const { error, value, onChange } = useField<T>(name); - console.log(error); return ( <div class="field is-horizontal"> <div class="field-label is-normal"> diff --git a/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx b/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx index c497773d9..3a3bdd6f3 100644 --- a/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx +++ b/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx @@ -31,6 +31,7 @@ import { InputImage } from "../form/InputImage.js"; import { InputLocation } from "../form/InputLocation.js"; import { InputPaytoForm } from "../form/InputPaytoForm.js"; import { InputWithAddon } from "../form/InputWithAddon.js"; +import { InputSelector } from "../form/InputSelector.js"; export function DefaultInstanceFormFields({ readonlyId, @@ -59,6 +60,13 @@ export function DefaultInstanceFormFields({ tooltip={i18n.str`Legal name of the business represented by this instance.`} /> + <InputSelector<Entity> + name="user_type" + label={i18n.str`Type`} + tooltip={i18n.str`Different type of account can have different rules and requirements.`} + values={["business", "individual"]} + /> + <Input<Entity> name="email" label={i18n.str`Email`} diff --git a/packages/merchant-backoffice-ui/src/declaration.d.ts b/packages/merchant-backoffice-ui/src/declaration.d.ts index a9d0f3a7f..4f76b9701 100644 --- a/packages/merchant-backoffice-ui/src/declaration.d.ts +++ b/packages/merchant-backoffice-ui/src/declaration.d.ts @@ -278,6 +278,11 @@ export namespace MerchantBackend { // Merchant name corresponding to this instance. name: string; + // Type of the user (business or individual). + // Defaults to 'business'. Should become mandatory field + // in the future, left as optional for API compatibility for now. + user_type?: string; + email: string; website: string; // An optional base64-encoded logo image diff --git a/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx b/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx index bf5f5d7c9..0ef1f1270 100644 --- a/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx +++ b/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx @@ -48,6 +48,7 @@ function with_defaults(id?: string): Partial<Entity> { return { id, payto_uris: [], + user_type: "business", default_pay_delay: { d_us: 2 * 1000 * 60 * 60 * 1000 }, // two hours default_wire_fee_amortization: 1, default_wire_transfer_delay: { d_us: 1000 * 2 * 60 * 60 * 24 * 1000 }, // two days @@ -69,6 +70,11 @@ export function CreatePage({ onCreate, onBack, forceId }: Props): VNode { ? i18n.str`is not valid` : undefined, name: !value.name ? i18n.str`required` : undefined, + user_type: !value.user_type + ? i18n.str`required` + : value.user_type !== "business" && value.user_type !== "individual" + ? i18n.str`should be business or individual` + : undefined, payto_uris: !value.payto_uris || !value.payto_uris.length ? i18n.str`required` @@ -174,7 +180,13 @@ export function CreatePage({ onCreate, onBack, forceId }: Props): VNode { <div class="level-item has-text-centered"> <h1 class="title"> <button - class="button is-danger has-tooltip-bottom" + class={ + !isTokenSet + ? "button is-danger has-tooltip-bottom" + : !value.auth_token + ? "button has-tooltip-bottom" + : "button is-info has-tooltip-bottom" + } data-tooltip={i18n.str`change authorization configuration`} onClick={() => updateIsTokenDialogActive(true)} > @@ -188,6 +200,31 @@ export function CreatePage({ onCreate, onBack, forceId }: Props): VNode { </h1> </div> </div> + <div class="level"> + <div class="level-item has-text-centered"> + {!isTokenSet ? ( + <p class="is-size-6"> + <i18n.Translate> + Access token is not yet configured. This instance can't be + created. + </i18n.Translate> + </p> + ) : value.auth_token === undefined ? ( + <p class="is-size-6"> + <i18n.Translate> + No access token. Authorization must be handled externally. + </i18n.Translate> + </p> + ) : ( + <p class="is-size-6"> + <i18n.Translate> + Access token is set. Authorization is handled by the + merchant backend. + </i18n.Translate> + </p> + )} + </div> + </div> </div> </section> |