Is it possible to check children components type and filter specific components How to do it

Yes, it is possible to check children components type and filter specific components in React.

One way to achieve this is by using the React.Children utility to iterate over the children of a component and filter them based on their type.

Here's an example of how to filter only the Button components from the children of a Toolbar component:

import React from 'react';

const Toolbar = ({ children }) => {
  const buttons = React.Children.toArray(children).filter(child => {
    return child.type.displayName === 'Button';
  });

  return (
    <div>
      <h2>Toolbar</h2>
      {buttons}
    </div>
  );
};

const Button = ({ children }) => {
  return <button>{children}</button>;
};

Toolbar.Button = Button;

export default Toolbar;

In this example, we are using the displayName property of the child component to filter only the Button components. We can also use other properties of the child component to filter based on other criteria.

Note that we are also using the React.Children.toArray method to convert the children to an array before filtering, which allows us to use array methods like filter