diff --git a/functions/handlers/post.js b/functions/handlers/post.js index a72be0e..2be5bda 100644 --- a/functions/handlers/post.js +++ b/functions/handlers/post.js @@ -23,23 +23,46 @@ exports.putPost = (req, res) => { }) .catch((err) => { console.error(err); - return res.status(500).json({ error: 'something is wrong'}); + return res.status(500).json({ error: 'something went wrong'}); }); }; exports.getallPostsforUser = (req, res) => { - admin.firestore().collection('posts').where('userHandle', '==', req.userData.handle ).get() - .then((data) => { + var post_query = admin.firestore().collection("posts").where("userHandle", "==", req.user.handle); + post_query.get() + .then(function(myPosts) { let posts = []; - data.forEach(function(doc) { + myPosts.forEach(function(doc) { posts.push(doc.data()); }); return res.status(200).json(posts); }) - .catch((err) => { - console.error(err); - return res.status(500).json({error: 'Failed to fetch all posts written by specific user.'}) + .then(function() { + res.status(200).send("Successfully retrieved all user's posts from database."); + return; }) + .catch(function(err) { + res.status(500).send("Failed to retrieve user's posts from database.", err); + }); +}; + +exports.getallPosts = (req, res) => { + var post_query = admin.firestore().collection("posts"); + post_query.get() + .then(function(allPosts) { + let posts = []; + allPosts.forEach(function(doc) { + posts.push(doc.data()); + }); + return res.status(200).json(posts); + }) + .then(function() { + res.status(200).send("Successfully retrieved every post from database."); + return; + }) + .catch(function(err) { + res.status(500).send("Failed to retrieve posts from database.", err); + }); }; exports.getFilteredPosts = (req, res) => { diff --git a/functions/handlers/users.js b/functions/handlers/users.js index 203aa58..b455b02 100644 --- a/functions/handlers/users.js +++ b/functions/handlers/users.js @@ -1,5 +1,4 @@ /* eslint-disable promise/catch-or-return */ - const { admin, db } = require("../util/admin"); const config = require("../util/config"); const { validateUpdateProfileInfo } = require("../util/validator"); diff --git a/functions/index.js b/functions/index.js index f00a361..51a59e2 100644 --- a/functions/index.js +++ b/functions/index.js @@ -44,9 +44,11 @@ app.get("/user", fbAuth, getAuthenticatedUser); /*------------------------------------------------------------------* * handlers/post.js * *------------------------------------------------------------------*/ -const { getallPostsforUser, putPost } = require("./handlers/post"); +const { getallPostsforUser, getallPosts, putPost } = require("./handlers/post"); -app.get("/getallPostsforUser", getallPostsforUser); +app.get("/getallPostsforUser", fbAuth, getallPostsforUser); + +app.get("/getallPosts", getallPosts); // Adds one post to the database app.post("/putPost", fbAuth, putPost); diff --git a/twistter-frontend/src/App.js b/twistter-frontend/src/App.js index d90e90f..bf05580 100644 --- a/twistter-frontend/src/App.js +++ b/twistter-frontend/src/App.js @@ -61,19 +61,20 @@ class App extends Component {
-
+ {/* AuthRoute checks if the user is logged in and if they are it redirects them to /home */} + + - - - - + + +
diff --git a/twistter-frontend/src/components/layout/NavBar.js b/twistter-frontend/src/components/layout/NavBar.js index 38434b5..9c720b0 100644 --- a/twistter-frontend/src/components/layout/NavBar.js +++ b/twistter-frontend/src/components/layout/NavBar.js @@ -10,7 +10,7 @@ import Button from '@material-ui/core/Button'; import withStyles from "@material-ui/core/styles/withStyles"; // Redux stuff -// import { logoutUser } from '../../redux/actions/userActions'; +import { logoutUser } from '../../redux/actions/userActions'; import { connect } from 'react-redux'; const styles = { @@ -41,6 +41,9 @@ export class Navbar extends Component { + {authenticated && } {!authenticated && } @@ -50,9 +53,6 @@ export class Navbar extends Component { {authenticated && } - {authenticated && } ) @@ -63,13 +63,9 @@ const mapStateToProps = (state) => ({ user: state.user }) -// const mapActionsToProps = { logoutUser }; - Navbar.propTypes = { user: PropTypes.object.isRequired, classes: PropTypes.object.isRequired } export default connect(mapStateToProps)(withStyles(styles)(Navbar)); - -// export default Navbar; diff --git a/twistter-frontend/src/pages/Home.js b/twistter-frontend/src/pages/Home.js index e0eae74..cee0a93 100644 --- a/twistter-frontend/src/pages/Home.js +++ b/twistter-frontend/src/pages/Home.js @@ -1,12 +1,74 @@ +/* eslint-disable */ import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; +import axios from 'axios'; + +// Material UI and React Router +import Grid from '@material-ui/core/Grid'; +import Card from '@material-ui/core/Card'; +import CardContent from '@material-ui/core/CardContent'; +import Typography from "@material-ui/core/Typography"; + +// component import '../App.css'; - import logo from '../images/twistter-logo.png'; - +import noImage from '../images/no-img.png'; +import Writing_Microblogs from '../Writing_Microblogs'; class Home extends Component { + state = {}; + + componentDidMount() { + axios + .get("/getallPosts") + .then(res => { + console.log(res.data); + this.setState({ + posts: res.data + }) + }) + .catch(err => console.log(err)); + } + render() { + let authenticated = this.props.user.authenticated; + + let postMarkup = this.state.posts ? ( + this.state.posts.map(post => + + + + { + this.state.imageUrl ? () : + () + } + + {post.userHandle} + {post.createdAt} +
+ {post.microBlogTitle} + {post.body} +
+ Topics: {post.microBlogTopics} +
+ Likes {post.likeCount} Comments {post.commentCount} +
+
+ ) + ) : (

My Posts

); + return ( + authenticated ? + + + + + + {postMarkup} + + + :
logo @@ -31,7 +93,15 @@ class Home extends Component {
); - } } +} -export default Home; \ No newline at end of file +const mapStateToProps = (state) => ({ + user: state.user +}) + +Home.propTypes = { + user: PropTypes.object.isRequired +} + +export default connect(mapStateToProps)(Home); \ No newline at end of file diff --git a/twistter-frontend/src/pages/editProfile.js b/twistter-frontend/src/pages/editProfile.js index ff6f3f7..7272e76 100644 --- a/twistter-frontend/src/pages/editProfile.js +++ b/twistter-frontend/src/pages/editProfile.js @@ -6,6 +6,7 @@ import PropTypes from "prop-types"; // Material-UI stuff import Button from "@material-ui/core/Button"; +import { Link } from 'react-router-dom'; import CircularProgress from "@material-ui/core/CircularProgress"; import Grid from "@material-ui/core/Grid"; import TextField from "@material-ui/core/TextField"; @@ -220,12 +221,34 @@ export class edit extends Component { color="primary" className={classes.button} disabled={loading} + //component={ Link } + //to='/user' > Submit {loading && ( )} +
+ +
+ diff --git a/twistter-frontend/src/pages/user.js b/twistter-frontend/src/pages/user.js index 1096fa4..9f5f656 100644 --- a/twistter-frontend/src/pages/user.js +++ b/twistter-frontend/src/pages/user.js @@ -1,19 +1,28 @@ -/* eslint-disable */ -import React, { Component } from "react"; -import PropTypes from "prop-types"; -import axios from "axios"; +/* eslint-disable */ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; +import axios from 'axios'; //import '../App.css'; + +// Material UI and React Router import { makeStyles, styled } from "@material-ui/core/styles"; -import Grid from "@material-ui/core/Grid"; +import { Link } from 'react-router-dom'; import Card from "@material-ui/core/Card"; +import CardMedia from '@material-ui/core/CardMedia'; +import CardContent from '@material-ui/core/CardContent'; +import Button from '@material-ui/core/Button'; +import Grid from "@material-ui/core/Grid"; + import Chip from "@material-ui/core/Chip"; import Typography from "@material-ui/core/Typography"; import AddCircle from "@material-ui/icons/AddCircle"; import TextField from "@material-ui/core/TextField"; -// component -import noImage from "../images/no-img.png"; - +// component +import '../App.css'; +import noImage from '../images/no-img.png'; +import Writing_Microblogs from '../Writing_Microblogs'; const MyChip = styled(Chip)({ margin: 2, color: "primary" @@ -67,6 +76,7 @@ class user extends Component { }); }) .catch(err => console.log(err)); + axios .get("/getAllTopics") .then(res => { @@ -75,17 +85,25 @@ class user extends Component { }); }) .catch(err => console.log(err)); + + axios + .get("/getallPostsforUser") + .then(res => { + console.log(res.data); + this.setState({ + posts: res.data + }) + }) + .catch(err => console.log(err)); } + render() { + let authenticated = this.props.user.authenticated; + let classes = this.props; let profileMarkup = this.state.profile ? (

-         {this.state.profile} -        -

- ) : ( -

loading username...

- ); - + {this.state.profile} +

) : (

loading username...

); let topicsMarkup = this.state.topics ? ( this.state.topics.map( topic => ( @@ -100,37 +118,61 @@ class user extends Component {

 loading topics...

); - let imageMarkup = this.state.imageUrl ? ( - - ) : ( - - ); + let imageMarkup = this.state.imageUrl ? () : + (); + + let postMarkup = this.state.posts ? ( + this.state.posts.map(post => + + + + { + this.state.imageUrl ? () : + () + } + + {post.userHandle} + {post.createdAt} +
+ {post.microBlogTitle} + {post.body} +
+ Topics: {post.microBlogTopics} +
+ Likes {post.likeCount} Comments {post.commentCount} +
+
+ ) + ) : (

My Posts

); return ( - -          - -           

Post

-          -
-          - -           {imageMarkup} -           {profileMarkup} -           {topicsMarkup} -            + + + {imageMarkup} + {profileMarkup} + {topicsMarkup} this.handleChange(event)} + id="newTopic" + label="new topic" + defaultValue="" + margin="normal" + variant="outlined" + value={this.state.newTopic} + onChange={(event) => this.handleChange(event)} /> -            - -          + +
+ {authenticated && } +
+ + {postMarkup} + + +       
@@ -138,4 +180,12 @@ class user extends Component { } } -export default user; +const mapStateToProps = (state) => ({ + user: state.user +}) + +user.propTypes = { + user: PropTypes.object.isRequired +} + +export default connect(mapStateToProps)(user);