Improved the profile page format

twistter-frontend/src/pages/user.js

@@ -3,10 +3,12 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import axios from 'axios';
 //import '../App.css';
+import { Link } from 'react-router-dom';
 import { makeStyles, styled } from '@material-ui/core/styles';
 import Grid from '@material-ui/core/Grid';
 import Card from '@material-ui/core/Card';
 import Chip from '@material-ui/core/Chip';
+import Button from '@material-ui/core/Button';
 import Typography from "@material-ui/core/Typography";
 import AddCircle from '@material-ui/icons/AddCircle';
 import TextField from '@material-ui/core/TextField';
@@ -14,6 +16,7 @@ import TextField from '@material-ui/core/TextField';
 // component
 import Userline from '../Userline';
 import noImage from '../images/no-img.png';
+import Writing_Microblogs from '../Writing_Microblogs';
 
 const MyChip = styled(Chip)({
   margin: 2,
@@ -71,6 +74,7 @@ class user extends Component {
   }
   render() {
     const classes = this.props;
+    //const authenticated = this.props.user.authenticated;
     let profileMarkup = this.state.profile ? (
       <p>
       <Typography variant='h5'>{this.state.profile}</Typography>
@@ -93,11 +97,8 @@ class user extends Component {
     ) : (<img src={noImage}/>);
 
     return (
-      <Grid container spacing={16}>
-        <Grid item sm={8} xs={12}>
-          <p>Post</p>
-        </Grid>
-        <Grid item sm={4} xs={12}>
+      <Grid container spacing={24}>
+        <Grid item sm={4} xs={8}>
           {imageMarkup}
           {profileMarkup}
           {topicsMarkup}
@@ -115,6 +116,15 @@ class user extends Component {
             clickable
             onClick={this.handleAddCircle}
           />
+          <br />
+          <Button component={ Link } to='/edit'>Edit Profile Info</Button>
+          {/*authenticated && <Button component={ Link } to='/edit'>Edit Profile Info</Button>*/}
+        </Grid>
+        <Grid item sm={4} xs={8}>
+          <Writing_Microblogs />
+        </Grid>
+        <Grid item sm={4} xs={8}>
+          <p>Post</p>
         </Grid>
       </Grid>
     );