wood/certimate
1
0
Fork 0
mirror of https://github.com/woodchen-ink/certimate.git synced 2025-07-19 01:41:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: clean code

Browse Source
This commit is contained in:
Fu Diwei 2024-10-22 12:20:13 +08:00
parent 716f5f1426
commit e53749e16e
21 changed files with 167 additions and 202 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ui/src/components/certimate/AccessAliyunForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, AliyunConfig, accessFormType, getUsageByConfigType } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type AliyunConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessAliyunForm = ({ data, op, onAfterReq }: AccessAliyunFormProps) => {
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
accessKeyId: z
.string()
.min(1, "access.authorization.form.access_key_id.placeholder")
@ -60,7 +60,7 @@ const AccessAliyunForm = ({ data, op, onAfterReq }: AccessAliyunFormProps) => {
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
accessKeyId: data.accessKeyId,
accessKeySecret: data.accessSecretId,

6
ui/src/components/certimate/AccessAwsForm.tsx
View File

@ -8,7 +8,7 @@ import { Input } from "@/components/ui/input";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Button } from "@/components/ui/button";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, AwsConfig, getUsageByConfigType } from "@/domain/access";
import { Access, accessProvidersMap, accessTypeFormSchema, type AwsConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessAwsForm = ({ data, op, onAfterReq }: AccessAwsFormProps) => {
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
region: z
.string()
.min(1, "access.authorization.form.region.placeholder")
@ -72,7 +72,7 @@ const AccessAwsForm = ({ data, op, onAfterReq }: AccessAwsFormProps) => {
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
region: data.region,
accessKeyId: data.accessKeyId,

6
ui/src/components/certimate/AccessCloudflareForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, CloudflareConfig, getUsageByConfigType } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type CloudflareConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessCloudflareForm = ({ data, op, onAfterReq }: AccessCloudflareFormProp
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
dnsApiToken: z
.string()
.min(1, "access.authorization.form.cloud_dns_api_token.placeholder")
@ -54,7 +54,7 @@ const AccessCloudflareForm = ({ data, op, onAfterReq }: AccessCloudflareFormProp
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
dnsApiToken: data.dnsApiToken,
},

11
ui/src/components/certimate/AccessEditDialog.tsx
View File

@ -20,7 +20,7 @@ import AccessLocalForm from "./AccessLocalForm";
import AccessSSHForm from "./AccessSSHForm";
import AccessWebhookForm from "./AccessWebhookForm";
import AccessKubernetesForm from "./AccessKubernetesForm";
import { Access, accessTypeMap } from "@/domain/access";
import { Access, accessProvidersMap } from "@/domain/access";
type AccessEditProps = {
op: "add" | "edit" | "copy";
@ -30,10 +30,9 @@ type AccessEditProps = {
};
const AccessEditDialog = ({ trigger, op, data, className }: AccessEditProps) => {
const [open, setOpen] = useState(false);
const { t } = useTranslation();
const typeKeys = Array.from(accessTypeMap.keys());
const [open, setOpen] = useState(false);
const [configType, setConfigType] = useState(data?.configType || "");
@ -232,11 +231,11 @@ const AccessEditDialog = ({ trigger, op, data, className }: AccessEditProps) =>
<SelectContent>
<SelectGroup>
<SelectLabel>{t("access.authorization.form.type.list")}</SelectLabel>
{typeKeys.map((key) => (
{Array.from(accessProvidersMap.entries()).map(([key, provider]) => (
<SelectItem value={key} key={key}>
<div className={cn("flex items-center space-x-2 rounded cursor-pointer", getOptionCls(key))}>
<img src={accessTypeMap.get(key)?.[1]} className="h-6 w-6" />
<div>{t(accessTypeMap.get(key)?.[0] || "")}</div>
<img src={provider.icon} className="h-6 w-6" />
<div>{t(provider.name)}</div>
</div>
</SelectItem>
))}

6
ui/src/components/certimate/AccessGodaddyForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, getUsageByConfigType, GodaddyConfig } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type GodaddyConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessGodaddyForm = ({ data, op, onAfterReq }: AccessGodaddyFormProps) =>
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
apiKey: z
.string()
.min(1, "access.authorization.form.godaddy_api_key.placeholder")
@ -60,7 +60,7 @@ const AccessGodaddyForm = ({ data, op, onAfterReq }: AccessGodaddyFormProps) =>
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
apiKey: data.apiKey,
apiSecret: data.apiSecret,

6
ui/src/components/certimate/AccessGroupList.tsx
View File

@ -19,7 +19,7 @@ import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle }
import { ScrollArea } from "@/components/ui/scroll-area";
import { useToast } from "@/components/ui/use-toast";
import AccessGroupEdit from "./AccessGroupEdit";
import { getProviderInfo } from "@/domain/access";
import { accessProvidersMap } from "@/domain/access";
import { getErrMessage } from "@/lib/error";
import { useConfigContext } from "@/providers/config";
import { remove } from "@/repository/access_group";
@ -86,11 +86,11 @@ const AccessGroupList = () => {
<div key={access.id} className="flex flex-col mb-3">
<div className="flex items-center">
<div className="">
<img src={getProviderInfo(access.configType)![1]} alt="provider" className="w-8 h-8"></img>
<img src={accessProvidersMap.get(access.configType)!.icon} alt="provider" className="w-8 h-8"></img>
</div>
<div className="ml-3">
<div className="text-sm font-semibold text-gray-700 dark:text-gray-200">{access.name}</div>
<div className="text-xs text-muted-foreground">{getProviderInfo(access.configType)![0]}</div>
<div className="text-xs text-muted-foreground">{accessProvidersMap.get(access.configType)!.name}</div>
</div>
</div>
</div>

6
ui/src/components/certimate/AccessHttpreqForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, HttpreqConfig, accessFormType, getUsageByConfigType } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type HttpreqConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessHttpreqForm = ({ data, op, onAfterReq }: AccessHttpreqFormProps) =>
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
endpoint: z.string().url("common.errmsg.url_invalid"),
mode: z.enum(["RAW", ""]),
username: z
@ -66,7 +66,7 @@ const AccessHttpreqForm = ({ data, op, onAfterReq }: AccessHttpreqFormProps) =>
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
endpoint: data.endpoint,
mode: data.mode,

6
ui/src/components/certimate/AccessHuaweicloudForm.tsx
View File

@ -8,7 +8,7 @@ import { Input } from "@/components/ui/input";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Button } from "@/components/ui/button";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, HuaweiCloudConfig, getUsageByConfigType } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type HuaweiCloudConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessHuaweiCloudForm = ({ data, op, onAfterReq }: AccessHuaweiCloudFormPr
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
region: z
.string()
.min(1, "access.authorization.form.region.placeholder")
@ -66,7 +66,7 @@ const AccessHuaweiCloudForm = ({ data, op, onAfterReq }: AccessHuaweiCloudFormPr
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
region: data.region,
accessKeyId: data.accessKeyId,

6
ui/src/components/certimate/AccessKubernetesForm.tsx
View File

@ -5,12 +5,12 @@ import { z } from "zod";
import { zodResolver } from "@hookform/resolvers/zod";
import { ClientResponseError } from "pocketbase";
import { Access, accessFormType, getUsageByConfigType, KubernetesConfig } from "@/domain/access";
import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { readFileContent } from "@/lib/file";
import { PbErrorData } from "@/domain/base";
import { accessProvidersMap, accessTypeFormSchema, type Access, type KubernetesConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -34,7 +34,7 @@ const AccessKubernetesForm = ({ data, op, onAfterReq }: AccessKubernetesFormProp
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
kubeConfig: z
.string()
.min(1, "access.authorization.form.k8s_kubeconfig.placeholder")
@ -64,7 +64,7 @@ const AccessKubernetesForm = ({ data, op, onAfterReq }: AccessKubernetesFormProp
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
kubeConfig: data.kubeConfig,
},

6
ui/src/components/certimate/AccessLocalForm.tsx
View File

@ -8,7 +8,7 @@ import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, getUsageByConfigType } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -28,7 +28,7 @@ const AccessLocalForm = ({ data, op, onAfterReq }: AccessLocalFormProps) => {
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
});
const form = useForm<z.infer<typeof formSchema>>({
@ -45,7 +45,7 @@ const AccessLocalForm = ({ data, op, onAfterReq }: AccessLocalFormProps) => {
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {},
};

6
ui/src/components/certimate/AccessNamesiloForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, getUsageByConfigType, NamesiloConfig } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type NamesiloConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessNamesiloForm = ({ data, op, onAfterReq }: AccessNamesiloFormProps) =
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
apiKey: z
.string()
.min(1, "access.authorization.form.namesilo_api_key.placeholder")
@ -54,7 +54,7 @@ const AccessNamesiloForm = ({ data, op, onAfterReq }: AccessNamesiloFormProps) =
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
apiKey: data.apiKey,
},

6
ui/src/components/certimate/AccessPdnsForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, PdnsConfig, accessFormType, getUsageByConfigType } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type PdnsConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessPdnsForm = ({ data, op, onAfterReq }: AccessPdnsFormProps) => {
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
apiUrl: z.string().url("common.errmsg.url_invalid"),
apiKey: z
.string()
@ -57,7 +57,7 @@ const AccessPdnsForm = ({ data, op, onAfterReq }: AccessPdnsFormProps) => {
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
apiUrl: data.apiUrl,
apiKey: data.apiKey,

6
ui/src/components/certimate/AccessQiniuForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, getUsageByConfigType, QiniuConfig } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type QiniuConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessQiniuForm = ({ data, op, onAfterReq }: AccessQiniuFormProps) => {
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
accessKey: z.string().min(1, "access.authorization.form.access_key.placeholder").max(64),
secretKey: z.string().min(1, "access.authorization.form.secret_key.placeholder").max(64),
});
@ -54,7 +54,7 @@ const AccessQiniuForm = ({ data, op, onAfterReq }: AccessQiniuFormProps) => {
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
accessKey: data.accessKey,
secretKey: data.secretKey,

6
ui/src/components/certimate/AccessSSHForm.tsx
View File

@ -6,7 +6,6 @@ import { zodResolver } from "@hookform/resolvers/zod";
import { Plus } from "lucide-react";
import { ClientResponseError } from "pocketbase";
import { Access, accessFormType, getUsageByConfigType, SSHConfig } from "@/domain/access";
import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
@ -15,6 +14,7 @@ import AccessGroupEdit from "./AccessGroupEdit";
import { readFileContent } from "@/lib/file";
import { cn } from "@/lib/utils";
import { PbErrorData } from "@/domain/base";
import { accessProvidersMap, accessTypeFormSchema, type Access, type SSHConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { updateById } from "@/repository/access_group";
import { useConfigContext } from "@/providers/config";
@ -50,7 +50,7 @@ const AccessSSHForm = ({ data, op, onAfterReq }: AccessSSHFormProps) => {
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
host: z.string().refine(
(str) => {
return ipReg.test(str) || domainReg.test(str);
@ -119,7 +119,7 @@ const AccessSSHForm = ({ data, op, onAfterReq }: AccessSSHFormProps) => {
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
group: group,
config: {
host: data.host,

6
ui/src/components/certimate/AccessTencentForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, getUsageByConfigType, TencentConfig } from "@/domain/access";
import { accessProvidersMap, accessTypeFormSchema, type Access, type TencentConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessTencentForm = ({ data, op, onAfterReq }: AccessTencentFormProps) =>
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
secretId: z
.string()
.min(1, "access.authorization.form.secret_id.placeholder")
@ -60,7 +60,7 @@ const AccessTencentForm = ({ data, op, onAfterReq }: AccessTencentFormProps) =>
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
secretId: data.secretId,
secretKey: data.secretKey,

6
ui/src/components/certimate/AccessWebhookForm.tsx
View File

@ -8,7 +8,7 @@ import { Button } from "@/components/ui/button";
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { PbErrorData } from "@/domain/base";
import { Access, accessFormType, getUsageByConfigType, WebhookConfig } from "@/domain/access";
import { Access, accessProvidersMap, accessTypeFormSchema, WebhookConfig } from "@/domain/access";
import { save } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -27,7 +27,7 @@ const AccessWebhookForm = ({ data, op, onAfterReq }: AccessWebhookFormProps) =>
.string()
.min(1, "access.authorization.form.name.placeholder")
.max(64, t("common.errmsg.string_max", { max: 64 })),
configType: accessFormType,
configType: accessTypeFormSchema,
url: z.string().url("common.errmsg.url_invalid"),
});
@ -51,7 +51,7 @@ const AccessWebhookForm = ({ data, op, onAfterReq }: AccessWebhookFormProps) =>
id: data.id as string,
name: data.name,
configType: data.configType,
usage: getUsageByConfigType(data.configType),
usage: accessProvidersMap.get(data.configType)!.usage,
config: {
url: data.url,
},

146
ui/src/components/certimate/DeployList.tsx
View File

@ -16,8 +16,8 @@ import { Textarea } from "@/components/ui/textarea";
import AccessEditDialog from "./AccessEditDialog";
import KVList from "./KVList";
import { DeployConfig, KVType, targetTypeKeys, targetTypeMap } from "@/domain/domain";
import { accessTypeMap } from "@/domain/access";
import { useConfig } from "@/providers/config";
import { accessProvidersMap } from "@/domain/access";
import { useConfigContext } from "@/providers/config";
type DeployEditContextProps = {
deploy: DeployConfig;
@ -32,6 +32,68 @@ export const useDeployEditContext = () => {
return useContext(DeployEditContext);
};
type DeployItemProps = {
item: DeployConfig;
onDelete: () => void;
onSave: (deploy: DeployConfig) => void;
};
const DeployItem = ({ item, onDelete, onSave }: DeployItemProps) => {
const {
config: { accesses },
} = useConfigContext();
const { t } = useTranslation();
const access = accesses.find((access) => access.id === item.access);
const getTypeIcon = () => {
if (!access) {
return "";
}
return accessProvidersMap.get(access.configType)?.icon || "";
};
const getTypeName = () => {
if (!access) {
return "";
}
return t(accessProvidersMap.get(access.configType)?.name || "");
};
return (
<div className="flex justify-between text-sm p-3 items-center text-stone-700 dark:text-stone-200">
<div className="flex space-x-2 items-center">
<div>
<img src={getTypeIcon()} className="w-9"></img>
</div>
<div className="text-stone-600 flex-col flex space-y-0 dark:text-stone-200">
<div>{getTypeName()}</div>
<div>{access?.name}</div>
</div>
</div>
<div className="flex space-x-2">
<DeployEditDialog
trigger={<EditIcon size={16} className="cursor-pointer" />}
deployConfig={item}
onSave={(deploy: DeployConfig) => {
onSave(deploy);
}}
/>
<Trash2
size={16}
className="cursor-pointer"
onClick={() => {
onDelete();
}}
/>
</div>
</div>
);
};
type DeployListProps = {
deploys: DeployConfig[];
onChange: (deploys: DeployConfig[]) => void;
@ -129,80 +191,6 @@ const DeployList = ({ deploys, onChange }: DeployListProps) => {
export default DeployList;
type DeployItemProps = {
item: DeployConfig;
onDelete: () => void;
onSave: (deploy: DeployConfig) => void;
};
const DeployItem = ({ item, onDelete, onSave }: DeployItemProps) => {
const {
config: { accesses },
} = useConfig();
const { t } = useTranslation();
const access = accesses.find((access) => access.id === item.access);
const getTypeIcon = () => {
if (!access) {
return "";
}
const accessType = accessTypeMap.get(access.configType);
if (accessType) {
return accessType[1];
}
return "";
};
const getTypeName = () => {
if (!access) {
return "";
}
const accessType = targetTypeMap.get(item.type);
if (accessType) {
return t(accessType[0]);
}
return "";
};
return (
<div className="flex justify-between text-sm p-3 items-center text-stone-700 dark:text-stone-200">
<div className="flex space-x-2 items-center">
<div>
<img src={getTypeIcon()} className="w-9"></img>
</div>
<div className="text-stone-600 flex-col flex space-y-0 dark:text-stone-200">
<div>{getTypeName()}</div>
<div>{access?.name}</div>
</div>
</div>
<div className="flex space-x-2">
<DeployEditDialog
trigger={<EditIcon size={16} className="cursor-pointer" />}
deployConfig={item}
onSave={(deploy: DeployConfig) => {
onSave(deploy);
}}
/>
<Trash2
size={16}
className="cursor-pointer"
onClick={() => {
onDelete();
}}
/>
</div>
</div>
);
};
type DeployEditDialogProps = {
trigger: React.ReactNode;
deployConfig?: DeployConfig;
@ -212,7 +200,7 @@ type DeployEditDialogProps = {
const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogProps) => {
const {
config: { accesses },
} = useConfig();
} = useConfigContext();
const [deployType, setDeployType] = useState<TargetType>();
@ -317,8 +305,8 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
<DeployEditContext.Provider
value={{
deploy: locDeployConfig,
setDeploy: setDeploy,
error: error,
setDeploy: setDeploy,
setError: setError,
}}
>
@ -391,7 +379,7 @@ const DeployEditDialog = ({ trigger, deployConfig, onSave }: DeployEditDialogPro
{targetAccesses.map((item) => (
<SelectItem key={item.id} value={item.id}>
<div className="flex items-center space-x-2">
<img className="w-6" src={accessTypeMap.get(item.configType)?.[1]} />
<img className="w-6" src={accessProvidersMap.get(item.configType)?.icon} />
<div>{item.name}</div>
</div>
</SelectItem>

104
ui/src/domain/access.ts
View File

@ -1,53 +1,58 @@
import { z } from "zod";
export const accessTypeMap: Map<string, [string, string]> = new Map([
["aliyun", ["common.provider.aliyun", "/imgs/providers/aliyun.svg"]],
["tencent", ["common.provider.tencent", "/imgs/providers/tencent.svg"]],
["huaweicloud", ["common.provider.huaweicloud", "/imgs/providers/huaweicloud.svg"]],
["qiniu", ["common.provider.qiniu", "/imgs/providers/qiniu.svg"]],
["aws", ["common.provider.aws", "/imgs/providers/aws.svg"]],
["cloudflare", ["common.provider.cloudflare", "/imgs/providers/cloudflare.svg"]],
["namesilo", ["common.provider.namesilo", "/imgs/providers/namesilo.svg"]],
["godaddy", ["common.provider.godaddy", "/imgs/providers/godaddy.svg"]],
["pdns", ["common.provider.pdns", "/imgs/providers/pdns.svg"]],
["httpreq", ["common.provider.httpreq", "/imgs/providers/httpreq.svg"]],
["local", ["common.provider.local", "/imgs/providers/local.svg"]],
["ssh", ["common.provider.ssh", "/imgs/providers/ssh.svg"]],
["webhook", ["common.provider.webhook", "/imgs/providers/webhook.svg"]],
["k8s", ["common.provider.kubernetes", "/imgs/providers/k8s.svg"]],
]);
type AccessUsages = "apply" | "deploy" | "all";
export const getProviderInfo = (t: string) => {
return accessTypeMap.get(t);
type AccessProvider = {
type: string;
name: string;
icon: string;
usage: AccessUsages;
};
export const accessFormType = z.union(
export const accessProvidersMap: Map<AccessProvider["type"], AccessProvider> = new Map(
[
z.literal("aliyun"),
z.literal("tencent"),
z.literal("huaweicloud"),
z.literal("qiniu"),
z.literal("aws"),
z.literal("cloudflare"),
z.literal("namesilo"),
z.literal("godaddy"),
z.literal("pdns"),
z.literal("httpreq"),
z.literal("local"),
z.literal("ssh"),
z.literal("webhook"),
z.literal("k8s"),
["aliyun", "common.provider.aliyun", "/imgs/providers/aliyun.svg", "all"],
["tencent", "common.provider.tencent", "/imgs/providers/tencent.svg", "all"],
["huaweicloud", "common.provider.huaweicloud", "/imgs/providers/huaweicloud.svg", "all"],
["qiniu", "common.provider.qiniu", "/imgs/providers/qiniu.svg", "deploy"],
["aws", "common.provider.aws", "/imgs/providers/aws.svg", "apply"],
["cloudflare", "common.provider.cloudflare", "/imgs/providers/cloudflare.svg", "apply"],
["namesilo", "common.provider.namesilo", "/imgs/providers/namesilo.svg", "apply"],
["godaddy", "common.provider.godaddy", "/imgs/providers/godaddy.svg", "apply"],
["pdns", "common.provider.pdns", "/imgs/providers/pdns.svg", "apply"],
["httpreq", "common.provider.httpreq", "/imgs/providers/httpreq.svg", "apply"],
["local", "common.provider.local", "/imgs/providers/local.svg", "deploy"],
["ssh", "common.provider.ssh", "/imgs/providers/ssh.svg", "deploy"],
["webhook", "common.provider.webhook", "/imgs/providers/webhook.svg", "deploy"],
["k8s", "common.provider.kubernetes", "/imgs/providers/k8s.svg", "deploy"],
].map(([type, name, icon, usage]) => [type, { type, name, icon, usage: usage as AccessUsages }])
);
export const accessTypeFormSchema = z.union(
[
z.literal("aliyun" as string),
z.literal("tencent" as string),
z.literal("huaweicloud" as string),
z.literal("qiniu" as string),
z.literal("aws" as string),
z.literal("cloudflare" as string),
z.literal("namesilo" as string),
z.literal("godaddy" as string),
z.literal("pdns" as string),
z.literal("httpreq" as string),
z.literal("local" as string),
z.literal("ssh" as string),
z.literal("webhook" as string),
z.literal("k8s" as string),
],
{ message: "access.authorization.form.type.placeholder" }
);
type AccessUsage = "apply" | "deploy" | "all";
export type Access = {
id: string;
name: string;
configType: string;
usage: AccessUsage;
usage: AccessUsages;
group?: string;
config:
| AliyunConfig
@ -141,30 +146,3 @@ export type WebhookConfig = {
export type KubernetesConfig = {
kubeConfig: string;
};
export const getUsageByConfigType = (configType: string): AccessUsage => {
switch (configType) {
case "aliyun":
case "tencent":
case "huaweicloud":
return "all";
case "qiniu":
case "local":
case "ssh":
case "webhook":
case "k8s":
return "deploy";
case "aws":
case "cloudflare":
case "namesilo":
case "godaddy":
case "pdns":
case "httpreq":
return "apply";
default:
return "all";
}
};

6
ui/src/pages/access/Access.tsx
View File

@ -21,7 +21,7 @@ import AccessGroupEdit from "@/components/certimate/AccessGroupEdit";
import AccessGroupList from "@/components/certimate/AccessGroupList";
import XPagination from "@/components/certimate/XPagination";
import { convertZulu2Beijing } from "@/lib/time";
import { Access as AccessType, accessTypeMap } from "@/domain/access";
import { Access as AccessType, accessProvidersMap } from "@/domain/access";
import { remove } from "@/repository/access";
import { useConfigContext } from "@/providers/config";
@ -119,8 +119,8 @@ const Access = () => {
>
<div className="sm:w-48 w-full pt-1 sm:pt-0 flex items-center">{access.name}</div>
<div className="sm:w-48 w-full pt-1 sm:pt-0 flex items-center space-x-2">
<img src={accessTypeMap.get(access.configType)?.[1]} className="w-6" />
<div>{t(accessTypeMap.get(access.configType)?.[0] || "")}</div>
<img src={accessProvidersMap.get(access.configType)?.icon} className="w-6" />
<div>{t(accessProvidersMap.get(access.configType)?.name || "")}</div>
</div>
<div className="sm:w-60 w-full pt-1 sm:pt-0 flex items-center">{access.created && convertZulu2Beijing(access.created)}</div>

4
ui/src/pages/domains/Edit.tsx
View File

@ -21,7 +21,7 @@ import EmailsEdit from "@/components/certimate/EmailsEdit";
import StringList from "@/components/certimate/StringList";
import { cn } from "@/lib/utils";
import { PbErrorData } from "@/domain/base";
import { accessTypeMap } from "@/domain/access";
import { accessProvidersMap } from "@/domain/access";
import { EmailsSetting } from "@/domain/settings";
import { DeployConfig, Domain } from "@/domain/domain";
import { save, get } from "@/repository/domains";
@ -330,7 +330,7 @@ const Edit = () => {
.map((item) => (
<SelectItem key={item.id} value={item.id}>
<div className="flex items-center space-x-2">
<img className="w-6" src={accessTypeMap.get(item.configType)?.[1]} />
<img className="w-6" src={accessProvidersMap.get(item.configType)?.icon} />
<div>{item.name}</div>
</div>
</SelectItem>

8
ui/src/providers/config/index.tsx
View File

@ -16,10 +16,10 @@ export type ConfigData = {
export type ConfigContext = {
config: ConfigData;
deleteAccess: (id: string) => void;
setEmails: (email: Setting) => void;
addAccess: (access: Access) => void;
updateAccess: (access: Access) => void;
setEmails: (email: Setting) => void;
deleteAccess: (id: string) => void;
setAccessGroups: (accessGroups: AccessGroup[]) => void;
reloadAccessGroups: () => void;
};
@ -96,10 +96,10 @@ export const ConfigProvider = ({ children }: ConfigProviderProps) => {
emails: config.emails,
accessGroups: config.accessGroups,
},
deleteAccess,
addAccess,
setEmails,
addAccess,
updateAccess,
deleteAccess,
setAccessGroups,
reloadAccessGroups,
}}