Map в React, не могу понять что не так

import React, { useState } from 'react';

const App = () => {

const [posts, setPosts] = useState([

]);

const [post, setPost] = useState({title:'', body:''})

const addNewPost = (e)=> {
  e.preventDefault()
  setPosts([...posts, {...post}])
  setPost({title:'', body:''})
}

  return (
    <div>
      <div className='input'>
          <form>
            <input
              value={post.title}
              type='text'
              onChange={e=>setPost({...post, title: e.target.value})}
            />
            <input
              value={post.body}
              type='text'
              onChange={e=>setPost({...post, body: e.target.value})}
            />
            <button onClick={addNewPost}>
              Create post
            </button>
          </form>
          <div>
            {
              posts.map(post=>{
                <div>
                  <string>{post.title}</string>
                  <div>{post.body}</div>
                </div>
              })
            }
          </div>
      </div>
    </div>
  );
};

export default App;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>