taler/wallet-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Activity

fix #7830

Browse Source
This commit is contained in:
Sebastian 2023-08-02 10:41:14 -03:00
parent 60929c34f3
commit 72b8a70da2
No known key found for this signature in database
GPG Key ID: 173909D1A5F66069
3 changed files with 31 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx
View File

@ -44,7 +44,7 @@ export function InputSelector<T>({
fromStr = defaultFromString,
toStr = defaultToString,
}: Props<keyof T>): VNode {
const { error, value, onChange } = useField<T>(name);
const { error, value, onChange, required } = useField<T>(name);
return (
<div class="field is-horizontal">
<div class="field-label is-normal">
@ -58,8 +58,8 @@ export function InputSelector<T>({
</label>
</div>
<div class="field-body is-flex-grow-3">
<div class="field">
<p class={expand ? "control is-expanded select" : "control select"}>
<div class="field has-icons-right">
<p class={expand ? "control is-expanded select" : "control select "}>
<select
class={error ? "select is-danger" : "select"}
name={String(name)}
@ -78,8 +78,14 @@ export function InputSelector<T>({
);
})}
</select>
{help}
</p>
{required && (
<span class="icon has-text-danger is-right" style={{height: "2.5em"}}>
<i class="mdi mdi-alert" />
</span>
)}
{error && <p class="help is-danger">{error}</p>}
</div>
</div>

3
packages/merchant-backoffice-ui/src/declaration.d.ts vendored
View File

@ -1331,12 +1331,13 @@ export namespace MerchantBackend {
}
namespace Webhooks {
type MerchantWebhookType = "pay" | "refund";
interface WebhookAddDetails {
// Webhook ID to use.
webhook_id: string;
// The event of the webhook: why the webhook is used.
event_type: string;
event_type: MerchantWebhookType;
// URL of the webhook where the customer will be redirected.
url: string;

23
packages/merchant-backoffice-ui/src/paths/instance/webhooks/create/CreatePage.tsx
View File

@ -33,6 +33,7 @@ import { InputDuration } from "../../../../components/form/InputDuration.js";
import { InputNumber } from "../../../../components/form/InputNumber.js";
import { useBackendContext } from "../../../../context/backend.js";
import { MerchantBackend } from "../../../../declaration.js";
import { InputSelector } from "../../../../components/form/InputSelector.js";
type Entity = MerchantBackend.Webhooks.WebhookAddDetails;
@ -50,7 +51,9 @@ export function CreatePage({ onCreate, onBack }: Props): VNode {
const errors: FormErrors<Entity> = {
webhook_id: !state.webhook_id ? i18n.str`required` : undefined,
event_type: !state.event_type ? i18n.str`required` : undefined,
event_type: !state.event_type ? i18n.str`required`
: state.event_type !== "pay" && state.event_type !== "refund" ? i18n.str`it should be "pay" or "refund"`
: undefined,
http_method: !state.http_method
? i18n.str`required`
: !validMethod.includes(state.http_method)
@ -84,16 +87,30 @@ export function CreatePage({ onCreate, onBack }: Props): VNode {
label={i18n.str`ID`}
tooltip={i18n.str`Webhook ID to use`}
/>
<Input<Entity>
<InputSelector
name="event_type"
label={i18n.str`Event`}
values={[
i18n.str`Choose one...`,
i18n.str`pay`,
i18n.str`refund`,
]}
tooltip={i18n.str`The event of the webhook: why the webhook is used`}
/>
<Input<Entity>
<InputSelector
name="http_method"
label={i18n.str`Method`}
values={[
i18n.str`Choose one...`,
i18n.str`GET`,
i18n.str`POST`,
i18n.str`PUT`,
i18n.str`PATCH`,
i18n.str`HEAD`,
]}
tooltip={i18n.str`Method used by the webhook`}
/>
<Input<Entity>
name="url"
label={i18n.str`URL`}