useElementFilter()

Home > @backstage/core-plugin-api > useElementFilter

useElementFilter is a utility that helps you narrow down and retrieve data from a React element tree, typically operating on the children property passed in to a component.

Signature:

function useElementFilter<T>(node: ReactNode, filterFn: (arg: ElementCollection) => T, dependencies?: any[]): T;

Parameters

Parameter	Type	Description
node	ReactNode
filterFn	(arg: ElementCollection) => T
dependencies	any[]	(Optional)

**Returns:**

T

Remarks

A common use-case is to construct declarative APIs where a React component defines its behavior based on its children, such as the relationship between Routes and Route in react-router.

The purpose of this hook is similar to React.Children.map, and it expands upon it to also handle traversal of fragments and Backstage specific things like the FeatureFlagged component.

The return value of the hook is computed by the provided filter function, but with added memoization based on the input node. If further memoization dependencies are used in the filter function, they should be added to the third dependencies argument, just like useMemo, useEffect, etc.