How to render a component passed to props?

Question

React

How to render a component from props? I know about HOC patterns and Render Props, but I haven't used either.
What do I need to do with this code to get my component to render?

// App.js
return (
<BlurBackground loading={loading} component={LoadingComponent}>
   <AnotherComponent />
</BlurBackground>
)
// BlurBackground.js
   const { loading, children, component } = this.props;
    return (
      <BlurWrapper loading={true}>
        {children}
        {component} // Вот этот должен рендериться
      </BlurWrapper>
    );

Answer 1

// достаёте компонент из пропсов, обратите внимание, что
// имя переменной должно начинаться с большой буквы
const Component = this.props.component;

// ну и рендерите его
<Component />