shkong/clash-verge-rev
1
0
Fork 0
mirror of https://github.com/clash-verge-rev/clash-verge-rev synced 2025-05-05 06:53:44 +08:00
Code Packages Projects Releases Activity

fix: search-box takes no effect in rule-editor #1288

Browse Source
This commit is contained in:
dongchengjie 2024-07-03 03:08:01 +08:00
parent 24f4ab7597
commit dc87097dfe
1 changed files with 19 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/profile/rules-editor-viewer.tsx
View File

@ -1,4 +1,4 @@
import { ReactNode, useEffect, useState } from "react"; import { ReactNode, useEffect, useMemo, useState } from "react";
import { useLockFn } from "ahooks"; import { useLockFn } from "ahooks";
import yaml from "js-yaml"; import yaml from "js-yaml";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
@ -247,6 +247,11 @@ export const RulesEditorViewer = (props: Props) => {
const [appendSeq, setAppendSeq] = useState<string[]>([]); const [appendSeq, setAppendSeq] = useState<string[]>([]);
const [deleteSeq, setDeleteSeq] = useState<string[]>([]); const [deleteSeq, setDeleteSeq] = useState<string[]>([]);
const filteredRuleList = useMemo(
() => ruleList.filter((rule) => match(rule)),
[ruleList, match]
);
const sensors = useSensors( const sensors = useSensors(
useSensor(PointerSensor), useSensor(PointerSensor),
useSensor(KeyboardSensor, { useSensor(KeyboardSensor, {
@ -482,7 +487,7 @@ export const RulesEditorViewer = (props: Props) => {
<Virtuoso <Virtuoso
style={{ height: "calc(100% - 16px)", marginTop: "8px" }} style={{ height: "calc(100% - 16px)", marginTop: "8px" }}
totalCount={ totalCount={
ruleList.length + filteredRuleList.length +
(prependSeq.length > 0 ? 1 : 0) + (prependSeq.length > 0 ? 1 : 0) +
(appendSeq.length > 0 ? 1 : 0) (appendSeq.length > 0 ? 1 : 0)
} }
@ -518,24 +523,29 @@ export const RulesEditorViewer = (props: Props) => {
</SortableContext> </SortableContext>
</DndContext> </DndContext>
); );
} else if (index < ruleList.length + shift) { } else if (index < filteredRuleList.length + shift) {
let newIndex = index - shift; let newIndex = index - shift;
return ( return (
<RuleItem <RuleItem
key={`${ruleList[newIndex]}-${index}`} key={`${filteredRuleList[newIndex]}-${index}`}
type={ type={
deleteSeq.includes(ruleList[newIndex]) deleteSeq.includes(filteredRuleList[newIndex])
? "delete" ? "delete"
: "original" : "original"
} }
ruleRaw={ruleList[newIndex]} ruleRaw={filteredRuleList[newIndex]}
onDelete={() => { onDelete={() => {
if (deleteSeq.includes(ruleList[newIndex])) { if (deleteSeq.includes(filteredRuleList[newIndex])) {
setDeleteSeq( setDeleteSeq(
deleteSeq.filter((v) => v !== ruleList[newIndex]) deleteSeq.filter(
(v) => v !== filteredRuleList[newIndex]
)
); );
} else { } else {
setDeleteSeq((prev) => [...prev, ruleList[newIndex]]); setDeleteSeq((prev) => [
...prev,
filteredRuleList[newIndex],
]);
} }
}} }}
/> />