diff --git a/projectSecondPart/components/userDetail/userDetail.jsx b/projectSecondPart/components/userDetail/userDetail.jsx
index a5e0d92918047c4a9554f456221f0198d6624dba..f824526b3856961d70cad5ed377d64d5e1ef2952 100644
--- a/projectSecondPart/components/userDetail/userDetail.jsx
+++ b/projectSecondPart/components/userDetail/userDetail.jsx
@@ -1,7 +1,4 @@
 import React from 'react';
-import {
-  Typography
-} from '@material-ui/core';
 import './userDetail.css';
 
 
@@ -11,17 +8,29 @@ import './userDetail.css';
 class UserDetail extends React.Component {
   constructor(props) {
     super(props);
+    //console.log(this.props.match.params.userId);
   }
 
+  generateUserPreview() {
+    let user = window.cs142models.userListModel().find(e => e._id === this.props.match.params.userId)
+    console.log(user)
+    return (<div id="DivUserPreview">
+        <h2>{user.first_name} {user.last_name}</h2>
+        <p>
+          Occupation: {user.occupation} <br />
+          From: {user.location} <br />
+          Description: {user.description}
+        </p>
+      </div>
+    )
+  }
+
+
   render() {
     return (
-      <Typography variant="body1">
-        This should be the UserDetail view of the PhotoShare app. Since
-        it is invoked from React Router the params from the route will be
-        in property match. So this should show details of user:
-        {this.props.match.params.userId}. You can fetch the model for the
-        user from window.cs142models.userModel(userId).
-      </Typography>
+      <div id="divUserDetail">
+        {this.generateUserPreview()}
+      </div>
     );
   }
 }
diff --git a/projectSecondPart/components/userList/userList.jsx b/projectSecondPart/components/userList/userList.jsx
index ccacd646df03600f6c7923fcecd20a1082a39e25..79c30973668fa2238c820c2ab671769653fcbfde 100644
--- a/projectSecondPart/components/userList/userList.jsx
+++ b/projectSecondPart/components/userList/userList.jsx
@@ -15,7 +15,7 @@ import {Link} from "react-router-dom";
 class UserList extends React.Component {
   constructor(props) {
     super(props);
-    console.log(window.cs142models.userListModel())
+    //console.log(window.cs142models.userListModel())
   }
 
   renderUsers() {