refactor: clean code

main
Fu Diwei 2024-10-21 14:53:43 +08:00
parent 9c41b0e357
commit 45005a5073
19 changed files with 1224 additions and 1256 deletions

View File

@ -98,7 +98,6 @@ const AccessAliyunForm = ({ data, op, onAfterReq }: AccessAliyunFormProps) => {
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -189,7 +188,6 @@ const AccessAliyunForm = ({ data, op, onAfterReq }: AccessAliyunFormProps) => {
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -111,7 +111,6 @@ const AccessAwsForm = ({ data, op, onAfterReq }: AccessAwsFormProps) => {
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -232,7 +231,6 @@ const AccessAwsForm = ({ data, op, onAfterReq }: AccessAwsFormProps) => {
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -88,7 +88,6 @@ const AccessCloudflareForm = ({ data, op, onAfterReq }: AccessCloudflareFormProp
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -162,7 +161,6 @@ const AccessCloudflareForm = ({ data, op, onAfterReq }: AccessCloudflareFormProp
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -29,7 +29,7 @@ type AccessEditProps = {
data?: Access;
};
const AccessEdit = ({ trigger, op, data, className }: AccessEditProps) => {
const AccessEditDialog = ({ trigger, op, data, className }: AccessEditProps) => {
const [open, setOpen] = useState(false);
const { t } = useTranslation();
@ -238,7 +238,7 @@ const AccessEdit = ({ trigger, op, data, className }: AccessEditProps) => {
</SelectContent>
</Select>
{form}
<div className="mt-8">{form}</div>
</div>
</ScrollArea>
</DialogContent>
@ -246,4 +246,4 @@ const AccessEdit = ({ trigger, op, data, className }: AccessEditProps) => {
);
};
export default AccessEdit;
export default AccessEditDialog;

View File

@ -95,7 +95,6 @@ const AccessGodaddyForm = ({ data, op, onAfterReq }: AccessGodaddyFormProps) =>
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -184,7 +183,6 @@ const AccessGodaddyForm = ({ data, op, onAfterReq }: AccessGodaddyFormProps) =>
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -29,8 +29,7 @@ const AccessHttpreqForm = ({ data, op, onAfterReq }: AccessHttpreqFormProps) =>
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
endpoint: z.string().url("common.errmsg.url_invalid"),
mode: z
.enum(["RAW", ""]),
mode: z.enum(["RAW", ""]),
username: z
.string()
.min(1, "access.authorization.form.access_key_secret.placeholder")
@ -104,10 +103,9 @@ const AccessHttpreqForm = ({ data, op, onAfterReq }: AccessHttpreqFormProps) =>
return;
}
};
const i18n_prefix = "access.authorization.form.httpreq";
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -166,9 +164,9 @@ const AccessHttpreqForm = ({ data, op, onAfterReq }: AccessHttpreqFormProps) =>
name="endpoint"
render={({ field }) => (
<FormItem>
<FormLabel>{t(i18n_prefix + "_endpoint.label")}</FormLabel>
<FormLabel>{t("access.authorization.form.httpreq_endpoint.label")}</FormLabel>
<FormControl>
<Input placeholder={t(i18n_prefix + "_endpoint.placeholder")} {...field} />
<Input placeholder={t("access.authorization.form.httpreq_endpoint.placeholder")} {...field} />
</FormControl>
<FormMessage />
@ -181,9 +179,9 @@ const AccessHttpreqForm = ({ data, op, onAfterReq }: AccessHttpreqFormProps) =>
name="mode"
render={({ field }) => (
<FormItem>
<FormLabel>{t(i18n_prefix + "_mode.label")}</FormLabel>
<FormLabel>{t("access.authorization.form.httpreq_mode.label")}</FormLabel>
<FormControl>
<Input placeholder={t(i18n_prefix + "_mode.placeholder")} {...field} />
<Input placeholder={t("access.authorization.form.httpreq_mode.placeholder")} {...field} />
</FormControl>
<FormMessage />
@ -228,10 +226,8 @@ const AccessHttpreqForm = ({ data, op, onAfterReq }: AccessHttpreqFormProps) =>
</div>
</form>
</Form>
</div>
</>
);
};
export default AccessHttpreqForm;

View File

@ -104,7 +104,6 @@ const AccessHuaweiCloudForm = ({ data, op, onAfterReq }: AccessHuaweiCloudFormPr
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -210,7 +209,6 @@ const AccessHuaweiCloudForm = ({ data, op, onAfterReq }: AccessHuaweiCloudFormPr
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -113,7 +113,6 @@ const AccessKubernetesForm = ({ data, op, onAfterReq }: AccessKubernetesFormProp
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -187,7 +186,6 @@ const AccessKubernetesForm = ({ data, op, onAfterReq }: AccessKubernetesFormProp
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -82,7 +82,6 @@ const AccessLocalForm = ({ data, op, onAfterReq }: AccessLocalFormProps) => {
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -143,7 +142,6 @@ const AccessLocalForm = ({ data, op, onAfterReq }: AccessLocalFormProps) => {
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -88,7 +88,6 @@ const AccessNamesiloForm = ({ data, op, onAfterReq }: AccessNamesiloFormProps) =
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -162,7 +161,6 @@ const AccessNamesiloForm = ({ data, op, onAfterReq }: AccessNamesiloFormProps) =
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -95,7 +95,6 @@ const AccessPdnsForm = ({ data, op, onAfterReq }: AccessPdnsFormProps) => {
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -186,10 +185,8 @@ const AccessPdnsForm = ({ data, op, onAfterReq }: AccessPdnsFormProps) => {
</div>
</form>
</Form>
</div>
</>
);
};
export default AccessPdnsForm;

View File

@ -91,7 +91,6 @@ const AccessQiniuForm = ({ data, op, onAfterReq }: AccessQiniuFormProps) => {
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -182,7 +181,6 @@ const AccessQiniuForm = ({ data, op, onAfterReq }: AccessQiniuFormProps) => {
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -193,7 +193,6 @@ const AccessSSHForm = ({ data, op, onAfterReq }: AccessSSHFormProps) => {
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -419,7 +418,6 @@ const AccessSSHForm = ({ data, op, onAfterReq }: AccessSSHFormProps) => {
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -95,7 +95,6 @@ const AccessTencentForm = ({ data, op, onAfterReq }: AccessTencentFormProps) =>
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -184,7 +183,6 @@ const AccessTencentForm = ({ data, op, onAfterReq }: AccessTencentFormProps) =>
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -85,7 +85,6 @@ const AccessWebhookForm = ({ data, op, onAfterReq }: AccessWebhookFormProps) =>
return (
<>
<div className="max-w-[35em] mx-auto mt-10">
<Form {...form}>
<form
onSubmit={(e) => {
@ -159,7 +158,6 @@ const AccessWebhookForm = ({ data, op, onAfterReq }: AccessWebhookFormProps) =>
</div>
</form>
</Form>
</div>
</>
);
};

View File

@ -13,7 +13,7 @@ import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Textarea } from "@/components/ui/textarea";
import AccessEdit from "./AccessEdit";
import AccessEditDialog from "./AccessEditDialog";
import KVList from "./KVList";
import { DeployConfig, KVType, targetTypeKeys, targetTypeMap } from "@/domain/domain";
import { accessTypeMap } from "@/domain/access";
@ -365,7 +365,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
<div>
<Label className="flex justify-between">
<div>{t("domain.deployment.form.access.label")}</div>
<AccessEdit
<AccessEditDialog
trigger={
<div className="font-normal text-primary hover:underline cursor-pointer flex items-center">
<Plus size={14} />
@ -889,4 +889,3 @@ const DeployToKubernetes = () => {
</>
);
};

View File

@ -35,7 +35,7 @@
"domain.application.form.email.list": "邮箱列表",
"domain.application.form.access.label": "DNS 服务商授权配置",
"domain.application.form.access.placeholder": "请选择 DNS 服务商授权配置",
"domain.application.form.access.list": "已有的 DNS 服务商授权配置",
"domain.application.form.access.list": "DNS 服务商授权配置列表",
"domain.application.form.advanced_settings.label": "高级设置",
"domain.application.form.key_algorithm.label": "数字证书算法",
"domain.application.form.key_algorithm.placeholder": "请选择数字证书算法",
@ -47,10 +47,10 @@
"domain.deployment.nodata": "暂无部署配置,请添加后开始部署证书吧",
"domain.deployment.form.type.label": "部署方式",
"domain.deployment.form.type.placeholder": "请选择部署方式",
"domain.deployment.form.type.list": "支持的部署方式",
"domain.deployment.form.type.list": "部署方式列表",
"domain.deployment.form.access.label": "授权配置",
"domain.deployment.form.access.placeholder": "请选择授权配置",
"domain.deployment.form.access.list": "已有的服务商授权配置",
"domain.deployment.form.access.list": "服务商授权配置列表",
"domain.deployment.form.domain.label": "部署到域名(仅支持单个域名;不支持泛域名)",
"domain.deployment.form.domain.placeholder": "请输入部署到的域名",
"domain.deployment.form.ssh_key_path.label": "私钥保存路径",

View File

@ -16,7 +16,7 @@ import {
import { Button } from "@/components/ui/button";
import { Separator } from "@/components/ui/separator";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import AccessEdit from "@/components/certimate/AccessEdit";
import AccessEditDialog from "@/components/certimate/AccessEditDialog";
import AccessGroupEdit from "@/components/certimate/AccessGroupEdit";
import AccessGroupList from "@/components/certimate/AccessGroupList";
import XPagination from "@/components/certimate/XPagination";
@ -62,7 +62,7 @@ const Access = () => {
<div className="flex justify-between items-center">
<div className="text-muted-foreground">{t("access.page.title")}</div>
{tab != "access_group" ? (
<AccessEdit trigger={<Button>{t("access.authorization.add")}</Button>} op="add" />
<AccessEditDialog trigger={<Button>{t("access.authorization.add")}</Button>} op="add" />
) : (
<AccessGroupEdit trigger={<Button>{t("access.group.add")}</Button>} />
)}
@ -95,7 +95,7 @@ const Access = () => {
</span>
<div className="text-center text-sm text-muted-foreground mt-3">{t("access.authorization.nodata")}</div>
<AccessEdit trigger={<Button>{t("access.authorization.add")}</Button>} op="add" className="mt-3" />
<AccessEditDialog trigger={<Button>{t("access.authorization.add")}</Button>} op="add" className="mt-3" />
</div>
) : (
<>
@ -126,7 +126,7 @@ const Access = () => {
<div className="sm:w-60 w-full pt-1 sm:pt-0 flex items-center">{access.created && convertZulu2Beijing(access.created)}</div>
<div className="sm:w-60 w-full pt-1 sm:pt-0 flex items-center">{access.updated && convertZulu2Beijing(access.updated)}</div>
<div className="flex items-center grow justify-start pt-1 sm:pt-0">
<AccessEdit
<AccessEditDialog
trigger={
<Button variant={"link"} className="p-0">
{t("common.edit")}
@ -136,7 +136,7 @@ const Access = () => {
data={access}
/>
<Separator orientation="vertical" className="h-4 mx-2" />
<AccessEdit
<AccessEditDialog
trigger={
<Button variant={"link"} className="p-0">
{t("common.copy")}

View File

@ -15,7 +15,7 @@ import { Input } from "@/components/ui/input";
import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Toaster } from "@/components/ui/toaster";
import { useToast } from "@/components/ui/use-toast";
import AccessEdit from "@/components/certimate/AccessEdit";
import AccessEditDialog from "@/components/certimate/AccessEditDialog";
import DeployList from "@/components/certimate/DeployList";
import EmailsEdit from "@/components/certimate/EmailsEdit";
import StringList from "@/components/certimate/StringList";
@ -295,7 +295,7 @@ const Edit = () => {
<FormItem>
<FormLabel className="flex w-full justify-between">
<div>{t("domain.application.form.access.label")}</div>
<AccessEdit
<AccessEditDialog
trigger={
<div className="font-normal text-primary hover:underline cursor-pointer flex items-center">
<Plus size={14} />