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.

Sign up for GitHub

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

Improve performance for Selection tree component #5185

Merged
merged 2 commits into from
Nov 24, 2024
Merged

Improve performance for Selection tree component #5185

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b59d3ef
intialize from no sample selected state to optimize performance
lanzhenw Nov 24, 2024
14bcfcd
cleanup
lanzhenw Nov 24, 2024
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
22 changes: 3 additions & 19 deletions app/packages/core/src/plugins/SchemaIO/components/TreeSelectionView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,12 +39,7 @@ export default function TreeSelectionView(props: ViewPropsType) {
const { view = {} } = schema;

if (data == undefined) {
const sampleIds = view?.data.flatMap(([parentId, children]) => {
return children.map((childId) =>
typeof childId === "string" ? childId : childId[0]
);
});
onChange(path, sampleIds);
onChange(path, []);
}

const structure = view?.data || [];
Expand Down Expand Up @@ -78,7 +73,7 @@ export default function TreeSelectionView(props: ViewPropsType) {
const initialCollapsedState: CollapsedState = React.useMemo(() => {
const state: CollapsedState = {};
structure.forEach(([parentId]) => {
state[parentId] = false; // start as expanded
state[parentId] = true; // start as expanded
});
return state;
}, [structure]);
Expand All @@ -87,7 +82,7 @@ export default function TreeSelectionView(props: ViewPropsType) {
initialCollapsedState
);

const [allCollapsed, setAllCollapsed] = React.useState(false);
const [allCollapsed, setAllCollapsed] = React.useState(true);

const handleExpandCollapseAll = () => {
setCollapsedState((prevState) => {
Expand Down Expand Up @@ -209,17 +204,6 @@ export default function TreeSelectionView(props: ViewPropsType) {
return idx === -1 ? 0 : idx + 1;
};

// On init, all samples are selected by default
useEffect(() => {
const sampleIds = view?.data.flatMap(([parentId, children]) => {
return children.map((childId) =>
typeof childId === "string" ? childId : childId[0]
);
});
onChange(path, sampleIds);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

// this only runs when data and checkboxstate are different
// meaning the user selected samples from the grid
// we will handle the state change of checkedState here
Expand Down
Loading