From 94e2989dce7b153437f27d8d56d29ac14ce431e5 Mon Sep 17 00:00:00 2001
From: Martin Wighus Holtmon <martinwh@stud.ntnu.no>
Date: Mon, 1 Nov 2021 22:26:18 +0100
Subject: [PATCH] projectSecondPart/Problem1: made userDetails display basic
information about the selected user.
---
.../components/userDetail/userDetail.jsx | 29 ++++++++++++-------
.../components/userList/userList.jsx | 2 +-
2 files changed, 20 insertions(+), 11 deletions(-)
diff --git a/projectSecondPart/components/userDetail/userDetail.jsx b/projectSecondPart/components/userDetail/userDetail.jsx
index a5e0d92..f824526 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 ccacd64..79c3097 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() {
--
GitLab