feat: support overwriting the default webhook data of deployers and notifiers
This commit is contained in:
@@ -246,7 +246,12 @@ const AccessForm = forwardRef<AccessFormInstance, AccessFormProps>(({ className,
|
||||
case ACCESS_PROVIDERS.WANGSU:
|
||||
return <AccessFormWangsuConfig {...nestedFormProps} />;
|
||||
case ACCESS_PROVIDERS.WEBHOOK:
|
||||
return <AccessFormWebhookConfig {...nestedFormProps} />;
|
||||
return (
|
||||
<AccessFormWebhookConfig
|
||||
usage={usage === "notification-only" ? "notification" : usage === "both-dns-hosting" ? "deployment" : "none"}
|
||||
{...nestedFormProps}
|
||||
/>
|
||||
);
|
||||
case ACCESS_PROVIDERS.WESTCN:
|
||||
return <AccessFormWestcnConfig {...nestedFormProps} />;
|
||||
case ACCESS_PROVIDERS.ZEROSSL:
|
||||
|
||||
@@ -112,11 +112,11 @@ const AccessFormEmailConfig = ({ form: formInst, formName, disabled, initialValu
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name="defaultSenderAddress" label={t("access.form.email_default_sender_address.label")} rules={[formRule]}>
|
||||
<Input type="email" placeholder={t("access.form.email_default_sender_address.placeholder")} />
|
||||
<Input type="email" allowClear placeholder={t("access.form.email_default_sender_address.placeholder")} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name="defaultReceiverAddress" label={t("access.form.email_default_receiver_address.label")} rules={[formRule]}>
|
||||
<Input type="email" placeholder={t("access.form.email_default_receiver_address.placeholder")} />
|
||||
<Input type="email" allowClear placeholder={t("access.form.email_default_receiver_address.placeholder")} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
|
||||
@@ -70,7 +70,7 @@ const AccessFormMattermostConfig = ({ form: formInst, formName, disabled, initia
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("access.form.mattermost_default_channel_id.tooltip") }}></span>}
|
||||
>
|
||||
<Input placeholder={t("access.form.mattermost_default_channel_id.placeholder")} />
|
||||
<Input allowClear placeholder={t("access.form.mattermost_default_channel_id.placeholder")} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
|
||||
@@ -72,7 +72,7 @@ const AccessFormTelegramConfig = ({ form: formInst, formName, disabled, initialV
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("access.form.telegram_default_chat_id.tooltip") }}></span>}
|
||||
>
|
||||
<Input type="number" placeholder={t("access.form.telegram_default_chat_id.placeholder")} />
|
||||
<Input type="number" allowClear placeholder={t("access.form.telegram_default_chat_id.placeholder")} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Form, type FormInstance, Input, Select, Switch } from "antd";
|
||||
import { Alert, Button, Form, type FormInstance, Input, Select, Switch } from "antd";
|
||||
import { createSchemaFieldRule } from "antd-zod";
|
||||
import { z } from "zod";
|
||||
|
||||
import Show from "@/components/Show";
|
||||
import { type AccessConfigForWebhook } from "@/domain/access";
|
||||
|
||||
type AccessFormWebhookConfigFieldValues = Nullish<AccessConfigForWebhook>;
|
||||
@@ -12,6 +13,7 @@ export type AccessFormWebhookConfigProps = {
|
||||
formName: string;
|
||||
disabled?: boolean;
|
||||
initialValues?: AccessFormWebhookConfigFieldValues;
|
||||
usage?: "deployment" | "notification" | "none";
|
||||
onValuesChange?: (values: AccessFormWebhookConfigFieldValues) => void;
|
||||
};
|
||||
|
||||
@@ -21,10 +23,27 @@ const initFormModel = (): AccessFormWebhookConfigFieldValues => {
|
||||
method: "POST",
|
||||
headers: "Content-Type: application/json",
|
||||
allowInsecureConnections: false,
|
||||
defaultDataForDeployment: JSON.stringify(
|
||||
{
|
||||
name: "${DOMAINS}",
|
||||
cert: "${CERTIFICATE}",
|
||||
privkey: "${PRIVATE_KEY}",
|
||||
},
|
||||
null,
|
||||
2
|
||||
),
|
||||
defaultDataForNotification: JSON.stringify(
|
||||
{
|
||||
subject: "${SUBJECT}",
|
||||
message: "${MESSAGE}",
|
||||
},
|
||||
null,
|
||||
2
|
||||
),
|
||||
};
|
||||
};
|
||||
|
||||
const AccessFormWebhookConfig = ({ form: formInst, formName, disabled, initialValues, onValuesChange }: AccessFormWebhookConfigProps) => {
|
||||
const AccessFormWebhookConfig = ({ form: formInst, formName, disabled, initialValues, usage, onValuesChange }: AccessFormWebhookConfigProps) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const formSchema = z.object({
|
||||
@@ -47,6 +66,34 @@ const AccessFormWebhookConfig = ({ form: formInst, formName, disabled, initialVa
|
||||
return true;
|
||||
}, t("access.form.webhook_headers.errmsg.invalid")),
|
||||
allowInsecureConnections: z.boolean().nullish(),
|
||||
defaultDataForDeployment: z
|
||||
.string()
|
||||
.nullish()
|
||||
.refine((v) => {
|
||||
if (usage && usage !== "deployment") return true;
|
||||
if (!v) return true;
|
||||
|
||||
try {
|
||||
const obj = JSON.parse(v);
|
||||
return typeof obj === "object" && !Array.isArray(obj);
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}, t("access.form.webhook_default_data.errmsg.json_invalid")),
|
||||
defaultDataForNotification: z
|
||||
.string()
|
||||
.nullish()
|
||||
.refine((v) => {
|
||||
if (usage && usage !== "notification") return true;
|
||||
if (!v) return true;
|
||||
|
||||
try {
|
||||
const obj = JSON.parse(v);
|
||||
return typeof obj === "object" && !Array.isArray(obj);
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}, t("access.form.webhook_default_data.errmsg.json_invalid")),
|
||||
});
|
||||
const formRule = createSchemaFieldRule(formSchema);
|
||||
|
||||
@@ -57,6 +104,34 @@ const AccessFormWebhookConfig = ({ form: formInst, formName, disabled, initialVa
|
||||
formInst.setFieldValue("headers", value);
|
||||
};
|
||||
|
||||
const handleWebhookDataForDeploymentBlur = (e: React.FocusEvent<HTMLTextAreaElement>) => {
|
||||
const value = e.target.value;
|
||||
try {
|
||||
const json = JSON.stringify(JSON.parse(value), null, 2);
|
||||
formInst.setFieldValue("defaultDataForDeployment", json);
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
const handleWebhookDataForNotificationBlur = (e: React.FocusEvent<HTMLTextAreaElement>) => {
|
||||
const value = e.target.value;
|
||||
try {
|
||||
const json = JSON.stringify(JSON.parse(value), null, 2);
|
||||
formInst.setFieldValue("defaultDataForNotification", json);
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
const handlePresetDataForDeploymentClick = () => {
|
||||
formInst.setFieldValue("defaultDataForDeployment", initFormModel().defaultDataForDeployment);
|
||||
};
|
||||
|
||||
const handlePresetDataForNotificationClick = () => {
|
||||
formInst.setFieldValue("defaultDataForNotification", initFormModel().defaultDataForNotification);
|
||||
};
|
||||
|
||||
const handleFormChange = (_: unknown, values: z.infer<typeof formSchema>) => {
|
||||
onValuesChange?.(values);
|
||||
};
|
||||
@@ -90,6 +165,60 @@ const AccessFormWebhookConfig = ({ form: formInst, formName, disabled, initialVa
|
||||
<Input.TextArea autoSize={{ minRows: 3, maxRows: 5 }} placeholder={t("access.form.webhook_headers.placeholder")} onBlur={handleWebhookHeadersBlur} />
|
||||
</Form.Item>
|
||||
|
||||
<Show when={!usage || usage === "deployment"}>
|
||||
<Form.Item className="mb-0">
|
||||
<label className="mb-1 block">
|
||||
<div className="flex w-full items-center justify-between gap-4">
|
||||
<div className="max-w-full grow truncate">{t("access.form.webhook_default_data_for_deployment.label")}</div>
|
||||
<div className="text-right">
|
||||
<Button size="small" type="link" onClick={handlePresetDataForDeploymentClick}>
|
||||
{t("access.form.webhook_default_data_preset.button")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
<Form.Item name="defaultDataForDeployment" rules={[formRule]}>
|
||||
<Input.TextArea
|
||||
allowClear
|
||||
autoSize={{ minRows: 3, maxRows: 10 }}
|
||||
placeholder={t("access.form.webhook_default_data_for_deployment.placeholder")}
|
||||
onBlur={handleWebhookDataForDeploymentBlur}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
<Alert type="info" message={<span dangerouslySetInnerHTML={{ __html: t("access.form.webhook_default_data_for_deployment.guide") }}></span>} />
|
||||
</Form.Item>
|
||||
</Show>
|
||||
|
||||
<Show when={!usage || usage === "notification"}>
|
||||
<Form.Item className="mb-0">
|
||||
<label className="mb-1 block">
|
||||
<div className="flex w-full items-center justify-between gap-4">
|
||||
<div className="max-w-full grow truncate">{t("access.form.webhook_default_data_for_notification.label")}</div>
|
||||
<div className="text-right">
|
||||
<Button size="small" type="link" onClick={handlePresetDataForNotificationClick}>
|
||||
{t("access.form.webhook_default_data_preset.button")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
<Form.Item name="defaultDataForNotification" rules={[formRule]}>
|
||||
<Input.TextArea
|
||||
allowClear
|
||||
autoSize={{ minRows: 3, maxRows: 10 }}
|
||||
placeholder={t("access.form.webhook_default_data_for_notification.placeholder")}
|
||||
onBlur={handleWebhookDataForNotificationBlur}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
<Alert type="info" message={<span dangerouslySetInnerHTML={{ __html: t("access.form.webhook_default_data_for_notification.guide") }}></span>} />
|
||||
</Form.Item>
|
||||
</Show>
|
||||
|
||||
<Form.Item
|
||||
name="allowInsecureConnections"
|
||||
label={t("access.form.webhook_allow_insecure_conns.label")}
|
||||
|
||||
@@ -452,7 +452,7 @@ const ApplyNodeConfigForm = forwardRef<ApplyNodeConfigFormInstance, ApplyNodeCon
|
||||
<Form.Item name="caProviderAccessId" rules={[formRule]}>
|
||||
<AccessSelect
|
||||
filter={(record) => {
|
||||
if (!!record.reserve && record.reserve !== "ca") return false;
|
||||
if (record.reserve !== "ca") return false;
|
||||
if (fieldCAProvider) return caProvidersMap.get(fieldCAProvider)?.provider === record.provider;
|
||||
|
||||
const provider = accessProvidersMap.get(record.provider);
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Alert, Button, Form, type FormInstance, Input } from "antd";
|
||||
import { Alert, Form, type FormInstance, Input } from "antd";
|
||||
import { createSchemaFieldRule } from "antd-zod";
|
||||
import { z } from "zod";
|
||||
|
||||
@@ -16,31 +16,26 @@ export type DeployNodeConfigFormWebhookConfigProps = {
|
||||
};
|
||||
|
||||
const initFormModel = (): DeployNodeConfigFormWebhookConfigFieldValues => {
|
||||
return {
|
||||
webhookData: JSON.stringify(
|
||||
{
|
||||
name: "${DOMAINS}",
|
||||
cert: "${CERTIFICATE}",
|
||||
privkey: "${PRIVATE_KEY}",
|
||||
},
|
||||
null,
|
||||
2
|
||||
),
|
||||
};
|
||||
return {};
|
||||
};
|
||||
|
||||
const DeployNodeConfigFormWebhookConfig = ({ form: formInst, formName, disabled, initialValues, onValuesChange }: DeployNodeConfigFormWebhookConfigProps) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const formSchema = z.object({
|
||||
webhookData: z.string({ message: t("workflow_node.deploy.form.webhook_data.placeholder") }).refine((v) => {
|
||||
try {
|
||||
JSON.parse(v);
|
||||
return true;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}, t("workflow_node.deploy.form.webhook_data.errmsg.json_invalid")),
|
||||
webhookData: z
|
||||
.string()
|
||||
.nullish()
|
||||
.refine((v) => {
|
||||
if (!v) return true;
|
||||
|
||||
try {
|
||||
const obj = JSON.parse(v);
|
||||
return typeof obj === "object" && !Array.isArray(obj);
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}, t("workflow_node.deploy.form.webhook_data.errmsg.json_invalid")),
|
||||
});
|
||||
const formRule = createSchemaFieldRule(formSchema);
|
||||
|
||||
@@ -54,10 +49,6 @@ const DeployNodeConfigFormWebhookConfig = ({ form: formInst, formName, disabled,
|
||||
}
|
||||
};
|
||||
|
||||
const handlePresetDataClick = () => {
|
||||
formInst.setFieldValue("webhookData", initFormModel().webhookData);
|
||||
};
|
||||
|
||||
const handleFormChange = (_: unknown, values: z.infer<typeof formSchema>) => {
|
||||
onValuesChange?.(values);
|
||||
};
|
||||
@@ -71,24 +62,18 @@ const DeployNodeConfigFormWebhookConfig = ({ form: formInst, formName, disabled,
|
||||
name={formName}
|
||||
onValuesChange={handleFormChange}
|
||||
>
|
||||
<Form.Item className="mb-0">
|
||||
<label className="mb-1 block">
|
||||
<div className="flex w-full items-center justify-between gap-4">
|
||||
<div className="max-w-full grow truncate">{t("workflow_node.deploy.form.webhook_data.label")}</div>
|
||||
<div className="text-right">
|
||||
<Button size="small" type="link" onClick={handlePresetDataClick}>
|
||||
{t("workflow_node.deploy.form.webhook_data_preset.button")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
<Form.Item name="webhookData" rules={[formRule]}>
|
||||
<Input.TextArea
|
||||
autoSize={{ minRows: 3, maxRows: 10 }}
|
||||
placeholder={t("workflow_node.deploy.form.webhook_data.placeholder")}
|
||||
onBlur={handleWebhookDataBlur}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="webhookData"
|
||||
label={t("workflow_node.deploy.form.webhook_data.label")}
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.deploy.form.webhook_data.tooltip") }}></span>}
|
||||
>
|
||||
<Input.TextArea
|
||||
allowClear
|
||||
autoSize={{ minRows: 3, maxRows: 10 }}
|
||||
placeholder={t("workflow_node.deploy.form.webhook_data.placeholder")}
|
||||
onBlur={handleWebhookDataBlur}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
|
||||
@@ -2,13 +2,14 @@ import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useState } f
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Link } from "react-router";
|
||||
import { PlusOutlined as PlusOutlinedIcon, RightOutlined as RightOutlinedIcon } from "@ant-design/icons";
|
||||
import { Button, Form, type FormInstance, Input, Select } from "antd";
|
||||
import { Button, Divider, Form, type FormInstance, Input, Select, Typography } from "antd";
|
||||
import { createSchemaFieldRule } from "antd-zod";
|
||||
import { z } from "zod";
|
||||
|
||||
import AccessEditModal from "@/components/access/AccessEditModal";
|
||||
import AccessSelect from "@/components/access/AccessSelect";
|
||||
import NotificationProviderSelect from "@/components/provider/NotificationProviderSelect";
|
||||
import Show from "@/components/Show";
|
||||
import { ACCESS_USAGES, NOTIFICATION_PROVIDERS, accessProvidersMap, notificationProvidersMap } from "@/domain/provider";
|
||||
import { notifyChannelsMap } from "@/domain/settings";
|
||||
import { type WorkflowNodeConfigForNotify } from "@/domain/workflow";
|
||||
@@ -19,6 +20,7 @@ import { useNotifyChannelsStore } from "@/stores/notify";
|
||||
import NotifyNodeConfigFormEmailConfig from "./NotifyNodeConfigFormEmailConfig";
|
||||
import NotifyNodeConfigFormMattermostConfig from "./NotifyNodeConfigFormMattermostConfig";
|
||||
import NotifyNodeConfigFormTelegramConfig from "./NotifyNodeConfigFormTelegramConfig";
|
||||
import NotifyNodeConfigFormWebhookConfig from "./NotifyNodeConfigFormWebhookConfig";
|
||||
|
||||
type NotifyNodeConfigFormFieldValues = Partial<WorkflowNodeConfigForNotify>;
|
||||
|
||||
@@ -114,6 +116,8 @@ const NotifyNodeConfigForm = forwardRef<NotifyNodeConfigFormInstance, NotifyNode
|
||||
return <NotifyNodeConfigFormMattermostConfig {...nestedFormProps} />;
|
||||
case NOTIFICATION_PROVIDERS.TELEGRAM:
|
||||
return <NotifyNodeConfigFormTelegramConfig {...nestedFormProps} />;
|
||||
case NOTIFICATION_PROVIDERS.WEBHOOK:
|
||||
return <NotifyNodeConfigFormWebhookConfig {...nestedFormProps} />;
|
||||
}
|
||||
}, [disabled, initialValues?.providerConfig, fieldProvider, nestedFormInst, nestedFormName]);
|
||||
|
||||
@@ -250,7 +254,7 @@ const NotifyNodeConfigForm = forwardRef<NotifyNodeConfigFormInstance, NotifyNode
|
||||
<Form.Item name="providerAccessId" rules={[formRule]}>
|
||||
<AccessSelect
|
||||
filter={(record) => {
|
||||
if (!!record.reserve && record.reserve !== "notification") return false;
|
||||
if (record.reserve !== "notification") return false;
|
||||
|
||||
const provider = accessProvidersMap.get(record.provider);
|
||||
return !!provider?.usages?.includes(ACCESS_USAGES.NOTIFICATION);
|
||||
@@ -261,7 +265,15 @@ const NotifyNodeConfigForm = forwardRef<NotifyNodeConfigFormInstance, NotifyNode
|
||||
</Form.Item>
|
||||
</Form.Item>
|
||||
|
||||
{nestedFormEl}
|
||||
<Show when={!!nestedFormEl}>
|
||||
<Divider className="my-1">
|
||||
<Typography.Text className="text-xs font-normal" type="secondary">
|
||||
{t("workflow_node.notify.form.params_config.label")}
|
||||
</Typography.Text>
|
||||
</Divider>
|
||||
|
||||
{nestedFormEl}
|
||||
</Show>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -62,7 +62,7 @@ const NotifyNodeConfigFormEmailConfig = ({ form: formInst, formName, disabled, i
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.notify.form.email_sender_address.tooltip") }}></span>}
|
||||
>
|
||||
<Input type="email" placeholder={t("workflow_node.notify.form.email_sender_address.placeholder")} />
|
||||
<Input type="email" allowClear placeholder={t("workflow_node.notify.form.email_sender_address.placeholder")} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
@@ -71,7 +71,7 @@ const NotifyNodeConfigFormEmailConfig = ({ form: formInst, formName, disabled, i
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.notify.form.email_receiver_address.tooltip") }}></span>}
|
||||
>
|
||||
<Input type="email" placeholder={t("workflow_node.notify.form.email_receiver_address.placeholder")} />
|
||||
<Input type="email" allowClear placeholder={t("workflow_node.notify.form.email_receiver_address.placeholder")} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
|
||||
@@ -52,7 +52,7 @@ const NotifyNodeConfigFormMattermostConfig = ({
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.notify.form.mattermost_channel_id.tooltip") }}></span>}
|
||||
>
|
||||
<Input placeholder={t("workflow_node.notify.form.mattermost_channel_id.placeholder")} />
|
||||
<Input allowClear placeholder={t("workflow_node.notify.form.mattermost_channel_id.placeholder")} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
|
||||
@@ -57,7 +57,7 @@ const NotifyNodeConfigFormTelegramConfig = ({ form: formInst, formName, disabled
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.notify.form.telegram_chat_id.tooltip") }}></span>}
|
||||
>
|
||||
<Input type="number" placeholder={t("workflow_node.notify.form.telegram_chat_id.placeholder")} />
|
||||
<Input type="number" allowClear placeholder={t("workflow_node.notify.form.telegram_chat_id.placeholder")} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
|
||||
@@ -0,0 +1,86 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Alert, Form, type FormInstance, Input } from "antd";
|
||||
import { createSchemaFieldRule } from "antd-zod";
|
||||
import { z } from "zod";
|
||||
|
||||
type NotifyNodeConfigFormWebhookConfigFieldValues = Nullish<{
|
||||
webhookData: string;
|
||||
}>;
|
||||
|
||||
export type NotifyNodeConfigFormWebhookConfigProps = {
|
||||
form: FormInstance;
|
||||
formName: string;
|
||||
disabled?: boolean;
|
||||
initialValues?: NotifyNodeConfigFormWebhookConfigFieldValues;
|
||||
onValuesChange?: (values: NotifyNodeConfigFormWebhookConfigFieldValues) => void;
|
||||
};
|
||||
|
||||
const initFormModel = (): NotifyNodeConfigFormWebhookConfigFieldValues => {
|
||||
return {};
|
||||
};
|
||||
|
||||
const NotifyNodeConfigFormWebhookConfig = ({ form: formInst, formName, disabled, initialValues, onValuesChange }: NotifyNodeConfigFormWebhookConfigProps) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const formSchema = z.object({
|
||||
webhookData: z
|
||||
.string()
|
||||
.nullish()
|
||||
.refine((v) => {
|
||||
if (!v) return true;
|
||||
|
||||
try {
|
||||
const obj = JSON.parse(v);
|
||||
return typeof obj === "object" && !Array.isArray(obj);
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}, t("workflow_node.notify.form.webhook_data.errmsg.json_invalid")),
|
||||
});
|
||||
const formRule = createSchemaFieldRule(formSchema);
|
||||
|
||||
const handleWebhookDataBlur = (e: React.FocusEvent<HTMLTextAreaElement>) => {
|
||||
const value = e.target.value;
|
||||
try {
|
||||
const json = JSON.stringify(JSON.parse(value), null, 2);
|
||||
formInst.setFieldValue("webhookData", json);
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
const handleFormChange = (_: unknown, values: z.infer<typeof formSchema>) => {
|
||||
onValuesChange?.(values);
|
||||
};
|
||||
|
||||
return (
|
||||
<Form
|
||||
form={formInst}
|
||||
disabled={disabled}
|
||||
initialValues={initialValues ?? initFormModel()}
|
||||
layout="vertical"
|
||||
name={formName}
|
||||
onValuesChange={handleFormChange}
|
||||
>
|
||||
<Form.Item
|
||||
name="webhookData"
|
||||
label={t("workflow_node.notify.form.webhook_data.label")}
|
||||
rules={[formRule]}
|
||||
tooltip={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.notify.form.webhook_data.tooltip") }}></span>}
|
||||
>
|
||||
<Input.TextArea
|
||||
allowClear
|
||||
autoSize={{ minRows: 3, maxRows: 10 }}
|
||||
placeholder={t("workflow_node.notify.form.webhook_data.placeholder")}
|
||||
onBlur={handleWebhookDataBlur}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
<Alert type="info" message={<span dangerouslySetInnerHTML={{ __html: t("workflow_node.notify.form.webhook_data.guide") }}></span>} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
};
|
||||
|
||||
export default NotifyNodeConfigFormWebhookConfig;
|
||||
Reference in New Issue
Block a user