title: If-else in React Stateless functional components
body: <p>I am basically refactoring my React component to support new stateless functional component <a href="https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html#stateless-functional-components" rel="noreferrer">React functional component</a>. However, I'm confused about the <code>if-else</code> syntax in functional component.</p>
  
  <p>Old code (Working fine): What it does basically is to find if the user is currently logged in. If yes, redirect to Home page else to Landing page. CurrentUser component returns a prop <code>currentUser</code> and checks the current state</p>
  
  <pre><code>import React, {Component} from "react";
  import currentUser from "shared/components/CurrentUser";
  import Home from "../Home";
  import Landing from "../Landing";
  
  class DefaultRouteHandler extends Component {
  
      render() {
          if (!this.props.currentUser) {
              return (&lt;Landing /&gt;);
          } else {
              return (&lt;Home /&gt;);
          }
      }
  }
  
  export default currentUser(DefaultRouteHandler);
  </code></pre>
  
  <p>New code: Now, how should I check the <code>else</code> condition in case the state of currentUser is false. As you can see right now it will always return the Home page.</p>
  
  <pre><code>import React from "react";
  import currentUser from "shared/components/CurrentUser";
  import Home from "../Home";
  import Landing from "../Landing";
  
  const DefaultRouteHandler = ({currentUser}) =&gt; (
      &lt;Home /&gt;
  );
  
  export default DefaultRouteHandler;
  </code></pre>
  
  <p>Finally in my route.jsx I am calling the aforementioned component</p>
  
  <pre><code>&lt;IndexRoute component={DefaultRouteHandler} /&gt;
  </code></pre>
  
  <p>Let me know if you need more information. I can also paste my <code>CurrentUser</code> component code. However, I don't think it will serve any purpose for this question.</p>