fix #7796 and some form issues
This commit is contained in:
parent
c0327fb4d3
commit
25346a03fa
@ -171,7 +171,7 @@ export function InputPaytoForm<T>({
|
|||||||
label,
|
label,
|
||||||
tooltip,
|
tooltip,
|
||||||
}: Props<keyof T>): VNode {
|
}: 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);
|
const [value, valueHandler] = useState<Partial<Entity>>(defaultTarget);
|
||||||
|
|
||||||
@ -198,7 +198,10 @@ export function InputPaytoForm<T>({
|
|||||||
const paytoURL = !url ? "" : url.href;
|
const paytoURL = !url ? "" : url.href;
|
||||||
|
|
||||||
const errors: FormErrors<Entity> = {
|
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
|
path1: !value.path1
|
||||||
? i18n.str`required`
|
? i18n.str`required`
|
||||||
: value.target === "iban"
|
: value.target === "iban"
|
||||||
@ -368,6 +371,11 @@ export function InputPaytoForm<T>({
|
|||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
{!paytos.length && i18n.str`No accounts yet.`}
|
{!paytos.length && i18n.str`No accounts yet.`}
|
||||||
|
{required && (
|
||||||
|
<span class="icon has-text-danger is-right">
|
||||||
|
<i class="mdi mdi-alert" />
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -45,7 +45,6 @@ export function InputSelector<T>({
|
|||||||
toStr = defaultToString,
|
toStr = defaultToString,
|
||||||
}: Props<keyof T>): VNode {
|
}: Props<keyof T>): VNode {
|
||||||
const { error, value, onChange } = useField<T>(name);
|
const { error, value, onChange } = useField<T>(name);
|
||||||
console.log(error);
|
|
||||||
return (
|
return (
|
||||||
<div class="field is-horizontal">
|
<div class="field is-horizontal">
|
||||||
<div class="field-label is-normal">
|
<div class="field-label is-normal">
|
||||||
|
@ -31,6 +31,7 @@ import { InputImage } from "../form/InputImage.js";
|
|||||||
import { InputLocation } from "../form/InputLocation.js";
|
import { InputLocation } from "../form/InputLocation.js";
|
||||||
import { InputPaytoForm } from "../form/InputPaytoForm.js";
|
import { InputPaytoForm } from "../form/InputPaytoForm.js";
|
||||||
import { InputWithAddon } from "../form/InputWithAddon.js";
|
import { InputWithAddon } from "../form/InputWithAddon.js";
|
||||||
|
import { InputSelector } from "../form/InputSelector.js";
|
||||||
|
|
||||||
export function DefaultInstanceFormFields({
|
export function DefaultInstanceFormFields({
|
||||||
readonlyId,
|
readonlyId,
|
||||||
@ -59,6 +60,13 @@ export function DefaultInstanceFormFields({
|
|||||||
tooltip={i18n.str`Legal name of the business represented by this instance.`}
|
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>
|
<Input<Entity>
|
||||||
name="email"
|
name="email"
|
||||||
label={i18n.str`Email`}
|
label={i18n.str`Email`}
|
||||||
|
@ -278,6 +278,11 @@ export namespace MerchantBackend {
|
|||||||
// Merchant name corresponding to this instance.
|
// Merchant name corresponding to this instance.
|
||||||
name: string;
|
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;
|
email: string;
|
||||||
website: string;
|
website: string;
|
||||||
// An optional base64-encoded logo image
|
// An optional base64-encoded logo image
|
||||||
|
@ -48,6 +48,7 @@ function with_defaults(id?: string): Partial<Entity> {
|
|||||||
return {
|
return {
|
||||||
id,
|
id,
|
||||||
payto_uris: [],
|
payto_uris: [],
|
||||||
|
user_type: "business",
|
||||||
default_pay_delay: { d_us: 2 * 1000 * 60 * 60 * 1000 }, // two hours
|
default_pay_delay: { d_us: 2 * 1000 * 60 * 60 * 1000 }, // two hours
|
||||||
default_wire_fee_amortization: 1,
|
default_wire_fee_amortization: 1,
|
||||||
default_wire_transfer_delay: { d_us: 1000 * 2 * 60 * 60 * 24 * 1000 }, // two days
|
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`
|
? i18n.str`is not valid`
|
||||||
: undefined,
|
: undefined,
|
||||||
name: !value.name ? i18n.str`required` : 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:
|
payto_uris:
|
||||||
!value.payto_uris || !value.payto_uris.length
|
!value.payto_uris || !value.payto_uris.length
|
||||||
? i18n.str`required`
|
? i18n.str`required`
|
||||||
@ -174,7 +180,13 @@ export function CreatePage({ onCreate, onBack, forceId }: Props): VNode {
|
|||||||
<div class="level-item has-text-centered">
|
<div class="level-item has-text-centered">
|
||||||
<h1 class="title">
|
<h1 class="title">
|
||||||
<button
|
<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`}
|
data-tooltip={i18n.str`change authorization configuration`}
|
||||||
onClick={() => updateIsTokenDialogActive(true)}
|
onClick={() => updateIsTokenDialogActive(true)}
|
||||||
>
|
>
|
||||||
@ -188,6 +200,31 @@ export function CreatePage({ onCreate, onBack, forceId }: Props): VNode {
|
|||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
</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>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user