Simple props based react router

example.jsx

<Router authorized={true}>
  <Match fn={(props) => (props.authorized)}>
    <Environments/>
  </Match>
  <Match fn={(props) => (!props.authorized)}>
    <SlackPage/>
  </Match>
</Router>

router.jsx

export const Match = ({children}) => (<React.Fragment>{children}</React.Fragment>)

class Router extends Component {
    render() {

        let newChildren = []
        this.props.children.forEach(
            (child) => {
                if (child.props.fn(this.props)) {
                    newChildren.push(child)
                }
            }
        )

        return (<React.Fragment>{newChildren}</React.Fragment>)
    }
}