How to fix error after removing return?

Question

JavaScript

There is this code:

{this.props.items.map((n, i) => {
          return (
            <button
              data-index={i}
              onClick={e => this.props.changeTab(+e.target.dataset.index)}>
              {n.content}
            </button>
          );
        })}

I wanted to try to write this code without return, writing instead: ( ). Like this:

{this.props.items.map((n, i) => ({
            <button
              data-index={i}
              onClick={e => this.props.changeTab(+e.target.dataset.index)}>
              {n.content}
            </button>
        });)}

But I have an error:

Answer 1

{this.props.items.map((n, i) => (
            <button
              data-index={i}
              onClick={e => this.props.changeTab(+e.target.dataset.index)}>
              {n.content}
            </button>
        );)}

Answer 2

{this.props.items.map((n, i) => (
            <button
              data-index={i}
              onClick={e => this.props.changeTab(+e.target.dataset.index)}>
              {n.content}
            </button>
        )}