wood/certimate
1
0
Fork 0
mirror of https://github.com/woodchen-ink/certimate.git synced 2025-07-18 09:21:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: clean code

Browse Source
This commit is contained in:
Fu Diwei 2025-04-02 21:46:27 +08:00
parent 0edcd9174f
commit d76e1a3204
6 changed files with 35 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/src/components/access/AccessEditDrawer.tsx
View File

@ -64,7 +64,7 @@ const AccessEditDrawer = ({ data, loading, trigger, scene, range, afterSubmit, .
values = await updateAccess({ ...data, ...values });
} else {
throw "Invalid props: `preset`";
throw "Invalid props: `scene`";
}
afterSubmit?.(values);

16
ui/src/components/provider/AccessProviderSelect.tsx
View File

@ -31,16 +31,16 @@ const AccessProviderSelect = ({ filter, showOptionTags, ...props }: AccessProvid
);
}, [filter]);
const showOptionTagsForDNS = useMemo(() => {
const showOptionTagForDNS = useMemo(() => {
return typeof showOptionTags === "object" ? !!showOptionTags[ACCESS_USAGES.DNS] : !!showOptionTags;
}, [showOptionTags]);
const showOptionTagsForHosting = useMemo(() => {
const showOptionTagForHosting = useMemo(() => {
return typeof showOptionTags === "object" ? !!showOptionTags[ACCESS_USAGES.HOSTING] : !!showOptionTags;
}, [showOptionTags]);
const showOptionTagsForCA = useMemo(() => {
const showOptionTagForCA = useMemo(() => {
return typeof showOptionTags === "object" ? !!showOptionTags[ACCESS_USAGES.CA] : !!showOptionTags;
}, [showOptionTags]);
const showOptionTagsForNotification = useMemo(() => {
const showOptionTagForNotification = useMemo(() => {
return typeof showOptionTags === "object" ? !!showOptionTags[ACCESS_USAGES.NOTIFICATION] : !!showOptionTags;
}, [showOptionTags]);
@ -56,16 +56,16 @@ const AccessProviderSelect = ({ filter, showOptionTags, ...props }: AccessProvid
</Space>
{showOptionTags && (
<div>
<Show when={showOptionTagsForDNS && provider.usages.includes(ACCESS_USAGES.DNS)}>
<Show when={showOptionTagForDNS && provider.usages.includes(ACCESS_USAGES.DNS)}>
<Tag color="peru">{t("access.props.provider.usage.dns")}</Tag>
</Show>
<Show when={showOptionTagsForHosting && provider.usages.includes(ACCESS_USAGES.HOSTING)}>
<Show when={showOptionTagForHosting && provider.usages.includes(ACCESS_USAGES.HOSTING)}>
<Tag color="royalblue">{t("access.props.provider.usage.hosting")}</Tag>
</Show>
<Show when={showOptionTagsForCA && provider.usages.includes(ACCESS_USAGES.CA)}>
<Show when={showOptionTagForCA && provider.usages.includes(ACCESS_USAGES.CA)}>
<Tag color="crimson">{t("access.props.provider.usage.ca")}</Tag>
</Show>
<Show when={showOptionTagsForNotification && provider.usages.includes(ACCESS_USAGES.NOTIFICATION)}>
<Show when={showOptionTagForNotification && provider.usages.includes(ACCESS_USAGES.NOTIFICATION)}>
<Tag color="mediumaquamarine">{t("access.props.provider.usage.notification")}</Tag>
</Show>
</div>

25
ui/src/components/provider/ApplyDNSProviderPicker.tsx
View File

@ -1,4 +1,4 @@
import { memo, useEffect, useRef, useState } from "react";
import { memo, useEffect, useMemo, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { Avatar, Card, Col, Empty, Flex, Input, type InputRef, Row, Typography } from "antd";
@ -24,15 +24,16 @@ const ApplyDNSProviderPicker = ({ className, style, autoFocus, placeholder, onSe
}
}, []);
const providers = Array.from(applyDNSProvidersMap.values());
const filteredProviders = providers.filter((provider) => {
if (keyword) {
const value = keyword.toLowerCase();
return provider.type.toLowerCase().includes(value) || t(provider.name).toLowerCase().includes(value);
}
const providers = useMemo(() => {
return Array.from(applyDNSProvidersMap.values()).filter((provider) => {
if (keyword) {
const value = keyword.toLowerCase();
return provider.type.toLowerCase().includes(value) || t(provider.name).toLowerCase().includes(value);
}
return true;
});
return true;
});
}, [keyword]);
const handleProviderTypeSelect = (value: string) => {
onSelect?.(value);
@ -40,12 +41,12 @@ const ApplyDNSProviderPicker = ({ className, style, autoFocus, placeholder, onSe
return (
<div className={className} style={style}>
<Input.Search ref={keywordInputRef} placeholder={placeholder} onChange={(e) => setKeyword(e.target.value.trim())} />
<Input.Search ref={keywordInputRef} placeholder={placeholder ?? t("common.text.search")} onChange={(e) => setKeyword(e.target.value.trim())} />
<div className="mt-4">
<Show when={filteredProviders.length > 0} fallback={<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}>
<Show when={providers.length > 0} fallback={<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}>
<Row gutter={[16, 16]}>
{filteredProviders.map((provider, index) => {
{providers.map((provider, index) => {
return (
<Col key={index} xs={24} md={12} span={12}>
<Card

22
ui/src/components/provider/DeployProviderPicker.tsx
View File

@ -16,6 +16,8 @@ export type DeployProviderPickerProps = {
const DeployProviderPicker = ({ className, style, autoFocus, placeholder, onSelect }: DeployProviderPickerProps) => {
const { t } = useTranslation();
const [category, setCategory] = useState<string>(DEPLOY_CATEGORIES.ALL);
const [keyword, setKeyword] = useState<string>();
const keywordInputRef = useRef<InputRef>(null);
useEffect(() => {
@ -24,26 +26,24 @@ const DeployProviderPicker = ({ className, style, autoFocus, placeholder, onSele
}
}, []);
const [category, setCategory] = useState<string>(DEPLOY_CATEGORIES.ALL);
const providers = useMemo(() => {
return Array.from(deployProvidersMap.values())
.filter((provider) => {
if (category && category !== DEPLOY_CATEGORIES.ALL) {
return provider.category === category;
}
return true;
})
.filter((provider) => {
if (keyword) {
const value = keyword.toLowerCase();
return provider.type.toLowerCase().includes(value) || t(provider.name).toLowerCase().includes(value);
}
return true;
})
.filter((provider) => {
if (category && category !== DEPLOY_CATEGORIES.ALL) {
return provider.category === category;
}
return true;
});
}, [keyword, category]);
}, [category, keyword]);
const handleProviderTypeSelect = (value: string) => {
onSelect?.(value);
@ -51,7 +51,7 @@ const DeployProviderPicker = ({ className, style, autoFocus, placeholder, onSele
return (
<div className={className} style={style}>
<Input.Search ref={keywordInputRef} placeholder={placeholder} onChange={(e) => setKeyword(e.target.value.trim())} />
<Input.Search ref={keywordInputRef} placeholder={placeholder ?? t("common.text.search")} onChange={(e) => setKeyword(e.target.value.trim())} />
<div className="mt-4">
<Flex>

1
ui/src/i18n/locales/en/nls.common.json
View File

@ -16,6 +16,7 @@
"common.text.operation_succeeded": "Operation succeeded",
"common.text.operation_failed": "Operation failed",
"common.text.request_error": "Request error",
"common.text.search": "Search ...",
"common.menu.theme": "Change theme",
"common.menu.locale": "Change language",

1
ui/src/i18n/locales/zh/nls.common.json
View File

@ -16,6 +16,7 @@
"common.text.operation_succeeded": "操作成功",
"common.text.operation_failed": "操作失败",
"common.text.request_error": "请求错误",
"common.text.search": "搜索 ……",
"common.menu.theme": "切换主题",
"common.menu.locale": "切换语言",