Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: trigger onFilterResultChanged when filtered #2813

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions packages/plugin-outline-pane/src/views/filter-tree.ts
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,11 @@ export const matchTreeNode = (
return matchTreeNode(childNode, keywords, filterOps);
}).find(Boolean);

// 如果命中了子节点,需要将该节点展开
if (matchChild && treeNode.expandable) {
treeNode.setExpanded(true);
}

treeNode.setFilterReult({
filterWorking: true,
matchChild,
Expand Down
16 changes: 13 additions & 3 deletions packages/plugin-outline-pane/src/views/tree-node.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ class ModalTreeNodeView extends PureComponent<{
}

componentDidMount(): void {
const rootTreeNode = this.rootTreeNode;
const { rootTreeNode } = this;
rootTreeNode.onExpandableChanged(() => {
this.setState({
treeChildren: rootTreeNode.children,
Expand All @@ -53,7 +53,7 @@ class ModalTreeNodeView extends PureComponent<{
}

render() {
const rootTreeNode = this.rootTreeNode;
const { rootTreeNode } = this;
const { expanded } = rootTreeNode;

const hasVisibleModalNode = !!this.modalNodesManager?.getVisibleModalNode();
Expand Down Expand Up @@ -98,6 +98,9 @@ export default class TreeNodeView extends PureComponent<{
conditionFlow: boolean;
expandable: boolean;
treeChildren: TreeNode[] | null;
filterWorking: boolean;
matchChild: boolean;
matchSelf: boolean;
} = {
expanded: false,
selected: false,
Expand All @@ -110,6 +113,9 @@ export default class TreeNodeView extends PureComponent<{
conditionFlow: false,
expandable: false,
treeChildren: [],
filterWorking: false,
matchChild: false,
matchSelf: false,
};

eventOffCallbacks: Array<IPublicTypeDisposable | undefined> = [];
Expand Down Expand Up @@ -154,6 +160,10 @@ export default class TreeNodeView extends PureComponent<{
treeChildren: treeNode.children,
});
});
treeNode.onFilterResultChanged(() => {
const { filterWorking: newFilterWorking, matchChild: newMatchChild, matchSelf: newMatchSelf } = treeNode.filterReult;
this.setState({ filterWorking: newFilterWorking, matchChild: newMatchChild, matchSelf: newMatchSelf });
});
this.eventOffCallbacks.push(
doc?.onDropLocationChanged(() => {
this.setState({
Expand Down Expand Up @@ -216,7 +226,7 @@ export default class TreeNodeView extends PureComponent<{
let shouldShowModalTreeNode: boolean = this.shouldShowModalTreeNode();

// filter 处理
const { filterWorking, matchChild, matchSelf } = treeNode.filterReult;
const { filterWorking, matchChild, matchSelf } = this.state;
if (!isRootNode && filterWorking && !matchChild && !matchSelf) {
// 条件过滤生效时,如果未命中本节点或子节点,则不展示该节点
// 根节点始终展示
Expand Down
22 changes: 15 additions & 7 deletions packages/plugin-outline-pane/src/views/tree-title.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,15 @@ export default class TreeTitle extends PureComponent<{
title: string;
condition?: boolean;
visible?: boolean;
filterWorking: boolean;
keywords: string;
matchSelf: boolean;
} = {
editing: false,
title: '',
filterWorking: false,
keywords: '',
matchSelf: false,
};

private lastInput?: HTMLInputElement;
Expand Down Expand Up @@ -100,6 +106,10 @@ export default class TreeTitle extends PureComponent<{
visible: !hidden,
});
});
treeNode.onFilterResultChanged(() => {
const { filterWorking: newFilterWorking, keywords: newKeywords, matchSelf: newMatchSelf } = treeNode.filterReult;
this.setState({ filterWorking: newFilterWorking, keywords: newKeywords, matchSelf: newMatchSelf });
});
}
deleteClick = () => {
const { treeNode } = this.props;
Expand All @@ -109,7 +119,7 @@ export default class TreeTitle extends PureComponent<{
render() {
const { treeNode, isModal } = this.props;
const { pluginContext } = treeNode;
const { editing } = this.state;
const { editing, filterWorking, matchSelf, keywords } = this.state;
const isCNode = !treeNode.isRoot();
const { node } = treeNode;
const { componentMeta } = node;
Expand All @@ -125,11 +135,9 @@ export default class TreeTitle extends PureComponent<{
marginLeft: -indent,
};
}
const { filterWorking, matchSelf, keywords } = treeNode.filterReult;
const Extra = pluginContext.extraTitle;
const { intlNode, common, config } = pluginContext;
const Tip = common.editorCabin.Tip;
const Title = common.editorCabin.Title;
const { Tip, Title } = common.editorCabin;
const couldHide = availableActions.includes('hide');
const couldLock = availableActions.includes('lock');
const couldUnlock = availableActions.includes('unlock');
Expand Down Expand Up @@ -253,7 +261,7 @@ class RenameBtn extends PureComponent<{
}> {
render() {
const { intl, common } = this.props.treeNode.pluginContext;
const Tip = common.editorCabin.Tip;
const { Tip } = common.editorCabin;
return (
<div
className="tree-node-rename-btn"
Expand All @@ -274,7 +282,7 @@ class LockBtn extends PureComponent<{
render() {
const { treeNode, locked } = this.props;
const { intl, common } = this.props.treeNode.pluginContext;
const Tip = common.editorCabin.Tip;
const { Tip } = common.editorCabin;
return (
<div
className="tree-node-lock-btn"
Expand All @@ -300,7 +308,7 @@ class HideBtn extends PureComponent<{
render() {
const { treeNode, hidden } = this.props;
const { intl, common } = treeNode.pluginContext;
const Tip = common.editorCabin.Tip;
const { Tip } = common.editorCabin;
return (
<div
className="tree-node-hide-btn"
Expand Down
Loading