> in ES-like pseudocode

In valid ES, you have many options even if none is perfect.

With the "horrible" ternary operator:

    const TodosList = ({ todos }) => (
      <div class="todo-list">
        {
          (todos.length > 0)
            ? todos.map(t => <Todo key={t.id} todo={t} />)
            : <p>No todos yet</p>   
        }
      </div>
    );

Without the ternary operator:

    const TodosList = ({ todos }) => {
      let todoContent;
      if (todos.length > 0) {
        todoContent = todos.map(t => <Todo key={t.id} todo={t} />);
      } else {
        todoContent = <p>No todos yet</p>;
      }
      return (
        <div class="todo-list">
          { todoContent }
        </div>
      );
    };

If you allow the repeat of the div:

    const TodosList = ({ todos }) => {     
      if (todos.length > 0) {
        return (
          <div class="todo-list">
            { todos.map(t => <Todo key={t.id} todo={t} />) }
          </div>
        );
      } else {
        return (
          <div class="todo-list">
            <p>No todos yet</p>
          </div>
        );
      }
    };

With a separate render function:

    const renderTodos = (todos) => {
      if (todos.length > 0) {
        return todos.map(t => <Todo key={t.id} todo={t} />);
      } else {
        return <p>No todos yet</p>;
      }
    };
    const TodosList = ({ todos }) => (
      <div class="todo-list">
        { renderTodos(todos) }
      </div>
    );