map added to messages

hipstagram/src/Content/Messages/messages.js

@@ -33,22 +33,17 @@ const Messages = () => {
     {id: 3, message: 'Looks not ok'}
   ]
 
+  let dialog = dialogsData.map(d => <MessageItem name={d.name} id={d.id} /> ); 
+  let messages = messagesData.map( m => <Message message={m.message} />)
+
   return (
     <div className="message-wrapper">
       <div className="dialogs-items">
-
-        <MessageItem name={dialogsData[0].name} id={dialogsData[0].id} />
-        <MessageItem name={dialogsData[1].name} id={dialogsData[1].id} />
-        <MessageItem name={dialogsData[2].name} id={dialogsData[2].id} />
-        <MessageItem name={dialogsData[3].name} id={dialogsData[3].id} />
-        <MessageItem name={dialogsData[4].name} id={dialogsData[4].id} />
-
+        { dialog }
       </div>
 
       <div className="messages">
-        <Message message={messagesData[0].message} />
-        <Message message={messagesData[1].message} />
-        <Message message={messagesData[2].message} />
+        { messages }
       </div>
     </div>
   )

hipstagram/src/Content/Profile/My posts/my posts.js

@@ -6,11 +6,15 @@ import './my posts.css';
 
 function MyPosts() {
 
-    let postData = [
+    let post = [
         {id: 1, message: 'Hi, how are you?', likesCount: 12},
-        {id: 2, message: 'My first post', likesCount: 9}
+        {id: 2, message: 'My first post', likesCount: 9},
+        {id: 2, message: 'Bla Bla Bla', likesCount: 9},
+        {id: 2, message: 'Say you\'ll haunt me', likesCount: 9}
     ]
 
+    let postsElements = post.map( p => <Post message={ p.message } likesCount={ p.likesCount } />)
+
     return(
         <div className="myposts-block">
             My posts
@@ -24,8 +28,7 @@ function MyPosts() {
             </div>
 
             <div>
-                <Post message={ postData[0].message } likesCount={ postData[0].likesCount } /> 
-                <Post message={ postData[1].message } likesCount={ postData[1].likesCount } /> 
+                { postsElements }
             </div>
         </div>
     )