Expected behavior Treeview that correctly renders after sorting by using data filtering

Actual behavior Treeview rerenders in a weird, partial manner upon update.

Resources (screenshots, code snippets etc.)

Here is the buggy rendering

Note that it persists after scrolling.

Here is the filter function:

  const filteredData = [...data].filter(function f(o: any) {
if (o.label.includes(selectedListRef.current) || selectedListRef.current === "") return true;

if (o.children) {
  return (o.children = o.children.filter(f)).length;
}
return false;

});

It's run from this:

    <MDBInput
      type="text"
      label="Søg..."
      onChange={(e) => setFieldFilter(e.target.value)}
    />

And here is the recursive function that actually puts together the tree:

  //return a recursive tree structure of JSX MDBTreeItem components
  const RecursiveTreeOuter = (e: any[], show: boolean, index: number): any => {
    return e.length !== 0 ? (
      e.map((item, itemIndex) => {
        return RecursiveTreeInner(item, show, index + itemIndex); // is itemIndex + index the right way to do this? What if there are multiple levels of nesting?
      })
    ) : (
      <></>
    );
  };
  const RecursiveTreeInner = (e: any, show: boolean, index: number): any => {
    const key = index;
    index++;
    return (
      <MDBTreeviewItem
        name={e.label}
        id={e.id}
        subtree={e.children.length !== 0}
        show={show}
        key={key}
        onClick={(el) => {
          if (e.data.type !== "") {
            props.onSelect(e, setPopoverOpen);
            if (closeOnSelect) setPopoverOpen(false);
          }
        }}
      >
        {e.children.length > 0 ? (
          RecursiveTreeOuter(e.children, show, index)
        ) : (
          <></>
        )}
      </MDBTreeviewItem>
    );
  };

State for filtering is managed here:

  const [fieldFilter, setFieldFilter] = useState("");

Likely necessary steps

So, I basically need to know how to force the component to rerender 'from scratch' based on the fact that the collection has been filtered. I have attempted to use various hooks to achieve something like this, such as useLayoutEffect, but no luck.

A workaround might be to render the component with nothing (completely bare) and then immediately after, rendering it with my dataset, perhaps only confitionally showing it after it's been rerendered. What do you recommend?

Scrolling the treeview does nothing.