title: Gatsby conditional rendering of a component
body: <p>I have a template like this:</p>
  
  <pre><code>const Template = ({ data }) =&gt; {
    const { id } = data.Page
    const postNode = data.Page
  
    return (
      &lt;Layout&gt;
         // conditional logic here
         // if {id} is 40 output &lt;AdditionalContent /&gt;
      &lt;/Layout&gt;
    )
  }
  </code></pre>
  
  <p>I want to know if it is possible to check the <code>id</code> to see if it is 40, then output <code>&lt;AdditionalContent&gt;</code> component. </p>