show an expand icon for nodes with non-null children arrray (#1862)
This commit is contained in:
parent
9b12775151
commit
736731474f
|
@ -124,6 +124,20 @@ describe("TreeNodeComponent", () => {
|
||||||
expect(component).toMatchSnapshot();
|
expect(component).toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("renders a node as expandable if it has empty, but defined, children array", () => {
|
||||||
|
const node = generateTestNode("root", {
|
||||||
|
isLoading: true,
|
||||||
|
children: [
|
||||||
|
generateTestNode("child1", {
|
||||||
|
children: [],
|
||||||
|
}),
|
||||||
|
generateTestNode("child2"),
|
||||||
|
],
|
||||||
|
});
|
||||||
|
const component = shallow(<TreeNodeComponent node={node} treeNodeId={node.id} />);
|
||||||
|
expect(component).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
|
||||||
it("does not render children if the node is loading", () => {
|
it("does not render children if the node is loading", () => {
|
||||||
const node = generateTestNode("root", {
|
const node = generateTestNode("root", {
|
||||||
isLoading: true,
|
isLoading: true,
|
||||||
|
|
|
@ -100,7 +100,8 @@ export const TreeNodeComponent: React.FC<TreeNodeComponentProps> = ({
|
||||||
return unsortedChildren;
|
return unsortedChildren;
|
||||||
};
|
};
|
||||||
|
|
||||||
const isBranch = node.children?.length > 0;
|
// A branch node is any node with a defined children array, even if the array is empty.
|
||||||
|
const isBranch = !!node.children;
|
||||||
|
|
||||||
const onOpenChange = useCallback(
|
const onOpenChange = useCallback(
|
||||||
(_: TreeOpenChangeEvent, data: TreeOpenChangeData) => {
|
(_: TreeOpenChangeEvent, data: TreeOpenChangeData) => {
|
||||||
|
|
|
@ -1534,6 +1534,44 @@ exports[`TreeNodeComponent renders a loading spinner if the node is loading: loa
|
||||||
</TreeItem>
|
</TreeItem>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
exports[`TreeNodeComponent renders a node as expandable if it has empty, but defined, children array 1`] = `
|
||||||
|
<TreeItem
|
||||||
|
itemType="branch"
|
||||||
|
onOpenChange={[Function]}
|
||||||
|
style={
|
||||||
|
Object {
|
||||||
|
"height": "100%",
|
||||||
|
}
|
||||||
|
}
|
||||||
|
value="root"
|
||||||
|
>
|
||||||
|
<TreeItemLayout
|
||||||
|
actions={false}
|
||||||
|
className="rootClass"
|
||||||
|
data-test="TreeNode:root"
|
||||||
|
iconBefore={
|
||||||
|
<img
|
||||||
|
alt=""
|
||||||
|
src="rootIcon"
|
||||||
|
style={
|
||||||
|
Object {
|
||||||
|
"height": 16,
|
||||||
|
"width": 16,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
style={
|
||||||
|
Object {
|
||||||
|
"backgroundColor": undefined,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>
|
||||||
|
rootLabel
|
||||||
|
</TreeItemLayout>
|
||||||
|
</TreeItem>
|
||||||
|
`;
|
||||||
|
|
||||||
exports[`TreeNodeComponent renders a node with a menu 1`] = `
|
exports[`TreeNodeComponent renders a node with a menu 1`] = `
|
||||||
<Menu
|
<Menu
|
||||||
onOpenChange={[Function]}
|
onOpenChange={[Function]}
|
||||||
|
|
Loading…
Reference in New Issue