One way to think about it is JSX is just another templating language that happens to be a superset of JavaScript. You are free to use as much or as little logic as you like, but the trend is definitely moving towards keeping most components simple and free of complex logic.

With "stateless functional components" (added in React 0.14) and ES6 you can have "templates" that look like this:

    export default ({ title, author, body }) =>
      <div>
        <h1>{title}</h1>
        <h2>By {author}</h2>
        <p>{body}</p>
      </div>

I wonder if anyone has written a linter to enforce a "logic-less" dialect of JSX? Perhaps allowing specific looping and conditional idioms like:

    { array.map(object =>
      <div>{object.whatever}</div>
    ) }

and

    { foo ?
      <div>yes</div>
    :
      <div>no</div>
    }