react conditional component

conditional.tsx

import React from "react";

const Case = ({ children }) => children;
const Default = ({ children }) => children;

const Switch = ({ children }) => {
  let matchChild = null;
  let defaultCase = null;

  React.Children.forEach(children, (child) => {
    if (!matchChild && child.type === Case) {
      const { condition } = child.props;

      const conditionalResult = Boolean(condition);

      if (conditionalResult) {
        matchChild = child;
      }
    } else if (!defaultCase && child.type === Default) {
      defaultCase = child;
    }
  });

  return matchChild ?? defaultCase ?? null;
};

export { Case, Default, Switch };