Shouldn't we keep "one component per one file" approach? What is the convention in our project - when can/should we put some components together in one file?

As I said in the summary:

we would need to pass searchText to children as a prop and that would require using React.cloneElement

Oops, sorry – I totally missed that!

And finally, we can't use just React.Node because we would need a single child that has a prop searchText - typing that is more complicated.

This is an interesting problem, so I spent 5 minutes trying to get it to work. I think this is what you want. Not sure React.cloneElement is worth it, though...

For me, these three make render prop a better solution. If you think otherwise, I can change the code

One possible alternative would be to use React.Context to pass the searchText to all descendants, but I'm not sure it's worth it.

Ultimately defer to you – I understand why you're using a render prop here.

And finally, we can't use just React.Node because we would need a single child that has a prop searchText - typing that is more complicated.

This is an interesting problem, so I spent 5 minutes trying to get it to work. I think this is what you want. Not sure React.cloneElement is worth it, though...

Interesting... looks easier than what I initially implemented

export type SearchModalChildProps = {
  +searchText: string,
};

type Props<C> = {
  +name: string,
  +searchPlaceholder: string,
  +onClose: () => void,
  +children: React.Element<React.ComponentType<C>>,
};

export function SearchModal<C: SearchModalChildProps>(
  props: Props<C>,
): React.Node {


type ContentProps = {
  ...SearchModalChildProps,
  +threadID: string,
};
function ThreadMembersModalContent(props: ContentProps): React.Node {

Regarding cloneElement - I also don't think it is worth it

For me, these three make render prop a better solution. If you think otherwise, I can change the code

One possible alternative would be to use React.Context to pass the searchText to all descendants, but I'm not sure it's worth it.

It would make the solution a lot more complicated, so I don't think it will be better that the current solution where only the render prop is an issue

Ultimately defer to you – I understand why you're using a render prop here.

Ok, so in that case I'll keep the render prop