mirror of
https://github.com/ClaytonWWilson/CS307-Team24.git
synced 2025-12-16 10:18:48 +00:00
Merge branch 'master' of https://github.com/ClaytonWWilson/CS307-Team24
This commit is contained in:
Danny Voltz
commit
931929061f
@ -26,3 +26,20 @@ exports.putPost = (req, res) => {
|
||||
});
|
||||
};
|
||||
|
||||
exports.getallPostsforUser = (req, res) => {
|
||||
|
||||
admin.firestore().collection('posts').where('userHandle', '==', 'user' ).get()
|
||||
.then((data) => {
|
||||
let posts = [];
|
||||
data.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.'})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1,7 +1,138 @@
|
||||
/* eslint-disable promise/catch-or-return */
|
||||
const {db} = require('../util/admin');
|
||||
const {admin, db} = require('../util/admin');
|
||||
const config = require('../util/config');
|
||||
|
||||
const {validateUpdateProfileInfo} = require('../util/validator');
|
||||
|
||||
const firebase = require('firebase');
|
||||
firebase.initializeApp(config);
|
||||
|
||||
|
||||
|
||||
exports.signup = (req, res) => {
|
||||
const newUser = {
|
||||
email: req.body.email,
|
||||
handle: req.body.handle,
|
||||
password: req.body.password,
|
||||
confirmPassword: req.body.confirmPassword,
|
||||
createdAt: new Date().toISOString()
|
||||
};
|
||||
|
||||
// console.log(newUser);
|
||||
|
||||
let errors = {};
|
||||
|
||||
const emailRegEx = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||
|
||||
//Email check
|
||||
if(newUser.email.trim() === '') {
|
||||
errors.email = 'Email must not be blank.';
|
||||
}
|
||||
else if(!newUser.email.match(emailRegEx)) {
|
||||
errors.email = 'Email is invalid.';
|
||||
}
|
||||
|
||||
//handle check
|
||||
if(newUser.handle.trim() === '') {
|
||||
errors.handle = 'Username must not be blank.';
|
||||
}
|
||||
else if(newUser.handle.length < 4 || newUser.handle.length > 30) {
|
||||
errors.handle = 'Username must be between 4-30 characters long.';
|
||||
}
|
||||
|
||||
//Password check
|
||||
if(newUser.password.trim() === '') {
|
||||
errors.password = 'Password must not be blank.';
|
||||
}
|
||||
else if(newUser.password.length < 8 || newUser.password.length > 20) {
|
||||
errors.password = 'Password must be between 8-20 characters long.';
|
||||
}
|
||||
|
||||
//Confirm password check
|
||||
if(newUser.confirmPassword !== newUser.password) {
|
||||
errors.confirmPassword = 'Passwords must match.';
|
||||
}
|
||||
|
||||
//Overall check
|
||||
if(Object.keys(errors).length > 0) {
|
||||
return res.status(400).json(errors);
|
||||
}
|
||||
|
||||
let idToken, userId;
|
||||
|
||||
db.doc(`/users/${newUser.handle}`).get()
|
||||
.then(doc => {
|
||||
if(doc.exists) {
|
||||
return res.status(400).json({ handle: 'This username is already taken.' });
|
||||
}
|
||||
return firebase.auth().createUserWithEmailAndPassword(newUser.email, newUser.password);
|
||||
})
|
||||
.then(data => {
|
||||
userId = data.user.uid;
|
||||
return data.user.getIdToken();
|
||||
})
|
||||
.then(token => {
|
||||
idToken = token;
|
||||
const userCred = {
|
||||
email: req.body.email,
|
||||
handle: newUser.handle,
|
||||
createdAt: newUser.createdAt,
|
||||
userId
|
||||
}
|
||||
return db.doc(`/users/${newUser.handle}`).set(userCred);
|
||||
})
|
||||
.then(() => {
|
||||
return res.status(201).json({ idToken });
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
if(err.code === 'auth/email-already-in-use') {
|
||||
return res.status(500).json({ email: 'This email is already taken.' });
|
||||
}
|
||||
return res.status(500).json({ error: err.code });
|
||||
});
|
||||
};
|
||||
|
||||
exports.login = (req, res) => {
|
||||
const user = {
|
||||
email: req.body.email,
|
||||
password: req.body.password
|
||||
}
|
||||
|
||||
//Auth validation
|
||||
let errors = {};
|
||||
|
||||
//Email check
|
||||
if(user.email.trim() === '') {
|
||||
errors.email = 'Email must not be blank.';
|
||||
}
|
||||
|
||||
//Password check
|
||||
if(user.password.trim() === '') {
|
||||
errors.password = 'Password must not be blank.';
|
||||
}
|
||||
|
||||
//Overall check
|
||||
if(Object.keys(errors).length > 0) {
|
||||
return res.status(400).json(errors);
|
||||
}
|
||||
|
||||
firebase.auth().signInWithEmailAndPassword(user.email, user.password)
|
||||
.then(data => {
|
||||
return data.user.getIdToken();
|
||||
})
|
||||
.then(token => {
|
||||
return res.json({token});
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
if(err.code === 'auth/wrong-password') {
|
||||
return res.status(403).json({ general: 'Invalid credentials. Please try again.' });
|
||||
}
|
||||
return res.status(500).json({ error: err.code });
|
||||
});
|
||||
};
|
||||
|
||||
exports.getProfileInfo = (req, res) => {
|
||||
// FIXME: Delete this after login is implemented
|
||||
req.user = {};
|
||||
|
||||
@ -4,236 +4,26 @@ const app = require('express')();
|
||||
const cors = require('cors');
|
||||
app.use(cors());
|
||||
|
||||
var config = {
|
||||
apiKey: "AIzaSyCvsWetg4qFdsPGfJ3LCw_QaaYzoan7Q34",
|
||||
authDomain: "twistter-e4649.firebaseapp.com",
|
||||
databaseURL: "https://twistter-e4649.firebaseio.com",
|
||||
projectId: "twistter-e4649",
|
||||
storageBucket: "twistter-e4649.appspot.com",
|
||||
messagingSenderId: "20131817365",
|
||||
appId: "1:20131817365:web:633c95fb08b16d4526b89c"
|
||||
};
|
||||
const fbAuth = require('./util/fbAuth');
|
||||
|
||||
|
||||
const firebase = require('firebase');
|
||||
firebase.initializeApp(config);
|
||||
const {db} = require('./util/admin');
|
||||
|
||||
// Acts as a middleman between the client and any function that you use it with
|
||||
// The function will only execute if the user is logged in, or rather, they have
|
||||
// a valid token
|
||||
const firebaseAuth = (req, res, next) => {
|
||||
let idToken;
|
||||
// const firebase = require('firebase');
|
||||
// firebase.initializeApp(config);
|
||||
|
||||
if (req.headers.authorization && req.headers.authorization.startsWith('Bearer ')) {
|
||||
idToken = req.headers.authorization.split('Bearer ')[1];
|
||||
} else {
|
||||
console.error('No token found');
|
||||
return res.status(403).json({ error: 'Unauthorized' });
|
||||
}
|
||||
|
||||
admin.auth().verifyIdToken(idToken)
|
||||
.then(decodedToken => {
|
||||
req.user = decodedToken;
|
||||
console.log(decodedToken);
|
||||
return db.collection('users')
|
||||
.where('userId', '==', req.user.uid)
|
||||
.limit(1)
|
||||
.get();
|
||||
})
|
||||
.then(data => {
|
||||
req.user.username = data.docs[0].data().username;
|
||||
return next();
|
||||
})
|
||||
.catch(err => {
|
||||
console.error("Token verfication failed.", err);
|
||||
return res.status(403).json(err);
|
||||
});
|
||||
};
|
||||
|
||||
app.post('/scream', firebaseAuth, (req, res) => {
|
||||
const newScream = {
|
||||
username: req.user.username,
|
||||
body: req.body.body,
|
||||
numLikes: 0,
|
||||
numComments: 0,
|
||||
time: new Date().toISOString()
|
||||
};
|
||||
|
||||
let invalidCred = {};
|
||||
|
||||
//Body check
|
||||
if(req.body.body.trim() === '') {
|
||||
invalidCred.body = 'Body must not be blank';
|
||||
}
|
||||
|
||||
//Overall check
|
||||
if(Object.keys(invalidCred).length > 0) {
|
||||
return res.status(400).json(errors);
|
||||
}
|
||||
|
||||
db
|
||||
.collection('screams')
|
||||
.add(newScream)
|
||||
.then(doc => {
|
||||
res.json({ message: `Document ${doc.id} created successfully!` });
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
return res.status(500).json({ error: 'Someting went wrong.' });
|
||||
});
|
||||
});
|
||||
|
||||
app.get('/screams', (req, res) => {
|
||||
db
|
||||
.collection('screams')
|
||||
.orderBy('time', 'desc')
|
||||
.get()
|
||||
.then(data => {
|
||||
let screams = [];
|
||||
data.forEach(doc => {
|
||||
screams.push({
|
||||
username: doc.data().username,
|
||||
body: doc.data().body,
|
||||
numLikes: doc.data().numLikes,
|
||||
numComments: doc.data().numComments,
|
||||
time: doc.data().time,
|
||||
screamId: doc.id
|
||||
});
|
||||
});
|
||||
return res.json(screams);
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
return res.status(500).json({ error: err.code });
|
||||
});
|
||||
});
|
||||
|
||||
app.post('/signup', (req, res) => {
|
||||
const newUser = {
|
||||
email: req.body.email,
|
||||
username: req.body.username,
|
||||
password: req.body.password,
|
||||
confirmPassword: req.body.confirmPassword,
|
||||
time: new Date().toISOString()
|
||||
};
|
||||
|
||||
let invalidCred = {};
|
||||
|
||||
const emailRegEx = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||
|
||||
//Email check
|
||||
if(newUser.email.trim() === '') {
|
||||
invalidCred.email = 'Email must not be blank.';
|
||||
}
|
||||
else if(!newUser.email.match(emailRegEx)) {
|
||||
invalidCred.email = 'Email is invalid.';
|
||||
}
|
||||
|
||||
//Username check
|
||||
if(newUser.username.trim() === '') {
|
||||
invalidCred.username = 'Username must not be blank.';
|
||||
}
|
||||
else if(newUser.username.length < 4 || newUser.username.length > 30) {
|
||||
invalidCred.username = 'Username must be between 4-30 characters long.';
|
||||
}
|
||||
|
||||
//Password check
|
||||
if(newUser.password.trim() === '') {
|
||||
invalidCred.password = 'Password must not be blank.';
|
||||
}
|
||||
else if(newUser.password.length < 8 || newUser.password.length > 20) {
|
||||
invalidCred.password = 'Password must be between 8-20 characters long.';
|
||||
}
|
||||
|
||||
//Confirm password check
|
||||
if(newUser.confirmPassword !== newUser.password) {
|
||||
invalidCred.confirmPassword = 'Passwords must match.';
|
||||
}
|
||||
|
||||
//Overall check
|
||||
if(Object.keys(invalidCred).length > 0) {
|
||||
return res.status(400).json(errors);
|
||||
}
|
||||
|
||||
let idToken, userId;
|
||||
|
||||
db.doc(`/users/${newUser.username}`).get()
|
||||
.then(doc => {
|
||||
if(doc.exists) {
|
||||
return res.status(400).json({ username: 'This username is already taken.' });
|
||||
}
|
||||
return firebase.auth().createUserWithEmailAndPassword(newUser.email, newUser.password);
|
||||
})
|
||||
.then(data => {
|
||||
userId = data.user.uid;
|
||||
return data.user.getIdToken();
|
||||
})
|
||||
.then(token => {
|
||||
idToken = token;
|
||||
const userCred = {
|
||||
email: req.body.email,
|
||||
username: newUser.username,
|
||||
time: newUser.time,
|
||||
userId
|
||||
}
|
||||
return db.doc(`/users/${newUser.username}`).set(userCred);
|
||||
})
|
||||
.then(() => {
|
||||
return res.status(201).json({ idToken });
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
if(err.code === 'auth/email-already-in-use') {
|
||||
return res.status(500).json({ email: 'This email is already taken.' });
|
||||
}
|
||||
return res.status(500).json({ error: err.code });
|
||||
});
|
||||
});
|
||||
|
||||
app.post('/login', (req, res) => {
|
||||
const user = {
|
||||
email: req.body.email,
|
||||
password: req.body.password
|
||||
}
|
||||
|
||||
//Auth validation
|
||||
let invalidCred = {};
|
||||
|
||||
//Email check
|
||||
if(user.email.trim() === '') {
|
||||
invalidCred.email = 'Email must not be blank.';
|
||||
}
|
||||
|
||||
//Password check
|
||||
if(user.password.trim() === '') {
|
||||
invalidCred.password = 'Password must not be blank.';
|
||||
}
|
||||
|
||||
//Overall check
|
||||
if(Object.keys(invalidCred).length > 0) {
|
||||
return res.status(400).json(errors);
|
||||
}
|
||||
|
||||
firebase.auth().signInWithEmailAndPassword(user.email, user.password)
|
||||
.then(data => {
|
||||
return data.user.getIdToken();
|
||||
})
|
||||
.then(token => {
|
||||
return res.json({token});
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
if(err.code === 'auth/wrong-password') {
|
||||
return res.status(403).json({ general: 'Invalid credentials. Please try again.' });
|
||||
}
|
||||
return res.status(500).json({ error: err.code });
|
||||
});
|
||||
});
|
||||
|
||||
/*------------------------------------------------------------------*
|
||||
* handlers/users.js *
|
||||
*------------------------------------------------------------------*/
|
||||
const {getUserDetails, getProfileInfo, updateProfileInfo} = require('./handlers/users');
|
||||
const {getUserDetails, getProfileInfo, updateProfileInfo, signup, login} = require('./handlers/users');
|
||||
|
||||
app.post('/signup', signup);
|
||||
|
||||
app.post('/login', login);
|
||||
|
||||
app.get('/getUser/:handle', getUserDetails);
|
||||
|
||||
@ -248,8 +38,9 @@ app.post('/updateProfileInfo', updateProfileInfo);
|
||||
/*------------------------------------------------------------------*
|
||||
* handlers/post.js *
|
||||
*------------------------------------------------------------------*/
|
||||
const {putPost} = require('./handlers/post');
|
||||
const {putPost, getallPostsforUser} = require('./handlers/post');
|
||||
|
||||
app.get('/getallPostsforUser', getallPostsforUser);
|
||||
|
||||
// Adds one post to the database
|
||||
app.post('/putPost', fbAuth, putPost);
|
||||
|
||||
50
functions/package-lock.json
generated
50
functions/package-lock.json
generated
@ -190,11 +190,6 @@
|
||||
"resolved": "https://registry.npmjs.org/@firebase/installations-types/-/installations-types-0.1.2.tgz",
|
||||
"integrity": "sha512-fQaWIW8hyX1XUN7+FCSPjvM1agFjGidVuF4Sxi7aFwfyh5t+4fD2VpM4wCQbWmodnx4fZLvsuQd9mkxxU+lGYQ=="
|
||||
},
|
||||
"@firebase/logger": {
|
||||
"version": "0.1.24",
|
||||
"resolved": "https://registry.npmjs.org/@firebase/logger/-/logger-0.1.24.tgz",
|
||||
"integrity": "sha512-wPwhWCepEjWiTIqeC9U+7Hcw4XwezKPdXmyXbYSPiWNDcVekNgMPkntwSK+/2ufJO/1nMwAL2n6fL12oQG/PpQ=="
|
||||
},
|
||||
"@firebase/messaging": {
|
||||
"version": "0.4.11",
|
||||
"resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.4.11.tgz",
|
||||
@ -294,14 +289,6 @@
|
||||
"resolved": "https://registry.npmjs.org/@firebase/storage-types/-/storage-types-0.3.3.tgz",
|
||||
"integrity": "sha512-fUp4kpbxwDiWs/aIBJqBvXgFHZvgoND2JA0gJYSEsXtWtVwfgzY/710plErgZDeQKopX5eOR1sHskZkQUy0U6w=="
|
||||
},
|
||||
"@firebase/util": {
|
||||
"version": "0.2.27",
|
||||
"resolved": "https://registry.npmjs.org/@firebase/util/-/util-0.2.27.tgz",
|
||||
"integrity": "sha512-kFlbWNX1OuLfHrDXZ5QLmNNiLtMyxzbBgMo1DY1tXMjKK1AMYsHnyjInA8esvO0SCDp5XN3Pt9EDlhY4sRiLsw==",
|
||||
"requires": {
|
||||
"tslib": "1.10.0"
|
||||
}
|
||||
},
|
||||
"@firebase/webchannel-wrapper": {
|
||||
"version": "0.2.26",
|
||||
"resolved": "https://registry.npmjs.org/@firebase/webchannel-wrapper/-/webchannel-wrapper-0.2.26.tgz",
|
||||
@ -670,6 +657,15 @@
|
||||
"integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg==",
|
||||
"dev": true
|
||||
},
|
||||
"axios": {
|
||||
"version": "0.19.0",
|
||||
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.0.tgz",
|
||||
"integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==",
|
||||
"requires": {
|
||||
"follow-redirects": "1.5.10",
|
||||
"is-buffer": "^2.0.2"
|
||||
}
|
||||
},
|
||||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
|
||||
@ -1666,6 +1662,29 @@
|
||||
"integrity": "sha512-a1hQMktqW9Nmqr5aktAux3JMNqaucxGcjtjWnZLHX7yyPCmlSV3M54nGYbqT8K+0GhF3NBgmJCc3ma+WOgX8Jg==",
|
||||
"dev": true
|
||||
},
|
||||
"follow-redirects": {
|
||||
"version": "1.5.10",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
|
||||
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
|
||||
"requires": {
|
||||
"debug": "=3.1.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"debug": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
|
||||
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
|
||||
"requires": {
|
||||
"ms": "2.0.0"
|
||||
}
|
||||
},
|
||||
"ms": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
|
||||
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
|
||||
}
|
||||
}
|
||||
},
|
||||
"forwarded": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
|
||||
@ -2495,6 +2514,11 @@
|
||||
"integrity": "sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA==",
|
||||
"optional": true
|
||||
},
|
||||
"is-buffer": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.3.tgz",
|
||||
"integrity": "sha512-U15Q7MXTuZlrbymiz95PJpZxu8IlipAp4dtS3wOdgPXx3mqBnslrWU14kxfHB+Py/+2PVKSr37dMAgM2A4uArw=="
|
||||
},
|
||||
"is-date-object": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
|
||||
|
||||
@ -13,6 +13,7 @@
|
||||
"node": "10"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.0",
|
||||
"firebase": "^6.6.2",
|
||||
"firebase-admin": "^8.6.0",
|
||||
"firebase-functions": "^3.1.0"
|
||||
|
||||
@ -7,8 +7,8 @@ module.exports = (req, res, next) => {
|
||||
let idToken;
|
||||
|
||||
// Checking that the token exists in the header of the request
|
||||
if (req.headers.authorization) {
|
||||
idToken = req.headers.authorization;
|
||||
if (req.headers.authorization && req.headers.authorization.startsWith('Bearer ')) {
|
||||
idToken = req.headers.authorization.split('Bearer ')[1];
|
||||
} else {
|
||||
console.error('No token found');
|
||||
return res.status(403).json({ error: 'Unauthorized'});
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
"dependencies": {
|
||||
"@material-ui/core": "^4.4.3",
|
||||
"axios": "^0.19.0",
|
||||
"clsx": "^1.0.4",
|
||||
"create-react-app": "^3.1.2",
|
||||
"install": "^0.13.0",
|
||||
"node-pre-gyp": "^0.13.0",
|
||||
@ -34,5 +35,6 @@
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
}
|
||||
},
|
||||
"proxy": "https://us-central1-twistter-e4649.cloudfunctions.net/api"
|
||||
}
|
||||
|
||||
@ -1,3 +1,7 @@
|
||||
/* body {
|
||||
|
||||
} */
|
||||
|
||||
.app {
|
||||
font-family: "Segoe UI";
|
||||
font-size: large;
|
||||
|
||||
@ -5,14 +5,15 @@ import './App.css';
|
||||
|
||||
import { BrowserRouter as Router } from 'react-router-dom';
|
||||
import Route from 'react-router-dom/Route';
|
||||
|
||||
import NavBar, { Navbar } from './components/layout/NavBar';
|
||||
|
||||
// Pages
|
||||
import home from './Home.js';
|
||||
import register from './Register.js';
|
||||
import login from './Login.js';
|
||||
import user from './pages/user';
|
||||
import writeMicroblog from './Writing_Microblogs.js';
|
||||
import edit from './pages/edit.js';
|
||||
import userLine from './Userline.js';
|
||||
|
||||
class App extends Component {
|
||||
@ -29,6 +30,7 @@ class App extends Component {
|
||||
<Route exact path="/login" component={login}/>
|
||||
<Route exact path="/user" component={user}/>
|
||||
<Route exact path="/home" component={writeMicroblog}/>
|
||||
<Route exact path="/edit" component={edit}/>
|
||||
<Route exact path="/userline" component={userLine}/>
|
||||
</div>
|
||||
|
||||
|
||||
@ -9,16 +9,29 @@ class Userline extends Component {
|
||||
{
|
||||
super(props);
|
||||
this.state = {
|
||||
microBlogs : []
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
||||
axios.get('http://localhost:5001/twistter-e4649/us-central1/api/getallPostsforUser')
|
||||
.then(res => {
|
||||
const post = res.data;
|
||||
this.setState({microBlogs : post})
|
||||
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<p>Hi</p>
|
||||
<ul>
|
||||
{ this.state.microBlogs.map(microBlog => <p>{microBlog.body}</p>)}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Userline;
|
||||
@ -37,10 +37,11 @@ class Writing_Microblogs extends Component {
|
||||
|
||||
},
|
||||
{ headers: { 'Content-Type': 'application/json'} }
|
||||
|
||||
)
|
||||
console.log(response.data);
|
||||
|
||||
event.preventDefault();
|
||||
this.setState({value: '', title: '',characterCount: 10})
|
||||
}
|
||||
|
||||
handleChangeforPost(event) {
|
||||
@ -51,6 +52,7 @@ class Writing_Microblogs extends Component {
|
||||
const charCount = event.target.value.length
|
||||
const charRemaining = 10 - charCount
|
||||
this.setState({characterCount: charRemaining })
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
215
twistter-frontend/src/pages/edit.js
Normal file
215
twistter-frontend/src/pages/edit.js
Normal file
@ -0,0 +1,215 @@
|
||||
import React, { Component } from "react";
|
||||
import axios from "axios";
|
||||
import PropTypes from "prop-types";
|
||||
// TODO: Fix font, so that it is roboto
|
||||
// TODO: Add a read-only '@' in the left side of the handle input
|
||||
// TODO: Add a cancel button, that takes the user back to their profile page
|
||||
// TODO: Sort imports
|
||||
// TODO: Add comments
|
||||
|
||||
// Material-UI stuff
|
||||
import TextField from "@material-ui/core/TextField";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import withStyles from "@material-ui/core/styles/withStyles";
|
||||
import Grid from "@material-ui/core/Grid";
|
||||
import Button from "@material-ui/core/Button";
|
||||
import CircularProgress from '@material-ui/core/CircularProgress';
|
||||
|
||||
const styles = {
|
||||
form: {
|
||||
textAlign: "center"
|
||||
},
|
||||
textField: {
|
||||
marginBottom: 40
|
||||
},
|
||||
pageTitle: {
|
||||
marginTop: 40,
|
||||
marginBottom: 40
|
||||
},
|
||||
button: {
|
||||
positon: 'relative',
|
||||
},
|
||||
progress: {
|
||||
position: 'absolute',
|
||||
}
|
||||
};
|
||||
|
||||
export class edit extends Component {
|
||||
|
||||
componentDidMount() {
|
||||
axios
|
||||
.get("/getProfileInfo")
|
||||
.then((res) => {
|
||||
this.setState({
|
||||
firstName: res.data.firstName,
|
||||
lastName: res.data.lastName,
|
||||
email: res.data.email,
|
||||
handle: res.data.handle,
|
||||
bio: res.data.bio
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err);
|
||||
});
|
||||
}
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.state = {
|
||||
firstName: "",
|
||||
lastName: "",
|
||||
email: "",
|
||||
handle: "",
|
||||
bio: "",
|
||||
loading: false,
|
||||
errors: {}
|
||||
};
|
||||
}
|
||||
|
||||
handleSubmit = (event) => {
|
||||
event.preventDefault();
|
||||
this.setState({
|
||||
loading: true
|
||||
});
|
||||
const newProfileData = {
|
||||
firstName: this.state.firstName,
|
||||
lastName: this.state.lastName,
|
||||
email: this.state.email,
|
||||
handle: this.state.handle,
|
||||
bio: this.state.bio
|
||||
};
|
||||
axios
|
||||
.post("/updateProfileInfo", newProfileData)
|
||||
.then((res) => {
|
||||
this.setState({
|
||||
loading: false
|
||||
});
|
||||
// this.props.history.push('/');
|
||||
// TODO: Need to redirect user to their profile page
|
||||
})
|
||||
.catch((err) => {
|
||||
this.setState({
|
||||
errors: err.response.data,
|
||||
loading: false
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
handleChange = (event) => {
|
||||
this.setState({
|
||||
[event.target.name]: event.target.value,
|
||||
errors: {
|
||||
[event.target.name]: null,
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { classes } = this.props;
|
||||
const { errors, loading } = this.state;
|
||||
|
||||
return (
|
||||
<Grid container className={classes.form}>
|
||||
<Grid item sm />
|
||||
<Grid item sm>
|
||||
<Typography variant="h2" className={classes.pageTitle}>
|
||||
Edit Profile
|
||||
</Typography>
|
||||
<form noValidate onSubmit={this.handleSubmit}>
|
||||
<Grid container className={classes.form} spacing={4}>
|
||||
<Grid item sm>
|
||||
<TextField
|
||||
id="firstName"
|
||||
name="firstName"
|
||||
label="First Name"
|
||||
className={classes.textField}
|
||||
value={this.state.firstName}
|
||||
helperText={errors.firstName}
|
||||
error={errors.firstName ? true : false}
|
||||
variant="outlined"
|
||||
onChange={this.handleChange}
|
||||
fullWidth
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item sm>
|
||||
<TextField
|
||||
id="lastName"
|
||||
name="lastName"
|
||||
label="Last Name"
|
||||
className={classes.textField}
|
||||
value={this.state.lastName}
|
||||
helperText={errors.lastname}
|
||||
error={errors.lastName ? true : false}
|
||||
variant="outlined"
|
||||
onChange={this.handleChange}
|
||||
fullWidth
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<TextField
|
||||
id="email"
|
||||
name="email"
|
||||
label="Email*"
|
||||
className={classes.textField}
|
||||
value={this.state.email}
|
||||
disabled
|
||||
helperText="(disabled)"
|
||||
// helperText={errors.email}
|
||||
// error={errors.email ? true : false}
|
||||
variant="outlined"
|
||||
onChange={this.handleChange}
|
||||
fullWidth
|
||||
/>
|
||||
<TextField
|
||||
id="handle"
|
||||
name="handle"
|
||||
label="Handle*"
|
||||
className={classes.textField}
|
||||
value={this.state.handle}
|
||||
disabled
|
||||
helperText="(disabled)"
|
||||
// helperText={errors.handle}
|
||||
// error={errors.handle ? true : false}
|
||||
variant="outlined"
|
||||
onChange={this.handleChange}
|
||||
fullWidth
|
||||
/>
|
||||
<TextField
|
||||
id="bio"
|
||||
name="bio"
|
||||
label="Bio"
|
||||
className={classes.textField}
|
||||
value={this.state.bio}
|
||||
helperText={errors.bio}
|
||||
error={errors.bio ? true : false}
|
||||
multiline
|
||||
rows="8"
|
||||
variant="outlined"
|
||||
onChange={this.handleChange}
|
||||
fullWidth
|
||||
/>
|
||||
<Button
|
||||
type="submit"
|
||||
variant="contained"
|
||||
color="primary"
|
||||
className={classes.button}
|
||||
disabled={loading}
|
||||
>
|
||||
Submit
|
||||
{loading && (
|
||||
<CircularProgress size={30} className={classes.progress}/>
|
||||
)}
|
||||
</Button>
|
||||
</form>
|
||||
</Grid>
|
||||
<Grid item sm />
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
edit.propTypes = {
|
||||
classes: PropTypes.object.isRequired
|
||||
};
|
||||
|
||||
export default withStyles(styles)(edit);
|
||||
Loading…
Reference in New Issue
Block a user