Rescript pass React Component.make as a prop
Srikanth Kyatham

Srikanth Kyatham @srikanthkyatham

About: Software engineer interested in building stuff

Location:
Oulu, Finland
Joined:
Jun 21, 2020

Rescript pass React Component.make as a prop

Publish Date: Aug 16 '21
0 0
// --file status.res
module type SComponentType = {
  type data
}
module SComponent = (Config: SComponentType) => {
  type component = {"data": Config.data} => React.element

  @react.component
  let make = (
    ~status,
    ~componentMake: component,
    ~data: Config.data,
    ~errorText: option<string>=?,
    ~errorComponent: option<React.element>=?,
  ) => {
     let actualErrorComponent = switch (errorComponent, errorText) {
    | (Some(errorComponent), None) => errorComponent
    | _ =>
      switch errorText {
      | Some(errorText) => React.string(errorText)
      | _ => React.null
      }
    }

    switch status {
    | "success" => React.createElement(componentMake, {"data": data})
    | _ => <> {actualErrorComponent} </>
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

I wish to pass component which is not constructed yet but to be constructed only when the status == "success"

Inorder to do that I need to pass Component.make

Lets say I have component

// -- file: name.res
@react.component
let make = (~name: string) => {
  <div>{React.string(name)}</div>
}
Enter fullscreen mode Exit fullscreen mode

In order to pass the component as a prop to

I would pass it as

module StatusComponentType = {
  type data = string
}
module StatusFunctor = Status.SComponent(StatusComponentType)

<StatusFunctor
 componentMake={Name.make}
 data=string
/>
Enter fullscreen mode Exit fullscreen mode

Comments 0 total

    Add comment