1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Extract nodeId to avoid repeating

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2023-02-03 16:27:02 +03:00
parent fa87ab5157
commit c594cb4c25

View File

@ -37,38 +37,43 @@ function NonInjectableNamespaceTreeView({ root, namespaceStore, getDetailsUrl }:
const hierarchicalNamespaces = namespaceStore.getByLabel(["hnc.x-k8s.io/included-namespace=true"]); const hierarchicalNamespaces = namespaceStore.getByLabel(["hnc.x-k8s.io/included-namespace=true"]);
const [expandedItems, setExpandedItems] = React.useState<string[]>(hierarchicalNamespaces.map(ns => `namespace-${ns.getId()}`)); const [expandedItems, setExpandedItems] = React.useState<string[]>(hierarchicalNamespaces.map(ns => `namespace-${ns.getId()}`));
const classes = { group: styles.group, label: styles.label }; const classes = { group: styles.group, label: styles.label };
const nodeId = `namespace-${root.getId()}`;
function renderChildren(parent: Namespace) { function renderChildren(parent: Namespace) {
const children = hierarchicalNamespaces.filter(ns => const children = hierarchicalNamespaces.filter(ns =>
ns.getLabels().find(label => label === `${parent.getName()}.tree.hnc.x-k8s.io/depth=1`), ns.getLabels().find(label => label === `${parent.getName()}.tree.hnc.x-k8s.io/depth=1`),
); );
return children.map(child => ( return children.map(child => {
<TreeItem const childId = `namespace-${child.getId()}`;
key={`namespace-${child.getId()}`}
nodeId={`namespace-${child.getId()}`} return (
data-testid={`namespace-${child.getId()}`} <TreeItem
classes={classes} key={childId}
onIconClick={(evt) =>{ nodeId={childId}
toggleNode(`namespace-${child.getId()}`); data-testid={childId}
evt.stopPropagation(); classes={classes}
}} onIconClick={(evt) =>{
label={( toggleNode(childId);
<> evt.stopPropagation();
<Link key={child.getId()} to={getDetailsUrl(child.selfLink)}> }}
{child.getName()} label={(
</Link> <>
{" "} <Link key={child.getId()} to={getDetailsUrl(child.selfLink)}>
<SubnamespaceBadge {child.getName()}
id={`namespace-details-badge-for-${child.getId()}`} </Link>
namespace={child} {" "}
/> <SubnamespaceBadge
</> id={`namespace-details-badge-for-${child.getId()}`}
)} namespace={child}
> />
{renderChildren(child)} </>
</TreeItem> )}
)); >
{renderChildren(child)}
</TreeItem>
);
});
} }
function toggleNode(id: string) { function toggleNode(id: string) {
@ -87,19 +92,19 @@ function NonInjectableNamespaceTreeView({ root, namespaceStore, getDetailsUrl }:
<div data-testid="namespace-tree-view" className={styles.TreeView}> <div data-testid="namespace-tree-view" className={styles.TreeView}>
<DrawerTitle>Tree View</DrawerTitle> <DrawerTitle>Tree View</DrawerTitle>
<TreeView <TreeView
defaultExpanded={[`namespace-${root.getId()}`]} defaultExpanded={[nodeId]}
defaultCollapseIcon={<MinusSquare />} defaultCollapseIcon={<MinusSquare />}
defaultExpandIcon={<PlusSquare />} defaultExpandIcon={<PlusSquare />}
defaultEndIcon={(<div style={{ opacity: 0.3 }}><MinusSquare /></div>)} defaultEndIcon={(<div style={{ opacity: 0.3 }}><MinusSquare /></div>)}
expanded={expandedItems} expanded={expandedItems}
> >
<TreeItem <TreeItem
nodeId={`namespace-${root.getId()}`} nodeId={nodeId}
label={root.getName()} label={root.getName()}
data-testid={`namespace-${root.getId()}`} data-testid={nodeId}
classes={classes} classes={classes}
onIconClick={(evt) => { onIconClick={(evt) => {
toggleNode(`namespace-${root.getId()}`); toggleNode(nodeId);
evt.stopPropagation(); evt.stopPropagation();
}} }}
> >