refactor: clean code

This commit is contained in:
Fu Diwei
2025-04-24 21:04:55 +08:00
parent 7478dd7f47
commit 794695c313
25 changed files with 616 additions and 613 deletions

View File

@@ -3,9 +3,9 @@ import { useTranslation } from "react-i18next";
import { Avatar, Card, Col, Empty, Flex, Input, type InputRef, Row, Typography } from "antd";
import Show from "@/components/Show";
import { applyDNSProvidersMap } from "@/domain/provider";
import { acmeDns01ProvidersMap } from "@/domain/provider";
export type ApplyDNSProviderPickerProps = {
export type AcmeDns01ProviderPickerProps = {
className?: string;
style?: React.CSSProperties;
autoFocus?: boolean;
@@ -13,7 +13,7 @@ export type ApplyDNSProviderPickerProps = {
onSelect?: (value: string) => void;
};
const ApplyDNSProviderPicker = ({ className, style, autoFocus, placeholder, onSelect }: ApplyDNSProviderPickerProps) => {
const AcmeDns01ProviderPicker = ({ className, style, autoFocus, placeholder, onSelect }: AcmeDns01ProviderPickerProps) => {
const { t } = useTranslation();
const [keyword, setKeyword] = useState<string>();
@@ -25,7 +25,7 @@ const ApplyDNSProviderPicker = ({ className, style, autoFocus, placeholder, onSe
}, []);
const providers = useMemo(() => {
return Array.from(applyDNSProvidersMap.values()).filter((provider) => {
return Array.from(acmeDns01ProvidersMap.values()).filter((provider) => {
if (keyword) {
const value = keyword.toLowerCase();
return provider.type.toLowerCase().includes(value) || t(provider.name).toLowerCase().includes(value);
@@ -72,4 +72,4 @@ const ApplyDNSProviderPicker = ({ className, style, autoFocus, placeholder, onSe
);
};
export default memo(ApplyDNSProviderPicker);
export default memo(AcmeDns01ProviderPicker);

View File

@@ -2,21 +2,21 @@ import { memo, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Avatar, Select, type SelectProps, Space, Typography } from "antd";
import { type NotifyProvider, notifyProvidersMap } from "@/domain/provider";
import { type AcmeDns01Provider, acmeDns01ProvidersMap } from "@/domain/provider";
export type NotifyProviderSelectProps = Omit<
export type AcmeDns01ProviderSelectProps = Omit<
SelectProps,
"filterOption" | "filterSort" | "labelRender" | "options" | "optionFilterProp" | "optionLabelProp" | "optionRender"
> & {
filter?: (record: NotifyProvider) => boolean;
filter?: (record: AcmeDns01Provider) => boolean;
};
const NotifyProviderSelect = ({ filter, ...props }: NotifyProviderSelectProps) => {
const AcmeDns01ProviderSelect = ({ filter, ...props }: AcmeDns01ProviderSelectProps) => {
const { t } = useTranslation();
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: NotifyProvider }>>([]);
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: AcmeDns01Provider }>>([]);
useEffect(() => {
const allItems = Array.from(notifyProvidersMap.values());
const allItems = Array.from(acmeDns01ProvidersMap.values());
const filteredItems = filter != null ? allItems.filter(filter) : allItems;
setOptions(
filteredItems.map((item) => ({
@@ -29,7 +29,7 @@ const NotifyProviderSelect = ({ filter, ...props }: NotifyProviderSelectProps) =
}, [filter]);
const renderOption = (key: string) => {
const provider = notifyProvidersMap.get(key);
const provider = acmeDns01ProvidersMap.get(key);
return (
<Space className="max-w-full grow overflow-hidden truncate" size={4}>
<Avatar src={provider?.icon} size="small" />
@@ -64,4 +64,4 @@ const NotifyProviderSelect = ({ filter, ...props }: NotifyProviderSelectProps) =
);
};
export default memo(NotifyProviderSelect);
export default memo(AcmeDns01ProviderSelect);

View File

@@ -2,28 +2,28 @@ import { memo, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Avatar, Select, type SelectProps, Space, Typography } from "antd";
import { type ApplyCAProvider, applyCAProvidersMap } from "@/domain/provider";
import { type CAProvider, caProvidersMap } from "@/domain/provider";
export type ApplyCAProviderSelectProps = Omit<
export type CAProviderSelectProps = Omit<
SelectProps,
"filterOption" | "filterSort" | "labelRender" | "options" | "optionFilterProp" | "optionLabelProp" | "optionRender"
> & {
filter?: (record: ApplyCAProvider) => boolean;
filter?: (record: CAProvider) => boolean;
};
const ApplyCAProviderSelect = ({ filter, ...props }: ApplyCAProviderSelectProps) => {
const CAProviderSelect = ({ filter, ...props }: CAProviderSelectProps) => {
const { t } = useTranslation();
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: ApplyCAProvider }>>([]);
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: CAProvider }>>([]);
useEffect(() => {
const allItems = Array.from(applyCAProvidersMap.values());
const allItems = Array.from(caProvidersMap.values());
const filteredItems = filter != null ? allItems.filter(filter) : allItems;
setOptions([
{
key: "",
value: "",
label: t("provider.default_ca_provider.label"),
data: {} as ApplyCAProvider,
data: {} as CAProvider,
},
...filteredItems.map((item) => ({
key: item.type,
@@ -45,7 +45,7 @@ const ApplyCAProviderSelect = ({ filter, ...props }: ApplyCAProviderSelectProps)
);
}
const provider = applyCAProvidersMap.get(key);
const provider = caProvidersMap.get(key);
return (
<Space className="max-w-full grow overflow-hidden truncate" size={4}>
<Avatar src={provider?.icon} size="small" />
@@ -80,4 +80,4 @@ const ApplyCAProviderSelect = ({ filter, ...props }: ApplyCAProviderSelectProps)
);
};
export default memo(ApplyCAProviderSelect);
export default memo(CAProviderSelect);

View File

@@ -3,9 +3,9 @@ import { useTranslation } from "react-i18next";
import { Avatar, Card, Col, Empty, Flex, Input, type InputRef, Row, Tabs, Tooltip, Typography } from "antd";
import Show from "@/components/Show";
import { DEPLOY_CATEGORIES, deployProvidersMap } from "@/domain/provider";
import { DEPLOYMENT_CATEGORIES, deploymentProvidersMap } from "@/domain/provider";
export type DeployProviderPickerProps = {
export type DeploymentProviderPickerProps = {
className?: string;
style?: React.CSSProperties;
autoFocus?: boolean;
@@ -13,10 +13,10 @@ export type DeployProviderPickerProps = {
onSelect?: (value: string) => void;
};
const DeployProviderPicker = ({ className, style, autoFocus, placeholder, onSelect }: DeployProviderPickerProps) => {
const DeploymentProviderPicker = ({ className, style, autoFocus, placeholder, onSelect }: DeploymentProviderPickerProps) => {
const { t } = useTranslation();
const [category, setCategory] = useState<string>(DEPLOY_CATEGORIES.ALL);
const [category, setCategory] = useState<string>(DEPLOYMENT_CATEGORIES.ALL);
const [keyword, setKeyword] = useState<string>();
const keywordInputRef = useRef<InputRef>(null);
@@ -27,9 +27,9 @@ const DeployProviderPicker = ({ className, style, autoFocus, placeholder, onSele
}, []);
const providers = useMemo(() => {
return Array.from(deployProvidersMap.values())
return Array.from(deploymentProvidersMap.values())
.filter((provider) => {
if (category && category !== DEPLOY_CATEGORIES.ALL) {
if (category && category !== DEPLOYMENT_CATEGORIES.ALL) {
return provider.category === category;
}
@@ -56,17 +56,17 @@ const DeployProviderPicker = ({ className, style, autoFocus, placeholder, onSele
<div className="mt-4">
<Flex>
<Tabs
defaultActiveKey={DEPLOY_CATEGORIES.ALL}
defaultActiveKey={DEPLOYMENT_CATEGORIES.ALL}
items={[
DEPLOY_CATEGORIES.ALL,
DEPLOY_CATEGORIES.CDN,
DEPLOY_CATEGORIES.STORAGE,
DEPLOY_CATEGORIES.LOADBALANCE,
DEPLOY_CATEGORIES.FIREWALL,
DEPLOY_CATEGORIES.AV,
DEPLOY_CATEGORIES.SERVERLESS,
DEPLOY_CATEGORIES.WEBSITE,
DEPLOY_CATEGORIES.OTHER,
DEPLOYMENT_CATEGORIES.ALL,
DEPLOYMENT_CATEGORIES.CDN,
DEPLOYMENT_CATEGORIES.STORAGE,
DEPLOYMENT_CATEGORIES.LOADBALANCE,
DEPLOYMENT_CATEGORIES.FIREWALL,
DEPLOYMENT_CATEGORIES.AV,
DEPLOYMENT_CATEGORIES.SERVERLESS,
DEPLOYMENT_CATEGORIES.WEBSITE,
DEPLOYMENT_CATEGORIES.OTHER,
].map((key) => ({
key: key,
label: t(`provider.category.${key}`),
@@ -110,4 +110,4 @@ const DeployProviderPicker = ({ className, style, autoFocus, placeholder, onSele
);
};
export default memo(DeployProviderPicker);
export default memo(DeploymentProviderPicker);

View File

@@ -2,21 +2,21 @@ import { memo, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Avatar, Select, type SelectProps, Space, Typography } from "antd";
import { type ApplyDNSProvider, applyDNSProvidersMap } from "@/domain/provider";
import { type DeploymentProvider, deploymentProvidersMap } from "@/domain/provider";
export type ApplyDNSProviderSelectProps = Omit<
export type DeploymentProviderSelectProps = Omit<
SelectProps,
"filterOption" | "filterSort" | "labelRender" | "options" | "optionFilterProp" | "optionLabelProp" | "optionRender"
> & {
filter?: (record: ApplyDNSProvider) => boolean;
filter?: (record: DeploymentProvider) => boolean;
};
const ApplyDNSProviderSelect = ({ filter, ...props }: ApplyDNSProviderSelectProps) => {
const DeploymentProviderSelect = ({ filter, ...props }: DeploymentProviderSelectProps) => {
const { t } = useTranslation();
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: ApplyDNSProvider }>>([]);
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: DeploymentProvider }>>([]);
useEffect(() => {
const allItems = Array.from(applyDNSProvidersMap.values());
const allItems = Array.from(deploymentProvidersMap.values());
const filteredItems = filter != null ? allItems.filter(filter) : allItems;
setOptions(
filteredItems.map((item) => ({
@@ -29,7 +29,7 @@ const ApplyDNSProviderSelect = ({ filter, ...props }: ApplyDNSProviderSelectProp
}, [filter]);
const renderOption = (key: string) => {
const provider = applyDNSProvidersMap.get(key);
const provider = deploymentProvidersMap.get(key);
return (
<Space className="max-w-full grow overflow-hidden truncate" size={4}>
<Avatar src={provider?.icon} size="small" />
@@ -64,4 +64,4 @@ const ApplyDNSProviderSelect = ({ filter, ...props }: ApplyDNSProviderSelectProp
);
};
export default memo(ApplyDNSProviderSelect);
export default memo(DeploymentProviderSelect);

View File

@@ -2,21 +2,21 @@ import { memo, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Avatar, Select, type SelectProps, Space, Typography } from "antd";
import { type DeployProvider, deployProvidersMap } from "@/domain/provider";
import { type NotificationProvider, notificationProvidersMap } from "@/domain/provider";
export type DeployProviderSelectProps = Omit<
export type NotificationProviderSelectProps = Omit<
SelectProps,
"filterOption" | "filterSort" | "labelRender" | "options" | "optionFilterProp" | "optionLabelProp" | "optionRender"
> & {
filter?: (record: DeployProvider) => boolean;
filter?: (record: NotificationProvider) => boolean;
};
const DeployProviderSelect = ({ filter, ...props }: DeployProviderSelectProps) => {
const NotificationProviderSelect = ({ filter, ...props }: NotificationProviderSelectProps) => {
const { t } = useTranslation();
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: DeployProvider }>>([]);
const [options, setOptions] = useState<Array<{ key: string; value: string; label: string; data: NotificationProvider }>>([]);
useEffect(() => {
const allItems = Array.from(deployProvidersMap.values());
const allItems = Array.from(notificationProvidersMap.values());
const filteredItems = filter != null ? allItems.filter(filter) : allItems;
setOptions(
filteredItems.map((item) => ({
@@ -29,7 +29,7 @@ const DeployProviderSelect = ({ filter, ...props }: DeployProviderSelectProps) =
}, [filter]);
const renderOption = (key: string) => {
const provider = deployProvidersMap.get(key);
const provider = notificationProvidersMap.get(key);
return (
<Space className="max-w-full grow overflow-hidden truncate" size={4}>
<Avatar src={provider?.icon} size="small" />
@@ -64,4 +64,4 @@ const DeployProviderSelect = ({ filter, ...props }: DeployProviderSelectProps) =
);
};
export default memo(DeployProviderSelect);
export default memo(NotificationProviderSelect);