Client: profile update & PageNotFound handling
This commit is contained in:
11820
mpwo_client/package-lock.json
generated
11820
mpwo_client/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -6,6 +6,7 @@
|
||||
"history": "^4.7.2",
|
||||
"react": "^16.2.0",
|
||||
"react-dom": "^16.2.0",
|
||||
"react-helmet": "^5.2.0",
|
||||
"react-redux": "^5.0.6",
|
||||
"react-router-dom": "^4.2.2",
|
||||
"react-router-redux": "^5.0.0-alpha.9",
|
||||
|
@ -10,6 +10,10 @@
|
||||
href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
>
|
||||
<link
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<title>mpwo</title>
|
||||
</head>
|
||||
<body>
|
||||
|
@ -29,5 +29,6 @@
|
||||
|
||||
.page-title {
|
||||
font-size: 2em;
|
||||
margin: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
|
@ -5,6 +5,7 @@ import './App.css'
|
||||
import Dashboard from './Dashboard'
|
||||
import Logout from './User/Logout'
|
||||
import NavBar from './NavBar'
|
||||
import NotFound from './NotFound'
|
||||
import Profile from './User/Profile'
|
||||
import UserForm from './User/UserForm'
|
||||
import { isLoggedIn } from '../utils'
|
||||
@ -68,6 +69,7 @@ export default class App extends React.Component {
|
||||
)
|
||||
)}
|
||||
/>
|
||||
<Route component={NotFound} />
|
||||
</Switch>
|
||||
</div>
|
||||
)
|
||||
|
@ -1,4 +1,5 @@
|
||||
import React from 'react'
|
||||
import { Helmet } from 'react-helmet'
|
||||
import { connect } from 'react-redux'
|
||||
|
||||
class Logout extends React.Component {
|
||||
@ -6,6 +7,9 @@ class Logout extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Helmet>
|
||||
<title>mpwo - Dashboard</title>
|
||||
</Helmet>
|
||||
<h1 className="page-title">Dashboard</h1>
|
||||
</div>
|
||||
)
|
||||
|
13
mpwo_client/src/components/NotFound.jsx
Normal file
13
mpwo_client/src/components/NotFound.jsx
Normal file
@ -0,0 +1,13 @@
|
||||
import React from 'react'
|
||||
import { Helmet } from 'react-helmet'
|
||||
|
||||
export default function NotFound () {
|
||||
return (
|
||||
<div>
|
||||
<Helmet>
|
||||
<title>mpwo - 404</title>
|
||||
</Helmet>
|
||||
<h1 className="page-title">Page not found</h1>
|
||||
</div>
|
||||
)
|
||||
}
|
@ -1,32 +1,46 @@
|
||||
import React from 'react'
|
||||
import { Helmet } from 'react-helmet'
|
||||
import { connect } from 'react-redux'
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
function Profile ({ user }) {
|
||||
return (
|
||||
<div className="container">
|
||||
<h1 className="page-title">Profile</h1>
|
||||
<div className="row">
|
||||
<div className="col-md-8">
|
||||
<div className="card">
|
||||
<div className="card-header">
|
||||
{user.username}
|
||||
</div>
|
||||
<div className="card-body">
|
||||
<div className="row">
|
||||
<div className="col-md-8">
|
||||
<p>Email : {user.email}</p>
|
||||
<p>Registration date : {user.createdAt}</p>
|
||||
<div>
|
||||
<Helmet>
|
||||
<title>mpwo - {user.username} - Profile</title>
|
||||
</Helmet>
|
||||
<div className="container">
|
||||
<h1 className="page-title">Profile</h1>
|
||||
<div className="row">
|
||||
<div className="col-md-8">
|
||||
<div className="card">
|
||||
<div className="card-header">
|
||||
{user.username} {' '}
|
||||
<Link
|
||||
to={{
|
||||
pathname: '/profile/edit',
|
||||
}}
|
||||
>
|
||||
<i className="fa fa-pencil-square-o" aria-hidden="true" />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
<div className="row">
|
||||
<div className="col-md-8">
|
||||
<p>Email : {user.email}</p>
|
||||
<p>Registration date : {user.createdAt}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="card">
|
||||
<div className="card-header">
|
||||
Last activities
|
||||
<div className="col-md-4">
|
||||
<div className="card">
|
||||
<div className="card-header">
|
||||
Last activities
|
||||
</div>
|
||||
<div className="card-body" />
|
||||
</div>
|
||||
<div className="card-body" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user