chore: rule types locale

This commit is contained in:
dongchengjie
2024-07-02 17:04:22 +08:00
parent f9f4653e33
commit 7124d326fc
5 changed files with 436 additions and 167 deletions

View File

@@ -17,6 +17,7 @@ import {
} from "@dnd-kit/sortable";
import {
Autocomplete,
Box,
Button,
Dialog,
DialogActions,
@@ -43,100 +44,197 @@ interface Props {
onChange?: (prev?: string, curr?: string) => void;
}
const RuleTypeList = [
"DOMAIN",
"DOMAIN-SUFFIX",
"DOMAIN-KEYWORD",
"DOMAIN-REGEX",
"GEOSITE",
"IP-CIDR",
"IP-SUFFIX",
"IP-ASN",
"GEOIP",
"SRC-GEOIP",
"SRC-IP-ASN",
"SRC-IP-CIDR",
"SRC-IP-SUFFIX",
"DST-PORT",
"SRC-PORT",
"IN-PORT",
"IN-TYPE",
"IN-USER",
"IN-NAME",
"PROCESS-PATH",
"PROCESS-PATH-REGEX",
"PROCESS-NAME",
"PROCESS-NAME-REGEX",
"UID",
"NETWORK",
"DSCP",
"RULE-SET",
"SUB-RULE",
"AND",
"OR",
"NOT",
"MATCH",
] as const;
const NoResolveList = [
"GEOIP",
"IP-ASN",
"IP-CIDR",
"IP-CIDR6",
"IP-SUFFIX",
"RULE-SET",
];
const ExampleMap = {
DOMAIN: "example.com",
"DOMAIN-SUFFIX": "example.com",
"DOMAIN-KEYWORD": "example",
"DOMAIN-REGEX": "example.*",
GEOSITE: "youtube",
"IP-CIDR": "127.0.0.0/8",
"IP-SUFFIX": "8.8.8.8/24",
"IP-ASN": "13335",
GEOIP: "CN",
"SRC-GEOIP": "cn",
"SRC-IP-ASN": "9808",
"SRC-IP-CIDR": "192.168.1.201/32",
"SRC-IP-SUFFIX": "192.168.1.201/8",
"DST-PORT": "80",
"SRC-PORT": "7777",
"IN-PORT": "7890",
"IN-TYPE": "SOCKS/HTTP",
"IN-USER": "mihomo",
"IN-NAME": "ss",
"PROCESS-PATH":
getSystem() === "windows"
? "C:Program FilesGoogleChromeApplicationchrome.exe"
: "/usr/bin/wget",
"PROCESS-PATH-REGEX":
getSystem() === "windows" ? "(?i).*Application\\chrome.*" : ".*bin/wget",
"PROCESS-NAME": getSystem() === "windows" ? "chrome.exe" : "curl",
"PROCESS-NAME-REGEX": ".*telegram.*",
UID: "1001",
NETWORK: "udp",
DSCP: "4",
"RULE-SET": "providername",
"SUB-RULE": "",
AND: "((DOMAIN,baidu.com),(NETWORK,UDP))",
OR: "((NETWORK,UDP),(DOMAIN,baidu.com))",
NOT: "((DOMAIN,baidu.com))",
MATCH: "",
const portValidator = (value: string): boolean => {
return new RegExp(
"^(?:[1-9]\\d{0,3}|[1-5]\\d{4}|6[0-4]\\d{3}|65[0-4]\\d{2}|655[0-2]\\d|6553[0-5])$"
).test(value);
};
const ipv4CIDRValidator = (value: string): boolean => {
return new RegExp(
"^(?:(?:[1-9]?[0-9]|1[0-9][0-9]|2(?:[0-4][0-9]|5[0-5]))\\.){3}(?:[1-9]?[0-9]|1[0-9][0-9]|2(?:[0-4][0-9]|5[0-5]))(?:\\/(?:[12]?[0-9]|3[0-2]))$"
).test(value);
};
const ipv6CIDRValidator = (value: string): boolean => {
return new RegExp(
"^([0-9a-fA-F]{1,4}(?::[0-9a-fA-F]{1,4}){7}|::|:(?::[0-9a-fA-F]{1,4}){1,6}|[0-9a-fA-F]{1,4}:(?::[0-9a-fA-F]{1,4}){1,5}|(?:[0-9a-fA-F]{1,4}:){2}(?::[0-9a-fA-F]{1,4}){1,4}|(?:[0-9a-fA-F]{1,4}:){3}(?::[0-9a-fA-F]{1,4}){1,3}|(?:[0-9a-fA-F]{1,4}:){4}(?::[0-9a-fA-F]{1,4}){1,2}|(?:[0-9a-fA-F]{1,4}:){5}:[0-9a-fA-F]{1,4}|(?:[0-9a-fA-F]{1,4}:){1,6}:)\\/(?:12[0-8]|1[01][0-9]|[1-9]?[0-9])$"
).test(value);
};
const BuiltinProxyPolicyList = ["DIRECT", "REJECT", "REJECT-DROP", "PASS"];
const rules: {
name: string;
required?: boolean;
example?: string;
noResolve?: boolean;
validator?: (value: string) => boolean;
}[] = [
{
name: "DOMAIN",
example: "example.com",
},
{
name: "DOMAIN-SUFFIX",
example: "example.com",
},
{
name: "DOMAIN-KEYWORD",
example: "example",
},
{
name: "DOMAIN-REGEX",
example: "example.*",
},
{
name: "GEOSITE",
example: "youtube",
},
{
name: "GEOIP",
example: "CN",
noResolve: true,
},
{
name: "SRC-GEOIP",
example: "CN",
},
{
name: "IP-ASN",
example: "13335",
noResolve: true,
validator: (value) => (+value ? true : false),
},
{
name: "SRC-IP-ASN",
example: "9808",
validator: (value) => (+value ? true : false),
},
{
name: "IP-CIDR",
example: "127.0.0.0/8",
noResolve: true,
validator: (value) => ipv4CIDRValidator(value) || ipv6CIDRValidator(value),
},
{
name: "IP-CIDR6",
example: "2620:0:2d0:200::7/32",
noResolve: true,
validator: (value) => ipv4CIDRValidator(value) || ipv6CIDRValidator(value),
},
{
name: "SRC-IP-CIDR",
example: "192.168.1.201/32",
validator: (value) => ipv4CIDRValidator(value) || ipv6CIDRValidator(value),
},
{
name: "IP-SUFFIX",
example: "8.8.8.8/24",
noResolve: true,
validator: (value) => ipv4CIDRValidator(value) || ipv6CIDRValidator(value),
},
{
name: "SRC-IP-SUFFIX",
example: "192.168.1.201/8",
validator: (value) => ipv4CIDRValidator(value) || ipv6CIDRValidator(value),
},
{
name: "SRC-PORT",
example: "7777",
validator: (value) => portValidator(value),
},
{
name: "DST-PORT",
example: "80",
validator: (value) => portValidator(value),
},
{
name: "IN-PORT",
example: "7890",
validator: (value) => portValidator(value),
},
{
name: "DSCP",
example: "4",
},
{
name: "PROCESS-NAME",
example: getSystem() === "windows" ? "chrome.exe" : "curl",
},
{
name: "PROCESS-PATH",
example:
getSystem() === "windows"
? "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe"
: "/usr/bin/wget",
},
{
name: "PROCESS-NAME-REGEX",
example: ".*telegram.*",
},
{
name: "PROCESS-PATH-REGEX",
example:
getSystem() === "windows" ? "(?i).*Application\\chrome.*" : ".*bin/wget",
},
{
name: "NETWORK",
example: "udp",
validator: (value) => ["tcp", "udp"].includes(value),
},
{
name: "UID",
example: "1001",
validator: (value) => (+value ? true : false),
},
{
name: "IN-TYPE",
example: "SOCKS/HTTP",
},
{
name: "IN-USER",
example: "mihomo",
},
{
name: "IN-NAME",
example: "ss",
},
{
name: "SUB-RULE",
example: "(NETWORK,tcp)",
},
{
name: "RULE-SET",
example: "providername",
noResolve: true,
},
{
name: "AND",
example: "((DOMAIN,baidu.com),(NETWORK,UDP))",
},
{
name: "OR",
example: "((NETWORK,UDP),(DOMAIN,baidu.com))",
},
{
name: "NOT",
example: "((DOMAIN,baidu.com))",
},
{
name: "MATCH",
required: false,
},
];
const builtinProxyPolicies = ["DIRECT", "REJECT", "REJECT-DROP", "PASS"];
export const RulesEditorViewer = (props: Props) => {
const { title, profileUid, property, open, onClose, onChange } = props;
const { t } = useTranslation();
const [prevData, setPrevData] = useState("");
const [ruleType, setRuleType] =
useState<(typeof RuleTypeList)[number]>("DOMAIN");
const [ruleType, setRuleType] = useState<(typeof rules)[number]>(rules[0]);
const [ruleContent, setRuleContent] = useState("");
const [noResolve, setNoResolve] = useState(false);
const [proxyPolicy, setProxyPolicy] = useState("DIRECT");
const [proxyPolicy, setProxyPolicy] = useState(builtinProxyPolicies[0]);
const [proxyPolicyList, setProxyPolicyList] = useState<string[]>([]);
const [ruleList, setRuleList] = useState<string[]>([]);
const [ruleSetList, setRuleSetList] = useState<string[]>([]);
@@ -195,7 +293,7 @@ export const RulesEditorViewer = (props: Props) => {
let ruleSetObj = yaml.load(data) as { "rule-providers": [] };
let subRuleObj = yaml.load(data) as { "sub-rules": [] };
setProxyPolicyList(
BuiltinProxyPolicyList.concat(
builtinProxyPolicies.concat(
groupsObj["proxy-groups"]
? groupsObj["proxy-groups"].map((item: any) => item.name)
: []
@@ -217,29 +315,17 @@ export const RulesEditorViewer = (props: Props) => {
fetchProfile();
}, [open]);
const spliceRule = () => {
if (ruleContent === "") return "";
// Check valid by regex
switch (ruleType) {
case "IP-CIDR": {
let v4regex = new RegExp(
"^((?:(?:[1-9]?[0-9]|1[0-9][0-9]|2(?:[0-4][0-9]|5[0-5]))\\.){3}(?:[1-9]?[0-9]|1[0-9][0-9]|2(?:[0-4][0-9]|5[0-5])))?:(?:[0-9]|[1-9][0-9]{1,3}|[1-5][0-9]{4}|6[0-5]{2}[0-3][0-5])$"
);
let v6regex = new RegExp(
"^([0-9a-fA-F]{1,4}(?::[0-9a-fA-F]{1,4}){7}|::|:(?::[0-9a-fA-F]{1,4}){1,6}|[0-9a-fA-F]{1,4}:(?::[0-9a-fA-F]{1,4}){1,5}|(?:[0-9a-fA-F]{1,4}:){2}(?::[0-9a-fA-F]{1,4}){1,4}|(?:[0-9a-fA-F]{1,4}:){3}(?::[0-9a-fA-F]{1,4}){1,3}|(?:[0-9a-fA-F]{1,4}:){4}(?::[0-9a-fA-F]{1,4}){1,2}|(?:[0-9a-fA-F]{1,4}:){5}:[0-9a-fA-F]{1,4}|(?:[0-9a-fA-F]{1,4}:){1,6}:)\\/(?:12[0-8]|1[01][0-9]|[1-9]?[0-9])$"
);
if (!v4regex.test(ruleContent) && !v6regex.test(ruleContent)) return "";
break;
}
default:
break;
const validateRule = () => {
if ((ruleType.required ?? true) && !ruleContent) {
throw new Error(t("Rule Condition Required"));
}
return `${ruleType}${
ruleType === "MATCH" ? "" : "," + ruleContent
},${proxyPolicy}${
NoResolveList.includes(ruleType) && noResolve ? ",no-resolve" : ""
}`;
if (ruleType.validator && !ruleType.validator(ruleContent)) {
throw new Error(t("Invalid Rule"));
}
return `${ruleType.name}${
ruleContent ? "," + ruleContent : ""
},${proxyPolicy}${ruleType.noResolve && noResolve ? ",no-resolve" : ""}`;
};
const onSave = useLockFn(async () => {
@@ -274,49 +360,50 @@ export const RulesEditorViewer = (props: Props) => {
<Autocomplete
size="small"
sx={{ minWidth: "240px" }}
value={ruleType}
options={RuleTypeList}
onChange={(_, v) => {
if (v) setRuleType(v);
}}
renderInput={(params) => <TextField {...params} />}
options={rules}
value={ruleType}
getOptionLabel={(option) => option.name}
renderOption={(props, option) => (
<li {...props} title={t(option.name)}>
{option.name}
</li>
)}
onChange={(_, value) => value && setRuleType(value)}
/>
</Item>
<Item>
<Item sx={{ display: !(ruleType.required ?? true) ? "none" : "" }}>
<ListItemText primary={t("Rule Content")} />
{ruleType === "RULE-SET" && (
{ruleType.name === "RULE-SET" && (
<Autocomplete
size="small"
sx={{ minWidth: "240px" }}
value={ruleContent}
renderInput={(params) => <TextField {...params} />}
options={ruleSetList}
onChange={(_, v) => {
if (v) setRuleContent(v);
}}
renderInput={(params) => <TextField {...params} />}
value={ruleContent}
onChange={(_, value) => value && setRuleContent(value)}
/>
)}
{ruleType === "SUB-RULE" && (
{ruleType.name === "SUB-RULE" && (
<Autocomplete
size="small"
sx={{ minWidth: "240px" }}
value={ruleContent}
options={subRuleList}
onChange={(_, v) => {
if (v) setRuleContent(v);
}}
renderInput={(params) => <TextField {...params} />}
options={subRuleList}
value={ruleContent}
onChange={(_, value) => value && setRuleContent(value)}
/>
)}
{ruleType !== "RULE-SET" && ruleType !== "SUB-RULE" && (
{ruleType.name !== "RULE-SET" && ruleType.name !== "SUB-RULE" && (
<TextField
size="small"
sx={{ minWidth: "240px" }}
value={ruleContent}
placeholder={ExampleMap[ruleType]}
onChange={(e) => {
setRuleContent(e.target.value);
}}
required={ruleType.required ?? true}
error={(ruleType.required ?? true) && !ruleContent}
placeholder={ruleType.example}
onChange={(e) => setRuleContent(e.target.value)}
/>
)}
</Item>
@@ -325,22 +412,23 @@ export const RulesEditorViewer = (props: Props) => {
<Autocomplete
size="small"
sx={{ minWidth: "240px" }}
value={proxyPolicy}
options={proxyPolicyList}
onChange={(_, v) => {
if (v) setProxyPolicy(v);
}}
renderInput={(params) => <TextField {...params} />}
options={proxyPolicyList}
value={proxyPolicy}
renderOption={(props, option) => (
<li {...props} title={t(option)}>
{option}
</li>
)}
onChange={(_, value) => value && setProxyPolicy(value)}
/>
</Item>
{NoResolveList.includes(ruleType) && (
{ruleType.noResolve && (
<Item>
<ListItemText primary={t("No Resolve")} />
<Switch
checked={noResolve}
onChange={() => {
setNoResolve(!noResolve);
}}
onChange={() => setNoResolve(!noResolve)}
/>
</Item>
)}
@@ -350,16 +438,18 @@ export const RulesEditorViewer = (props: Props) => {
fullWidth
variant="contained"
onClick={() => {
let raw = spliceRule();
if (raw === "") {
Notice.error(t("Invalid Rule"));
return;
try {
let raw = validateRule();
console.log(raw);
if (prependSeq.includes(raw)) return;
setPrependSeq([...prependSeq, raw]);
} catch (err: any) {
Notice.error(err.message || err.toString());
}
if (prependSeq.includes(raw)) return;
setPrependSeq([...prependSeq, raw]);
}}
>
{t("Add Prepend Rule")}
{t("Prepend Rule")}
</Button>
</Item>
<Item>
@@ -367,16 +457,16 @@ export const RulesEditorViewer = (props: Props) => {
fullWidth
variant="contained"
onClick={() => {
let raw = spliceRule();
if (raw === "") {
Notice.error(t("Invalid Rule"));
return;
try {
let raw = validateRule();
if (appendSeq.includes(raw)) return;
setPrependSeq([...appendSeq, raw]);
} catch (err: any) {
Notice.error(err.message || err.toString());
}
if (appendSeq.includes(raw)) return;
setAppendSeq([...appendSeq, raw]);
}}
>
{t("Add Append Rule")}
{t("Append Rule")}
</Button>
</Item>
</div>