React Conditional Wrapper Component

Hey everyone!

I am looking to recreate this component in rescript, but not entirely how to do so.

const ConditionalWrapper = ({ condition, wrapper, children }) => 
  condition ? wrapper(children) : children;
   wrapper={children => <a href={link}>{children}</a>}


Thanks in advance!

1 Like

Here’s one way:

module ConditionalWrapper = {
  let make = (~condition, ~wrapper, ~children) =>
    condition ? wrapper(children) : children

// usage:
let make = (~link, ~brand) => {
    condition={true} wrapper={children => <a href={link}> {children} </a>}>
    <React.Fragment> <h1> {brand} </h1> </React.Fragment>


Wow, honestly I tried this with probably too many incorrect prop type definitions making it difficult to get working.

It was really that straight forward, thanks a ton @johnj - always a huge help on here.

1 Like

That’s why I usually don’t use type annotations unless they’re necessary. The compiler can infer them better than I can most of the time. :wink:


Totally agree, I need to start stopping myself from being type definition happy haha :+1: