mirror of
https://github.com/woodchen-ink/certimate.git
synced 2025-07-18 17:31:55 +08:00
refactor(ui): declare deploy config params
This commit is contained in:
Fu Diwei
parent
f71a519674
commit
260cfb96ec
@ -1,16 +1,17 @@
|
||||
import { createContext, useContext } from "react";
|
||||
import { createContext, useContext, type Context as ReactContext } from "react";
|
||||
|
||||
import { DeployConfig } from "@/domain/domain";
|
||||
import { type DeployConfig } from "@/domain/domain";
|
||||
|
||||
type DeployEditContext = {
|
||||
deploy: DeployConfig;
|
||||
error: Record<string, string | undefined>;
|
||||
setDeploy: (deploy: DeployConfig) => void;
|
||||
setError: (error: Record<string, string | undefined>) => void;
|
||||
export type DeployEditContext<T extends DeployConfig["config"] = DeployConfig["config"]> = {
|
||||
config: Omit<DeployConfig, "config"> & { config: T };
|
||||
setConfig: (config: Omit<DeployConfig, "config"> & { config: T }) => void;
|
||||
|
||||
errors: { [K in keyof T]?: string };
|
||||
setErrors: (error: { [K in keyof T]?: string }) => void;
|
||||
};
|
||||
|
||||
export const Context = createContext<DeployEditContext>({} as DeployEditContext);
|
||||
|
||||
export const useDeployEditContext = () => {
|
||||
return useContext(Context);
|
||||
};
|
||||
export function useDeployEditContext<T extends DeployConfig["config"] = DeployConfig["config"]>() {
|
||||
return useContext<DeployEditContext<T>>(Context as unknown as ReactContext<DeployEditContext<T>>);
|
||||
}
|
||||
|
||||
@ -8,7 +8,7 @@ import { Label } from "@/components/ui/label";
|
||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||
import { ScrollArea } from "@/components/ui/scroll-area";
|
||||
import AccessEditDialog from "./AccessEditDialog";
|
||||
import { Context as DeployEditContext } from "./DeployEdit";
|
||||
import { Context as DeployEditContext, type DeployEditContext as DeployEditContextType } from "./DeployEdit";
|
||||
import DeployToAliyunOSS from "./DeployToAliyunOSS";
|
||||
import DeployToAliyunCDN from "./DeployToAliyunCDN";
|
||||
import DeployToAliyunCLB from "./DeployToAliyunCLB";
|
||||
@ -49,7 +49,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
type: "",
|
||||
});
|
||||
|
||||
const [error, setError] = useState<Record<string, string | undefined>>({});
|
||||
const [errors, setErrors] = useState<Record<string, string | undefined>>({});
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
@ -66,10 +66,10 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
|
||||
useEffect(() => {
|
||||
setDeployType(locDeployConfig.type);
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, [locDeployConfig.type]);
|
||||
|
||||
const setDeploy = useCallback(
|
||||
const setConfig = useCallback(
|
||||
(deploy: DeployConfig) => {
|
||||
if (deploy.type !== locDeployConfig.type) {
|
||||
setLocDeployConfig({ ...deploy, access: "", config: {} });
|
||||
@ -94,10 +94,10 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
|
||||
const handleSaveClick = () => {
|
||||
// 验证数据
|
||||
const newError = { ...error };
|
||||
const newError = { ...errors };
|
||||
newError.type = locDeployConfig.type === "" ? t("domain.deployment.form.access.placeholder") : "";
|
||||
newError.access = locDeployConfig.access === "" ? t("domain.deployment.form.access.placeholder") : "";
|
||||
setError(newError);
|
||||
setErrors(newError);
|
||||
if (Object.values(newError).some((e) => !!e)) return;
|
||||
|
||||
// 保存数据
|
||||
@ -108,7 +108,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
access: "",
|
||||
type: "",
|
||||
});
|
||||
setError({});
|
||||
setErrors({});
|
||||
|
||||
// 关闭弹框
|
||||
setOpen(false);
|
||||
@ -171,10 +171,10 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
return (
|
||||
<DeployEditContext.Provider
|
||||
value={{
|
||||
deploy: locDeployConfig,
|
||||
error: error,
|
||||
setDeploy: setDeploy,
|
||||
setError: setError,
|
||||
config: locDeployConfig as DeployEditContextType["config"],
|
||||
setConfig: setConfig as DeployEditContextType["setConfig"],
|
||||
errors: errors as DeployEditContextType["errors"],
|
||||
setErrors: setErrors as DeployEditContextType["setErrors"],
|
||||
}}
|
||||
>
|
||||
<Dialog open={open} onOpenChange={setOpen}>
|
||||
@ -199,7 +199,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
<Select
|
||||
value={locDeployConfig.type}
|
||||
onValueChange={(val: string) => {
|
||||
setDeploy({ ...locDeployConfig, type: val });
|
||||
setConfig({ ...locDeployConfig, type: val });
|
||||
}}
|
||||
>
|
||||
<SelectTrigger className="mt-2">
|
||||
@ -220,7 +220,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
</SelectContent>
|
||||
</Select>
|
||||
|
||||
<div className="text-red-500 text-sm mt-1">{error.type}</div>
|
||||
<div className="text-red-500 text-sm mt-1">{errors.type}</div>
|
||||
</div>
|
||||
|
||||
{/* 授权配置 */}
|
||||
@ -241,7 +241,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
<Select
|
||||
value={locDeployConfig.access}
|
||||
onValueChange={(val: string) => {
|
||||
setDeploy({ ...locDeployConfig, access: val });
|
||||
setConfig({ ...locDeployConfig, access: val });
|
||||
}}
|
||||
>
|
||||
<SelectTrigger className="mt-2">
|
||||
@ -262,7 +262,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
|
||||
</SelectContent>
|
||||
</Select>
|
||||
|
||||
<div className="text-red-500 text-sm mt-1">{error.access}</div>
|
||||
<div className="text-red-500 text-sm mt-1">{errors.access}</div>
|
||||
</div>
|
||||
|
||||
{/* 其他参数 */}
|
||||
|
||||
@ -8,27 +8,31 @@ import { Label } from "@/components/ui/label";
|
||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToAliyunALBConfigParams = {
|
||||
region?: string;
|
||||
resourceType?: string;
|
||||
loadbalancerId?: string;
|
||||
listenerId?: string;
|
||||
};
|
||||
|
||||
const DeployToAliyunALB = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToAliyunALBConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
region: "cn-hangzhou",
|
||||
resourceType: "",
|
||||
loadbalancerId: "",
|
||||
listenerId: "",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z
|
||||
@ -50,15 +54,15 @@ const DeployToAliyunALB = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
region: res.error?.errors?.find((e) => e.path[0] === "region")?.message,
|
||||
resourceType: res.error?.errors?.find((e) => e.path[0] === "resourceType")?.message,
|
||||
loadbalancerId: res.error?.errors?.find((e) => e.path[0] === "loadbalancerId")?.message,
|
||||
listenerId: res.error?.errors?.find((e) => e.path[0] === "listenerId")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -67,28 +71,28 @@ const DeployToAliyunALB = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_alb_region.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.region}
|
||||
value={config?.config?.region}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.region = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.region}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.region}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_alb_resource_type.label")}</Label>
|
||||
<Select
|
||||
value={data?.config?.resourceType}
|
||||
value={config?.config?.resourceType}
|
||||
onValueChange={(value) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.resourceType = value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger>
|
||||
@ -101,46 +105,46 @@ const DeployToAliyunALB = () => {
|
||||
</SelectGroup>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.resourceType}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.resourceType}</div>
|
||||
</div>
|
||||
|
||||
{data?.config?.resourceType === "loadbalancer" ? (
|
||||
{config?.config?.resourceType === "loadbalancer" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_alb_loadbalancer_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_alb_loadbalancer_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.loadbalancerId}
|
||||
value={config?.config?.loadbalancerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.loadbalancerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.loadbalancerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.loadbalancerId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data?.config?.resourceType === "listener" ? (
|
||||
{config?.config?.resourceType === "listener" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_alb_listener_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_alb_listener_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.listenerId}
|
||||
value={config?.config?.listenerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.listenerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.listenerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.listenerId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
|
||||
@ -7,24 +7,26 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToAliyunCDNConfigParams = {
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToAliyunCDN = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToAliyunCDNConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
config: {
|
||||
domain: "",
|
||||
},
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -34,12 +36,12 @@ const DeployToAliyunCDN = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -48,16 +50,16 @@ const DeployToAliyunCDN = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.domain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -8,19 +8,24 @@ import { Label } from "@/components/ui/label";
|
||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToAliyunCLBConfigParams = {
|
||||
region?: string;
|
||||
resourceType?: string;
|
||||
loadbalancerId?: string;
|
||||
listenerPort?: string;
|
||||
};
|
||||
|
||||
const DeployToAliyunCLB = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToAliyunCLBConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
region: "cn-hangzhou",
|
||||
resourceType: "",
|
||||
loadbalancerId: "",
|
||||
listenerPort: "443",
|
||||
},
|
||||
});
|
||||
@ -28,7 +33,7 @@ const DeployToAliyunCLB = () => {
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z
|
||||
@ -50,15 +55,15 @@ const DeployToAliyunCLB = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
region: res.error?.errors?.find((e) => e.path[0] === "region")?.message,
|
||||
resourceType: res.error?.errors?.find((e) => e.path[0] === "resourceType")?.message,
|
||||
loadbalancerId: res.error?.errors?.find((e) => e.path[0] === "loadbalancerId")?.message,
|
||||
listenerPort: res.error?.errors?.find((e) => e.path[0] === "listenerPort")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -67,28 +72,28 @@ const DeployToAliyunCLB = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_clb_region.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.region}
|
||||
value={config?.config?.region}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.region = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.region}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.region}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_clb_resource_type.label")}</Label>
|
||||
<Select
|
||||
value={data?.config?.resourceType}
|
||||
value={config?.config?.resourceType}
|
||||
onValueChange={(value) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.resourceType = value?.trim();
|
||||
draft.config.resourceType = value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger>
|
||||
@ -101,7 +106,7 @@ const DeployToAliyunCLB = () => {
|
||||
</SelectGroup>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.resourceType}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.resourceType}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -109,34 +114,34 @@ const DeployToAliyunCLB = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_clb_loadbalancer_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.loadbalancerId}
|
||||
value={config?.config?.loadbalancerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.loadbalancerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.loadbalancerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.loadbalancerId}</div>
|
||||
</div>
|
||||
|
||||
{data?.config?.resourceType === "listener" ? (
|
||||
{config?.config?.resourceType === "listener" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_clb_listener_port.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_clb_listener_port.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.listenerPort}
|
||||
value={config?.config?.listenerPort}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.listenerPort = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.listenerPort}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.listenerPort}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
|
||||
@ -8,27 +8,31 @@ import { Label } from "@/components/ui/label";
|
||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToAliyunNLBConfigParams = {
|
||||
region?: string;
|
||||
resourceType?: string;
|
||||
loadbalancerId?: string;
|
||||
listenerId?: string;
|
||||
};
|
||||
|
||||
const DeployToAliyunNLB = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToAliyunNLBConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
region: "cn-hangzhou",
|
||||
resourceType: "",
|
||||
loadbalancerId: "",
|
||||
listenerId: "",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z
|
||||
@ -50,15 +54,15 @@ const DeployToAliyunNLB = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
region: res.error?.errors?.find((e) => e.path[0] === "region")?.message,
|
||||
resourceType: res.error?.errors?.find((e) => e.path[0] === "resourceType")?.message,
|
||||
loadbalancerId: res.error?.errors?.find((e) => e.path[0] === "loadbalancerId")?.message,
|
||||
listenerId: res.error?.errors?.find((e) => e.path[0] === "listenerId")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -67,28 +71,28 @@ const DeployToAliyunNLB = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_nlb_region.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.region}
|
||||
value={config?.config?.region}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.region = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.region}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.region}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_nlb_resource_type.label")}</Label>
|
||||
<Select
|
||||
value={data?.config?.resourceType}
|
||||
value={config?.config?.resourceType}
|
||||
onValueChange={(value) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.resourceType = value?.trim();
|
||||
draft.config.resourceType = value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger>
|
||||
@ -101,46 +105,46 @@ const DeployToAliyunNLB = () => {
|
||||
</SelectGroup>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.resourceType}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.resourceType}</div>
|
||||
</div>
|
||||
|
||||
{data?.config?.resourceType === "loadbalancer" ? (
|
||||
{config?.config?.resourceType === "loadbalancer" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_nlb_loadbalancer_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_nlb_loadbalancer_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.loadbalancerId}
|
||||
value={config?.config?.loadbalancerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.loadbalancerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.loadbalancerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.loadbalancerId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data?.config?.resourceType === "listener" ? (
|
||||
{config?.config?.resourceType === "listener" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.aliyun_nlb_listener_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_nlb_listener_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.listenerId}
|
||||
value={config?.config?.listenerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.listenerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.listenerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.listenerId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
|
||||
@ -7,26 +7,30 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToAliyunOSSConfigParams = {
|
||||
endpoint?: string;
|
||||
bucket?: string;
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToAliyunOSS = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToAliyunOSSConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
endpoint: "oss.aliyuncs.com",
|
||||
bucket: "",
|
||||
domain: "",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -42,14 +46,14 @@ const DeployToAliyunOSS = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
endpoint: res.error?.errors?.find((e) => e.path[0] === "endpoint")?.message,
|
||||
bucket: res.error?.errors?.find((e) => e.path[0] === "bucket")?.message,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -58,16 +62,16 @@ const DeployToAliyunOSS = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_oss_endpoint.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.endpoint}
|
||||
value={config?.config?.endpoint}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.endpoint = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.endpoint}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.endpoint}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -75,16 +79,16 @@ const DeployToAliyunOSS = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.aliyun_oss_bucket.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.bucket}
|
||||
value={config?.config?.bucket}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.bucket = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.bucket}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.bucket}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -92,16 +96,16 @@ const DeployToAliyunOSS = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.domain.label")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -7,25 +7,29 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToHuaweiCloudCDNConfigParams = {
|
||||
region?: string;
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToHuaweiCloudCDN = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToHuaweiCloudCDNConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
region: "cn-north-1",
|
||||
domain: "",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -38,13 +42,13 @@ const DeployToHuaweiCloudCDN = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
region: res.error?.errors?.find((e) => e.path[0] === "region")?.message,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -53,16 +57,16 @@ const DeployToHuaweiCloudCDN = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.huaweicloud_cdn_region.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.region}
|
||||
value={config?.config?.region}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.region = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.region}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.region}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -70,16 +74,16 @@ const DeployToHuaweiCloudCDN = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.domain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -8,28 +8,32 @@ import { Label } from "@/components/ui/label";
|
||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
const DeployToHuaweiCloudCDN = () => {
|
||||
type DeployToHuaweiCloudELBConfigParams = {
|
||||
region?: string;
|
||||
resourceType?: string;
|
||||
certificateId?: string;
|
||||
loadbalancerId?: string;
|
||||
listenerId?: string;
|
||||
};
|
||||
|
||||
const DeployToHuaweiCloudELB = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToHuaweiCloudELBConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
region: "cn-north-1",
|
||||
resourceType: "",
|
||||
certificateId: "",
|
||||
loadbalancerId: "",
|
||||
listenerId: "",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z
|
||||
@ -56,16 +60,16 @@ const DeployToHuaweiCloudCDN = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
region: res.error?.errors?.find((e) => e.path[0] === "region")?.message,
|
||||
resourceType: res.error?.errors?.find((e) => e.path[0] === "resourceType")?.message,
|
||||
certificateId: res.error?.errors?.find((e) => e.path[0] === "certificateId")?.message,
|
||||
loadbalancerId: res.error?.errors?.find((e) => e.path[0] === "loadbalancerId")?.message,
|
||||
listenerId: res.error?.errors?.find((e) => e.path[0] === "listenerId")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -74,28 +78,28 @@ const DeployToHuaweiCloudCDN = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.huaweicloud_elb_region.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.region}
|
||||
value={config?.config?.region}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.region = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.region}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.region}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.huaweicloud_elb_resource_type.label")}</Label>
|
||||
<Select
|
||||
value={data?.config?.resourceType}
|
||||
value={config?.config?.resourceType}
|
||||
onValueChange={(value) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.resourceType = value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger>
|
||||
@ -109,67 +113,67 @@ const DeployToHuaweiCloudCDN = () => {
|
||||
</SelectGroup>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.resourceType}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.resourceType}</div>
|
||||
</div>
|
||||
|
||||
{data?.config?.resourceType === "certificate" ? (
|
||||
{config?.config?.resourceType === "certificate" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.huaweicloud_elb_certificate_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.huaweicloud_elb_certificate_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.certificateId}
|
||||
value={config?.config?.certificateId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certificateId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.certificateId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.certificateId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data?.config?.resourceType === "loadbalancer" ? (
|
||||
{config?.config?.resourceType === "loadbalancer" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.huaweicloud_elb_loadbalancer_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.huaweicloud_elb_loadbalancer_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.loadbalancerId}
|
||||
value={config?.config?.loadbalancerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.loadbalancerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.loadbalancerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.loadbalancerId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data?.config?.resourceType === "listener" ? (
|
||||
{config?.config?.resourceType === "listener" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.huaweicloud_elb_listener_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.huaweicloud_elb_listener_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.listenerId}
|
||||
value={config?.config?.listenerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.listenerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.listenerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.listenerId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
@ -178,4 +182,4 @@ const DeployToHuaweiCloudCDN = () => {
|
||||
);
|
||||
};
|
||||
|
||||
export default DeployToHuaweiCloudCDN;
|
||||
export default DeployToHuaweiCloudELB;
|
||||
|
||||
@ -7,18 +7,24 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToKubernetesSecretConfigParams = {
|
||||
namespace?: string;
|
||||
secretName?: string;
|
||||
secretDataKeyForCrt?: string;
|
||||
secretDataKeyForKey?: string;
|
||||
};
|
||||
|
||||
const DeployToKubernetesSecret = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToKubernetesSecretConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
namespace: "default",
|
||||
secretName: "",
|
||||
secretDataKeyForCrt: "tls.crt",
|
||||
secretDataKeyForKey: "tls.key",
|
||||
},
|
||||
@ -27,7 +33,7 @@ const DeployToKubernetesSecret = () => {
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -46,15 +52,15 @@ const DeployToKubernetesSecret = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
namespace: res.error?.errors?.find((e) => e.path[0] === "namespace")?.message,
|
||||
secretName: res.error?.errors?.find((e) => e.path[0] === "secretName")?.message,
|
||||
secretDataKeyForCrt: res.error?.errors?.find((e) => e.path[0] === "secretDataKeyForCrt")?.message,
|
||||
secretDataKeyForKey: res.error?.errors?.find((e) => e.path[0] === "secretDataKeyForKey")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -64,13 +70,13 @@ const DeployToKubernetesSecret = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.k8s_namespace.label")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.namespace}
|
||||
value={config?.config?.namespace}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.namespace = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@ -80,13 +86,13 @@ const DeployToKubernetesSecret = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.k8s_secret_name.label")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.secretName}
|
||||
value={config?.config?.secretName}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.secretName = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@ -96,13 +102,13 @@ const DeployToKubernetesSecret = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.k8s_secret_data_key_for_crt.label")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.secretDataKeyForCrt}
|
||||
value={config?.config?.secretDataKeyForCrt}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.secretDataKeyForCrt = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@ -112,13 +118,13 @@ const DeployToKubernetesSecret = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.k8s_secret_data_key_for_key.label")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.secretDataKeyForKey}
|
||||
value={config?.config?.secretDataKeyForKey}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.secretDataKeyForKey = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -12,33 +12,40 @@ import { Textarea } from "@/components/ui/textarea";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
type DeployToLocalConfigParams = {
|
||||
format?: string;
|
||||
certPath?: string;
|
||||
keyPath?: string;
|
||||
pfxPassword?: string;
|
||||
jksAlias?: string;
|
||||
jksKeypass?: string;
|
||||
jksStorepass?: string;
|
||||
shell?: string;
|
||||
preCommand?: string;
|
||||
command?: string;
|
||||
};
|
||||
|
||||
const DeployToLocal = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToLocalConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
format: "pem",
|
||||
certPath: "/etc/nginx/ssl/nginx.crt",
|
||||
keyPath: "/etc/nginx/ssl/nginx.key",
|
||||
pfxPassword: "",
|
||||
jksAlias: "",
|
||||
jksKeypass: "",
|
||||
jksStorepass: "",
|
||||
shell: "sh",
|
||||
preCommand: "",
|
||||
command: "sudo service nginx reload",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z
|
||||
@ -86,9 +93,9 @@ const DeployToLocal = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
format: res.error?.errors?.find((e) => e.path[0] === "format")?.message,
|
||||
certPath: res.error?.errors?.find((e) => e.path[0] === "certPath")?.message,
|
||||
keyPath: res.error?.errors?.find((e) => e.path[0] === "keyPath")?.message,
|
||||
@ -100,38 +107,41 @@ const DeployToLocal = () => {
|
||||
preCommand: res.error?.errors?.find((e) => e.path[0] === "preCommand")?.message,
|
||||
command: res.error?.errors?.find((e) => e.path[0] === "command")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
useEffect(() => {
|
||||
if (data.config?.format === "pem") {
|
||||
if (/(.pfx|.jks)$/.test(data.config.certPath)) {
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = data.config!.certPath.replace(/(.pfx|.jks)$/, ".crt");
|
||||
});
|
||||
setDeploy(newData);
|
||||
if (config.config?.format === "pem") {
|
||||
if (/(.pfx|.jks)$/.test(config.config.certPath!)) {
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = config.config!.certPath!.replace(/(.pfx|.jks)$/, ".crt");
|
||||
})
|
||||
);
|
||||
}
|
||||
} else if (data.config?.format === "pfx") {
|
||||
if (/(.crt|.jks)$/.test(data.config.certPath)) {
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = data.config!.certPath.replace(/(.crt|.jks)$/, ".pfx");
|
||||
});
|
||||
setDeploy(newData);
|
||||
} else if (config.config?.format === "pfx") {
|
||||
if (/(.crt|.jks)$/.test(config.config.certPath!)) {
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = config.config!.certPath!.replace(/(.crt|.jks)$/, ".pfx");
|
||||
})
|
||||
);
|
||||
}
|
||||
} else if (data.config?.format === "jks") {
|
||||
if (/(.crt|.pfx)$/.test(data.config.certPath)) {
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = data.config!.certPath.replace(/(.crt|.pfx)$/, ".jks");
|
||||
});
|
||||
setDeploy(newData);
|
||||
} else if (config.config?.format === "jks") {
|
||||
if (/(.crt|.pfx)$/.test(config.config.certPath!)) {
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = config.config!.certPath!.replace(/(.crt|.pfx)$/, ".jks");
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
}, [data.config?.format]);
|
||||
}, [config.config?.format]);
|
||||
|
||||
const getOptionCls = (val: string) => {
|
||||
if (data.config?.shell === val) {
|
||||
if (config.config?.shell === val) {
|
||||
return "border-primary dark:border-primary";
|
||||
}
|
||||
|
||||
@ -142,21 +152,23 @@ const DeployToLocal = () => {
|
||||
switch (key) {
|
||||
case "reload_nginx":
|
||||
{
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.shell = "sh";
|
||||
draft.config.command = "sudo service nginx reload";
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.shell = "sh";
|
||||
draft.config.command = "sudo service nginx reload";
|
||||
})
|
||||
);
|
||||
}
|
||||
break;
|
||||
|
||||
case "binding_iis":
|
||||
{
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.shell = "powershell";
|
||||
draft.config.command = `
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.shell = "powershell";
|
||||
draft.config.command = `
|
||||
# 请将以下变量替换为实际值
|
||||
$pfxPath = "<your-pfx-path>" # PFX 文件路径
|
||||
$pfxPassword = "<your-pfx-password>" # PFX 密码
|
||||
@ -185,17 +197,18 @@ $binding.AddSslCertificate($thumbprint, "My")
|
||||
# 删除目录下的证书文件
|
||||
Remove-Item -Path "$pfxPath" -Force
|
||||
`.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
})
|
||||
);
|
||||
}
|
||||
break;
|
||||
|
||||
case "binding_netsh":
|
||||
{
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.shell = "powershell";
|
||||
draft.config.command = `
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.shell = "powershell";
|
||||
draft.config.command = `
|
||||
# 请将以下变量替换为实际值
|
||||
$pfxPath = "<your-pfx-path>" # PFX 文件路径
|
||||
$pfxPassword = "<your-pfx-password>" # PFX 密码
|
||||
@ -216,8 +229,8 @@ netsh http add sslcert ipport=$addr certhash=$thumbprint
|
||||
# 删除目录下的证书文件
|
||||
Remove-Item -Path "$pfxPath" -Force
|
||||
`.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
})
|
||||
);
|
||||
}
|
||||
break;
|
||||
}
|
||||
@ -229,13 +242,13 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_format.label")}</Label>
|
||||
<Select
|
||||
value={data?.config?.format}
|
||||
value={config?.config?.format}
|
||||
onValueChange={(value) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.format = value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger>
|
||||
@ -249,7 +262,7 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
</SelectGroup>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.format}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.format}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -257,77 +270,77 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_cert_path.label")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.certPath}
|
||||
value={config?.config?.certPath}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.certPath}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.certPath}</div>
|
||||
</div>
|
||||
|
||||
{data.config?.format === "pem" ? (
|
||||
{config.config?.format === "pem" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_key_path.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_key_path.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.keyPath}
|
||||
value={config?.config?.keyPath}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.keyPath = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.keyPath}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.keyPath}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data.config?.format === "pfx" ? (
|
||||
{config.config?.format === "pfx" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_pfx_password.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_pfx_password.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.pfxPassword}
|
||||
value={config?.config?.pfxPassword}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.pfxPassword = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.pfxPassword}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.pfxPassword}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data.config?.format === "jks" ? (
|
||||
{config.config?.format === "jks" ? (
|
||||
<>
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_jks_alias.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_jks_alias.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.jksAlias}
|
||||
value={config?.config?.jksAlias}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.jksAlias = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.jksAlias}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.jksAlias}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -335,16 +348,16 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_jks_keypass.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.jksKeypass}
|
||||
value={config?.config?.jksKeypass}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.jksKeypass = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.jksKeypass}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.jksKeypass}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -352,16 +365,16 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_jks_storepass.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.jksStorepass}
|
||||
value={config?.config?.jksStorepass}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.jksStorepass = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.jksStorepass}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.jksStorepass}</div>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
@ -372,13 +385,13 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
<Label>{t("domain.deployment.form.shell.label")}</Label>
|
||||
<RadioGroup
|
||||
className="flex mt-1"
|
||||
value={data?.config?.shell}
|
||||
value={config?.config?.shell}
|
||||
onValueChange={(val) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.shell = val;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<div className="flex items-center space-x-2">
|
||||
@ -406,24 +419,24 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
</Label>
|
||||
</div>
|
||||
</RadioGroup>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.shell}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.shell}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.shell_pre_command.label")}</Label>
|
||||
<Textarea
|
||||
className="mt-1"
|
||||
value={data?.config?.preCommand}
|
||||
value={config?.config?.preCommand}
|
||||
placeholder={t("domain.deployment.form.shell_pre_command.placeholder")}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.preCommand = e.target.value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
></Textarea>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.preCommand}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.preCommand}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -448,17 +461,17 @@ Remove-Item -Path "$pfxPath" -Force
|
||||
</div>
|
||||
<Textarea
|
||||
className="mt-1"
|
||||
value={data?.config?.command}
|
||||
value={config?.config?.command}
|
||||
placeholder={t("domain.deployment.form.shell_command.placeholder")}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.command = e.target.value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
></Textarea>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.command}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.command}</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@ -7,24 +7,26 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToQiniuCDNConfigParams = {
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToQiniuCDN = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToQiniuCDNConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
config: {
|
||||
domain: "",
|
||||
},
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -34,12 +36,12 @@ const DeployToQiniuCDN = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -48,16 +50,16 @@ const DeployToQiniuCDN = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.domain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -9,24 +9,32 @@ import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectVa
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToSSHConfigParams = {
|
||||
format?: string;
|
||||
certPath?: string;
|
||||
keyPath?: string;
|
||||
pfxPassword?: string;
|
||||
jksAlias?: string;
|
||||
jksKeypass?: string;
|
||||
jksStorepass?: string;
|
||||
shell?: string;
|
||||
preCommand?: string;
|
||||
command?: string;
|
||||
};
|
||||
|
||||
const DeployToSSH = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToSSHConfigParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
format: "pem",
|
||||
certPath: "/etc/nginx/ssl/nginx.crt",
|
||||
keyPath: "/etc/nginx/ssl/nginx.key",
|
||||
pfxPassword: "",
|
||||
jksAlias: "",
|
||||
jksKeypass: "",
|
||||
jksStorepass: "",
|
||||
preCommand: "",
|
||||
command: "sudo service nginx reload",
|
||||
},
|
||||
});
|
||||
@ -34,7 +42,7 @@ const DeployToSSH = () => {
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z
|
||||
@ -79,9 +87,9 @@ const DeployToSSH = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
format: res.error?.errors?.find((e) => e.path[0] === "format")?.message,
|
||||
certPath: res.error?.errors?.find((e) => e.path[0] === "certPath")?.message,
|
||||
keyPath: res.error?.errors?.find((e) => e.path[0] === "keyPath")?.message,
|
||||
@ -92,35 +100,38 @@ const DeployToSSH = () => {
|
||||
preCommand: res.error?.errors?.find((e) => e.path[0] === "preCommand")?.message,
|
||||
command: res.error?.errors?.find((e) => e.path[0] === "command")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
useEffect(() => {
|
||||
if (data.config?.format === "pem") {
|
||||
if (/(.pfx|.jks)$/.test(data.config.certPath)) {
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = data.config!.certPath.replace(/(.pfx|.jks)$/, ".crt");
|
||||
});
|
||||
setDeploy(newData);
|
||||
if (config.config?.format === "pem") {
|
||||
if (/(.pfx|.jks)$/.test(config.config.certPath!)) {
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = config.config!.certPath!.replace(/(.pfx|.jks)$/, ".crt");
|
||||
})
|
||||
);
|
||||
}
|
||||
} else if (data.config?.format === "pfx") {
|
||||
if (/(.crt|.jks)$/.test(data.config.certPath)) {
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = data.config!.certPath.replace(/(.crt|.jks)$/, ".pfx");
|
||||
});
|
||||
setDeploy(newData);
|
||||
} else if (config.config?.format === "pfx") {
|
||||
if (/(.crt|.jks)$/.test(config.config.certPath!)) {
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = config.config!.certPath!.replace(/(.crt|.jks)$/, ".pfx");
|
||||
})
|
||||
);
|
||||
}
|
||||
} else if (data.config?.format === "jks") {
|
||||
if (/(.crt|.pfx)$/.test(data.config.certPath)) {
|
||||
const newData = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = data.config!.certPath.replace(/(.crt|.pfx)$/, ".jks");
|
||||
});
|
||||
setDeploy(newData);
|
||||
} else if (config.config?.format === "jks") {
|
||||
if (/(.crt|.pfx)$/.test(config.config.certPath!)) {
|
||||
setConfig(
|
||||
produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = config.config!.certPath!.replace(/(.crt|.pfx)$/, ".jks");
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
}, [data.config?.format]);
|
||||
}, [config.config?.format]);
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -128,13 +139,13 @@ const DeployToSSH = () => {
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_format.label")}</Label>
|
||||
<Select
|
||||
value={data?.config?.format}
|
||||
value={config?.config?.format}
|
||||
onValueChange={(value) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.format = value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger>
|
||||
@ -148,7 +159,7 @@ const DeployToSSH = () => {
|
||||
</SelectGroup>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.format}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.format}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -156,77 +167,77 @@ const DeployToSSH = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_cert_path.label")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.certPath}
|
||||
value={config?.config?.certPath}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.certPath = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.certPath}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.certPath}</div>
|
||||
</div>
|
||||
|
||||
{data.config?.format === "pem" ? (
|
||||
{config.config?.format === "pem" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_key_path.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_key_path.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.keyPath}
|
||||
value={config?.config?.keyPath}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.keyPath = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.keyPath}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.keyPath}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data.config?.format === "pfx" ? (
|
||||
{config.config?.format === "pfx" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_pfx_password.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_pfx_password.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.pfxPassword}
|
||||
value={config?.config?.pfxPassword}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.pfxPassword = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.pfxPassword}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.pfxPassword}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data.config?.format === "jks" ? (
|
||||
{config.config?.format === "jks" ? (
|
||||
<>
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.file_jks_alias.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_jks_alias.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.jksAlias}
|
||||
value={config?.config?.jksAlias}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.jksAlias = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.jksAlias}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.jksAlias}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -234,16 +245,16 @@ const DeployToSSH = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_jks_keypass.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.jksKeypass}
|
||||
value={config?.config?.jksKeypass}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.jksKeypass = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.jksKeypass}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.jksKeypass}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -251,16 +262,16 @@ const DeployToSSH = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.file_jks_storepass.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.jksStorepass}
|
||||
value={config?.config?.jksStorepass}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.jksStorepass = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.jksStorepass}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.jksStorepass}</div>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
@ -271,34 +282,34 @@ const DeployToSSH = () => {
|
||||
<Label>{t("domain.deployment.form.shell_pre_command.label")}</Label>
|
||||
<Textarea
|
||||
className="mt-1"
|
||||
value={data?.config?.preCommand}
|
||||
value={config?.config?.preCommand}
|
||||
placeholder={t("domain.deployment.form.shell_pre_command.placeholder")}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.preCommand = e.target.value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
></Textarea>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.preCommand}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.preCommand}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.shell_command.label")}</Label>
|
||||
<Textarea
|
||||
className="mt-1"
|
||||
value={data?.config?.command}
|
||||
value={config?.config?.command}
|
||||
placeholder={t("domain.deployment.form.shell_command.placeholder")}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.command = e.target.value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
></Textarea>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.command}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.command}</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@ -7,24 +7,26 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToTencentCDNParams = {
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToTencentCDN = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToTencentCDNParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
config: {
|
||||
domain: "",
|
||||
},
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -34,12 +36,12 @@ const DeployToTencentCDN = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -48,16 +50,16 @@ const DeployToTencentCDN = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.domain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -8,28 +8,32 @@ import { Label } from "@/components/ui/label";
|
||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToTencentCLBParams = {
|
||||
region?: string;
|
||||
resourceType?: string;
|
||||
loadbalancerId?: string;
|
||||
listenerId?: string;
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToTencentCLB = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToTencentCLBParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
region: "ap-guangzhou",
|
||||
resourceType: "",
|
||||
loadbalancerId: "",
|
||||
listenerId: "",
|
||||
domain: "",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z
|
||||
@ -65,16 +69,16 @@ const DeployToTencentCLB = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
region: res.error?.errors?.find((e) => e.path[0] === "region")?.message,
|
||||
resourceType: res.error?.errors?.find((e) => e.path[0] === "resourceType")?.message,
|
||||
loadbalancerId: res.error?.errors?.find((e) => e.path[0] === "loadbalancerId")?.message,
|
||||
listenerId: res.error?.errors?.find((e) => e.path[0] === "listenerId")?.message,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -83,28 +87,28 @@ const DeployToTencentCLB = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_clb_region.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.region}
|
||||
value={config?.config?.region}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.region = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.region}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.region}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.tencent_clb_resource_type.label")}</Label>
|
||||
<Select
|
||||
value={data?.config?.resourceType}
|
||||
value={config?.config?.resourceType}
|
||||
onValueChange={(value) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.resourceType = value;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
>
|
||||
<SelectTrigger>
|
||||
@ -119,7 +123,7 @@ const DeployToTencentCLB = () => {
|
||||
</SelectGroup>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.resourceType}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.resourceType}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -127,76 +131,76 @@ const DeployToTencentCLB = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_clb_loadbalancer_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.loadbalancerId}
|
||||
value={config?.config?.loadbalancerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.loadbalancerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.loadbalancerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.loadbalancerId}</div>
|
||||
</div>
|
||||
|
||||
{data?.config?.resourceType === "ssl-deploy" || data?.config?.resourceType === "listener" || data?.config?.resourceType === "ruledomain" ? (
|
||||
{config?.config?.resourceType === "ssl-deploy" || config?.config?.resourceType === "listener" || config?.config?.resourceType === "ruledomain" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.tencent_clb_listener_id.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_clb_listener_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.listenerId}
|
||||
value={config?.config?.listenerId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.listenerId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.listenerId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.listenerId}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data?.config?.resourceType === "ssl-deploy" ? (
|
||||
{config?.config?.resourceType === "ssl-deploy" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.tencent_clb_domain.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_clb_domain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
|
||||
{data?.config?.resourceType === "ruledomain" ? (
|
||||
{config?.config?.resourceType === "ruledomain" ? (
|
||||
<div>
|
||||
<Label>{t("domain.deployment.form.tencent_clb_ruledomain.label")}</Label>
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_clb_ruledomain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
|
||||
@ -7,26 +7,30 @@ import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToTencentCOSParams = {
|
||||
region?: string;
|
||||
bucket?: string;
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToTencentCOS = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToTencentCOSParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {
|
||||
region: "ap-guangzhou",
|
||||
bucket: "",
|
||||
domain: "",
|
||||
},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -38,14 +42,14 @@ const DeployToTencentCOS = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
region: res.error?.errors?.find((e) => e.path[0] === "region")?.message,
|
||||
bucket: res.error?.errors?.find((e) => e.path[0] === "bucket")?.message,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -54,16 +58,16 @@ const DeployToTencentCOS = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_cos_region.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.region}
|
||||
value={config?.config?.region}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.region = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.region}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.region}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -71,16 +75,16 @@ const DeployToTencentCOS = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_cos_bucket.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.bucket}
|
||||
value={config?.config?.bucket}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.bucket = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.bucket}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.bucket}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -88,16 +92,16 @@ const DeployToTencentCOS = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.domain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -8,24 +8,27 @@ import { Label } from "@/components/ui/label";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import { useDeployEditContext } from "./DeployEdit";
|
||||
|
||||
type DeployToTencentTEOParams = {
|
||||
zoneId?: string;
|
||||
domain?: string;
|
||||
};
|
||||
|
||||
const DeployToTencentTEO = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { deploy: data, setDeploy, error, setError } = useDeployEditContext();
|
||||
const { config, setConfig, errors, setErrors } = useDeployEditContext<DeployToTencentTEOParams>();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
setDeploy({
|
||||
...data,
|
||||
config: {
|
||||
zoneId: "",
|
||||
},
|
||||
if (!config.id) {
|
||||
setConfig({
|
||||
...config,
|
||||
config: {},
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setError({});
|
||||
setErrors({});
|
||||
}, []);
|
||||
|
||||
const formSchema = z.object({
|
||||
@ -36,13 +39,13 @@ const DeployToTencentTEO = () => {
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const res = formSchema.safeParse(data.config);
|
||||
setError({
|
||||
...error,
|
||||
const res = formSchema.safeParse(config.config);
|
||||
setErrors({
|
||||
...errors,
|
||||
zoneId: res.error?.errors?.find((e) => e.path[0] === "zoneId")?.message,
|
||||
domain: res.error?.errors?.find((e) => e.path[0] === "domain")?.message,
|
||||
});
|
||||
}, [data]);
|
||||
}, [config]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col space-y-8">
|
||||
@ -51,16 +54,16 @@ const DeployToTencentTEO = () => {
|
||||
<Input
|
||||
placeholder={t("domain.deployment.form.tencent_teo_zone_id.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.zoneId}
|
||||
value={config?.config?.zoneId}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.zoneId = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.zoneId}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.zoneId}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@ -68,16 +71,16 @@ const DeployToTencentTEO = () => {
|
||||
<Textarea
|
||||
placeholder={t("domain.deployment.form.tencent_teo_domain.placeholder")}
|
||||
className="w-full mt-1"
|
||||
value={data?.config?.domain}
|
||||
value={config?.config?.domain}
|
||||
onChange={(e) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(config, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.domain = e.target.value?.trim();
|
||||
});
|
||||
setDeploy(newData);
|
||||
setConfig(nv);
|
||||
}}
|
||||
/>
|
||||
<div className="text-red-600 text-sm mt-1">{error?.domain}</div>
|
||||
<div className="text-red-600 text-sm mt-1">{errors?.domain}</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -6,7 +6,7 @@ import KVList from "./KVList";
|
||||
import { type KVType } from "@/domain/domain";
|
||||
|
||||
const DeployToWebhook = () => {
|
||||
const { deploy: data, setDeploy, setError } = useDeployEditContext();
|
||||
const { config: data, setConfig: setDeploy, setErrors: setError } = useDeployEditContext();
|
||||
|
||||
useEffect(() => {
|
||||
if (!data.id) {
|
||||
@ -26,11 +26,11 @@ const DeployToWebhook = () => {
|
||||
<KVList
|
||||
variables={data?.config?.variables}
|
||||
onValueChange={(variables: KVType[]) => {
|
||||
const newData = produce(data, (draft) => {
|
||||
const nv = produce(data, (draft) => {
|
||||
draft.config ??= {};
|
||||
draft.config.variables = variables;
|
||||
});
|
||||
setDeploy(newData);
|
||||
setDeploy(nv);
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
|
||||
@ -153,7 +153,7 @@
|
||||
"domain.deployment.form.shell_preset_scripts.trigger": "使用预设脚本",
|
||||
"domain.deployment.form.shell_preset_scripts.option.reload_nginx.label": "Bash - 重启 nginx",
|
||||
"domain.deployment.form.shell_preset_scripts.option.binding_iis.label": "PowerShell - 导入并绑定到 IIS（需管理员权限）",
|
||||
"domain.deployment.form.shell_preset_scripts.option.binding_netsh.label": "PowerShell - 导入并绑定到netsh（需管理员权限）",
|
||||
"domain.deployment.form.shell_preset_scripts.option.binding_netsh.label": "PowerShell - 导入并绑定到 netsh（需管理员权限）",
|
||||
"domain.deployment.form.k8s_namespace.label": "命名空间",
|
||||
"domain.deployment.form.k8s_namespace.placeholder": "请输入 K8S 命名空间",
|
||||
"domain.deployment.form.k8s_secret_name.label": "Secret 名称",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user