subcomponents added

hipstagram/src/Content/Messages/DialogItem/dialogItem.js

@@ -0,0 +1,13 @@
+import "./../messages.css";
+import { NavLink } from "react-router-dom";
+
+const MessageItem = (props) => {
+    let path = "/messages/" + props.id;
+    return (
+      <div className="dialog">
+        <NavLink to={ path }> { props.name } </NavLink>
+      </div>
+    );
+  };
+
+  export default MessageItem;

hipstagram/src/Content/Messages/Message/message.js

@@ -0,0 +1,10 @@
+import "./../messages.css";
+
+
+const Message = (props) => {
+    return (
+      <div className="message"> { props.message } </div>
+    )
+  }
+
+  export default Message;

hipstagram/src/Content/Messages/messages.js

@@ -1,21 +1,9 @@
 import React from "react";
-import { NavLink } from "react-router-dom";
+import MessageItem from "./DialogItem/dialogItem";
+import Message from "./Message/message";
 import "./messages.css";
 
-const MessageItem = (props) => {
-  let path = "/messages/" + props.id;
-  return (
-    <div className="dialog">
-      <NavLink to={ path }> { props.name } </NavLink>
-    </div>
-  );
-};
 
-const Message = (props) => {
-  return (
-    <div className="message"> { props.message } </div>
-  )
-}
 
 const Messages = () => {