How do I pass Variants as props to React Components in ReasonML? - reason

Question

I have tried the following approach to be able to send variants as props.
type ipAddr =
| IPV4
| IPV8;
[#react.component]
let make = () => {
let appData = Data.tileData;
<div className="App">
<header className="flex outline justify-between" />
<Content selected={ipAddr.IPV4} appData />
</div>;
};
But it throws the error,
ninja: error: rebuilding 'build.ninja': subcommand failed
I have tried sending variants directly to Component as well.
<div className="App">
<header className="flex outline justify-between" />
<Content selected=IPV4 appData />
</div>;
But it ended up returning another error
Start compiling ninja: error: dependency cycle: src/App-ReactHooksTemplate.cmj -> src/Content-ReactHooksTemplate.cmj
-> src/App-ReactHooksTemplate.cmj
Finish compiling(exit: 1)
Where am I going wrong?

Answer 1

DISCLAIMER: I don't know ReasonML, however
If it was OCaml, you'd just write IPV4, no need to qualify it like ipAddr.IPV4.
Perhaps this is the same in Reason?

Answer 2

I have solved this another way. Instead of passing the variant as prop, I simply rendered different components based on variant value.
[#react.component]
let make = () => {
let appData = Data.tileData;
switch (selected) {
| IPV4 =>
<div>
<IPV4Renderer appData />
</div>
| IPV6 =>
<div>
<IPV6Renderer appData />
</div>
};
};