mirror of
https://github.com/ClaytonWWilson/CS307-Team24.git
synced 2025-12-16 02:08:47 +00:00
Reconciled with new pull from master
This commit is contained in:
Aaron Sun
commit
4517bc6756
28
functions/handlers/post.js
Normal file
28
functions/handlers/post.js
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
const admin = require('firebase-admin');
|
||||||
|
/* eslint-disable promise/always-return */
|
||||||
|
exports.putPost = (req, res) => {
|
||||||
|
|
||||||
|
|
||||||
|
const newPost = {
|
||||||
|
body: req.body.body,
|
||||||
|
userHandle: req.body.userHandle,
|
||||||
|
userImage: req.body.userImage,
|
||||||
|
microBlogTitle: req.body.microBlogTitle,
|
||||||
|
createdAt: new Date().toISOString(),
|
||||||
|
likeCount: 0,
|
||||||
|
commentCount: 0,
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
admin.firestore().collection('posts').add(newPost)
|
||||||
|
.then((doc) => {
|
||||||
|
const resPost = newPost;
|
||||||
|
resPost.postId = doc.id;
|
||||||
|
return res.status(200).json(resPost);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error(err);
|
||||||
|
return res.status(500).json({ error: 'something is wrong'});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
78
functions/handlers/users.js
Normal file
78
functions/handlers/users.js
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
const {db} = require('../util/admin');
|
||||||
|
const {validateUpdateProfileInfo} = require('../util/validator');
|
||||||
|
|
||||||
|
exports.getProfileInfo = (req, res) => {
|
||||||
|
// FIXME: Delete this after login is implemented
|
||||||
|
req.user = {};
|
||||||
|
req.user.handle = 'itsjimmy';
|
||||||
|
|
||||||
|
db.collection('users').doc(req.user.handle).get()
|
||||||
|
.then((data) => {
|
||||||
|
return res.status(200).json(data.data());
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error(err);
|
||||||
|
return res.status(500).json(err);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
exports.updateProfileInfo = (req, res) => {
|
||||||
|
// FIXME: Delete this after login is implemented
|
||||||
|
req.user = {};
|
||||||
|
req.user.handle = 'itsjimmy';
|
||||||
|
|
||||||
|
// TODO: Add functionality for adding/updating profile images
|
||||||
|
|
||||||
|
|
||||||
|
// Data validation
|
||||||
|
const {valid, errors, profileData} = validateUpdateProfileInfo(req.body);
|
||||||
|
if (!valid) return res.status(400).json(errors);
|
||||||
|
|
||||||
|
|
||||||
|
// Update the database entry for this user
|
||||||
|
db.collection('users').doc(req.user.handle).set(profileData, {merge: true})
|
||||||
|
.then(() => {
|
||||||
|
console.log(`${req.user.handle}'s profile info has been updated.`)
|
||||||
|
return res.status(201).json({general: `${req.user.handle}'s profile info has been updated.`});
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error(err);
|
||||||
|
return res.status(500).json({
|
||||||
|
error: 'Error updating profile data'
|
||||||
|
});
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
|
exports.getUserDetails = (req, res) => {
|
||||||
|
let userData = {};
|
||||||
|
db.doc(`/users/${req.params.handle}`).get().then((doc) => {
|
||||||
|
if (doc.exists) {
|
||||||
|
userData.user = doc.data();
|
||||||
|
return db.collection('post').where('userHandle', '==', req.params.handle)
|
||||||
|
.orderBy('createdAt', 'desc').get();
|
||||||
|
} else {
|
||||||
|
return res.status(404).json({
|
||||||
|
error: 'User not found'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.then((data) => {
|
||||||
|
userData.posts = [];
|
||||||
|
data.forEach((doc) => {
|
||||||
|
userData.posts.push({
|
||||||
|
body: doc.data().body,
|
||||||
|
createAt: doc.data().createAt,
|
||||||
|
userHandle: doc.data().userHandle,
|
||||||
|
userImage: doc.data().userImage,
|
||||||
|
likeCount: doc.data().likeCount,
|
||||||
|
commentCount: doc.data().commentCount,
|
||||||
|
postId: doc.id
|
||||||
|
});
|
||||||
|
});
|
||||||
|
return res.json(userData);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error(err);
|
||||||
|
return res.status(500).json({ error: err.code});
|
||||||
|
});
|
||||||
|
};
|
||||||
@ -1,9 +1,8 @@
|
|||||||
/* eslint-disable promise/always-return */
|
/* eslint-disable promise/always-return */
|
||||||
const functions = require('firebase-functions');
|
const functions = require('firebase-functions');
|
||||||
const admin = require('firebase-admin');
|
|
||||||
const app = require('express')();
|
const app = require('express')();
|
||||||
admin.initializeApp();
|
const cors = require('cors');
|
||||||
const db = admin.firestore();
|
app.use(cors());
|
||||||
|
|
||||||
var config = {
|
var config = {
|
||||||
apiKey: "AIzaSyCvsWetg4qFdsPGfJ3LCw_QaaYzoan7Q34",
|
apiKey: "AIzaSyCvsWetg4qFdsPGfJ3LCw_QaaYzoan7Q34",
|
||||||
@ -231,29 +230,29 @@ app.post('/login', (req, res) => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get('/getUsers', (req, res) => {
|
/*------------------------------------------------------------------*
|
||||||
admin.firestore().collection('users').get().then(data => {
|
* handlers/users.js *
|
||||||
let users = [];
|
*------------------------------------------------------------------*/
|
||||||
data.forEach(doc => {
|
const {getUserDetails, getProfileInfo, updateProfileInfo} = require('./handlers/users');
|
||||||
users.push(doc.data());
|
|
||||||
}); return res.json(users);
|
app.get('/getUser/:handle', getUserDetails);
|
||||||
}).catch((err) => console.error(err));
|
|
||||||
});
|
// Returns all profile data of the currently logged in user
|
||||||
|
// TODO: Add fbAuth
|
||||||
|
app.get('/getProfileInfo', getProfileInfo);
|
||||||
|
|
||||||
|
// Updates the currently logged in user's profile information
|
||||||
|
// TODO: Add fbAuth
|
||||||
|
app.post('/updateProfileInfo', updateProfileInfo);
|
||||||
|
|
||||||
|
/*------------------------------------------------------------------*
|
||||||
|
* handlers/post.js *
|
||||||
|
*------------------------------------------------------------------*/
|
||||||
|
const {putPost} = require('./handlers/post');
|
||||||
|
|
||||||
|
|
||||||
|
// Adds one post to the database
|
||||||
|
app.post('/putPost', fbAuth, putPost);
|
||||||
|
|
||||||
app.post('/postUser', (req, res) => {
|
|
||||||
const newUser = {
|
|
||||||
body: req.body.body
|
|
||||||
};
|
|
||||||
admin.firestore().collection('users').add(newUser).then((doc) => {
|
|
||||||
res.json({
|
|
||||||
message: 'Successfully added!'
|
|
||||||
});
|
|
||||||
}).catch((err) => {
|
|
||||||
res.status(500).json({
|
|
||||||
error: "Error in posting user!"
|
|
||||||
});
|
|
||||||
console.error(err);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
exports.api = functions.https.onRequest(app);
|
exports.api = functions.https.onRequest(app);
|
||||||
94
functions/package-lock.json
generated
94
functions/package-lock.json
generated
@ -26,7 +26,7 @@
|
|||||||
"@firebase/app": {
|
"@firebase/app": {
|
||||||
"version": "0.4.17",
|
"version": "0.4.17",
|
||||||
"resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.4.17.tgz",
|
"resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.4.17.tgz",
|
||||||
"integrity": "sha512-4aa6ixQlV6xQxj4HbwFKrfYZnnKk8AtB/vEEuIaBCGQYBvV287OVNCozXd4CC4Q4I4Vtkzrc+kggahYFl8nDWQ==",
|
"integrity": "sha512-YkCe10/KHnfJ5Lx79SCQ4ZJRlpnwe8Yns6Ntf7kltXq1hCQCUrKEU3zaOTPY90SBx36hYm47IaqkKwT/kBOK3A==",
|
||||||
"requires": {
|
"requires": {
|
||||||
"@firebase/app-types": "0.4.3",
|
"@firebase/app-types": "0.4.3",
|
||||||
"@firebase/logger": "0.1.25",
|
"@firebase/logger": "0.1.25",
|
||||||
@ -70,15 +70,36 @@
|
|||||||
"integrity": "sha512-foQHhvyB0RR+mb/+wmHXd/VOU+D8fruFEW1k79Q9wzyTPpovMBa1Mcns5fwEWBhUfi8bmoEtaGB8RSAHnTFzTg=="
|
"integrity": "sha512-foQHhvyB0RR+mb/+wmHXd/VOU+D8fruFEW1k79Q9wzyTPpovMBa1Mcns5fwEWBhUfi8bmoEtaGB8RSAHnTFzTg=="
|
||||||
},
|
},
|
||||||
"@firebase/database": {
|
"@firebase/database": {
|
||||||
|
<<<<<<< HEAD
|
||||||
"version": "0.5.3",
|
"version": "0.5.3",
|
||||||
"resolved": "https://registry.npmjs.org/@firebase/database/-/database-0.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@firebase/database/-/database-0.5.3.tgz",
|
||||||
"integrity": "sha512-LnXKRE1AmjlS+iRF7j8vx+Ni8x85CmLP5u5Pw5rDKhKLn2eTR1tJKD937mUeeGEtDHwR1rrrkLYOqRR2cSG3hQ==",
|
"integrity": "sha512-LnXKRE1AmjlS+iRF7j8vx+Ni8x85CmLP5u5Pw5rDKhKLn2eTR1tJKD937mUeeGEtDHwR1rrrkLYOqRR2cSG3hQ==",
|
||||||
|
=======
|
||||||
|
"version": "0.5.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/@firebase/database/-/database-0.5.4.tgz",
|
||||||
|
"integrity": "sha512-Hz1Bi3fzIcNNocE4EhvvwoEQGurG2BGssWD3/6a2bzty+K1e57SLea2Ied8QYNBUU1zt/4McHfa3Y71EQIyn/w==",
|
||||||
|
>>>>>>> 7969d3b10bc35a9078834c5ee2ba8c8fd60d338f
|
||||||
"requires": {
|
"requires": {
|
||||||
"@firebase/database-types": "0.4.3",
|
"@firebase/database-types": "0.4.3",
|
||||||
"@firebase/logger": "0.1.24",
|
"@firebase/logger": "0.1.25",
|
||||||
"@firebase/util": "0.2.27",
|
"@firebase/util": "0.2.28",
|
||||||
"faye-websocket": "0.11.3",
|
"faye-websocket": "0.11.3",
|
||||||
"tslib": "1.10.0"
|
"tslib": "1.10.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@firebase/logger": {
|
||||||
|
"version": "0.1.25",
|
||||||
|
"resolved": "https://registry.npmjs.org/@firebase/logger/-/logger-0.1.25.tgz",
|
||||||
|
"integrity": "sha512-/lRhuepVcCCnQ2jcO5Hr08SYdmZDTQU9fdPdzg+qXJ9k/QnIrD2RbswXQcL6mmae3uPpX7fFXQAoScJ9pzp50w=="
|
||||||
|
},
|
||||||
|
"@firebase/util": {
|
||||||
|
"version": "0.2.28",
|
||||||
|
"resolved": "https://registry.npmjs.org/@firebase/util/-/util-0.2.28.tgz",
|
||||||
|
"integrity": "sha512-ZQMAWtXj8y5kvB6izs0aTM/jG+WO8HpqhXA/EwD6LckJ+1P5LnAhaLZt1zR4HpuCE+jeP5I32Id5RJ/aifFs6A==",
|
||||||
|
"requires": {
|
||||||
|
"tslib": "1.10.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"@firebase/database-types": {
|
"@firebase/database-types": {
|
||||||
@ -92,7 +113,11 @@
|
|||||||
"@firebase/firestore": {
|
"@firebase/firestore": {
|
||||||
"version": "1.5.3",
|
"version": "1.5.3",
|
||||||
"resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-1.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-1.5.3.tgz",
|
||||||
|
<<<<<<< HEAD
|
||||||
"integrity": "sha512-CPYLvkGZBKE47oQC9a0q13UMVRj3LvnSbB1nOerktE3CGRHKy44LxDumamN8Kj067hV/80mKK9FdbeUufwO/Rg==",
|
"integrity": "sha512-CPYLvkGZBKE47oQC9a0q13UMVRj3LvnSbB1nOerktE3CGRHKy44LxDumamN8Kj067hV/80mKK9FdbeUufwO/Rg==",
|
||||||
|
=======
|
||||||
|
"integrity": "sha512-O/yAbXpitOA6g627cUl0/FHYlkTy1EiEKMKOlnlMOJF2fH+nLVZREXjsrCC7N2tIvTn7yYwfpZ4zpSNvrhwiTA==",
|
||||||
|
>>>>>>> 7969d3b10bc35a9078834c5ee2ba8c8fd60d338f
|
||||||
"requires": {
|
"requires": {
|
||||||
"@firebase/firestore-types": "1.5.0",
|
"@firebase/firestore-types": "1.5.0",
|
||||||
"@firebase/logger": "0.1.25",
|
"@firebase/logger": "0.1.25",
|
||||||
@ -335,9 +360,9 @@
|
|||||||
"optional": true
|
"optional": true
|
||||||
},
|
},
|
||||||
"@google-cloud/storage": {
|
"@google-cloud/storage": {
|
||||||
"version": "3.2.1",
|
"version": "3.3.0",
|
||||||
"resolved": "https://registry.npmjs.org/@google-cloud/storage/-/storage-3.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/@google-cloud/storage/-/storage-3.3.0.tgz",
|
||||||
"integrity": "sha512-129EwPGej6bXzY1u5nja2aeMDew6DIHaJn7ZV6nteQ74LQQSNv2jKrqTlyhndBsAwpuwQAxeghPTCoFT/H8Frg==",
|
"integrity": "sha512-9jmHJ0ncQTcrZRwq5MRjXEwuCFkIjHenYwVbycV6bbZ4O84Hcgg4Yp33sKcJug5rvZeVgrpCzPbYXqO3B0LzJw==",
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"@google-cloud/common": "^2.1.1",
|
"@google-cloud/common": "^2.1.1",
|
||||||
@ -346,27 +371,50 @@
|
|||||||
"arrify": "^2.0.0",
|
"arrify": "^2.0.0",
|
||||||
"compressible": "^2.0.12",
|
"compressible": "^2.0.12",
|
||||||
"concat-stream": "^2.0.0",
|
"concat-stream": "^2.0.0",
|
||||||
"date-and-time": "^0.9.0",
|
"date-and-time": "^0.10.0",
|
||||||
"duplexify": "^3.5.0",
|
"duplexify": "^3.5.0",
|
||||||
"extend": "^3.0.2",
|
"extend": "^3.0.2",
|
||||||
"gaxios": "^2.0.1",
|
"gaxios": "^2.0.1",
|
||||||
"gcs-resumable-upload": "^2.0.0",
|
"gcs-resumable-upload": "^2.2.4",
|
||||||
"hash-stream-validation": "^0.2.1",
|
"hash-stream-validation": "^0.2.1",
|
||||||
"mime": "^2.2.0",
|
"mime": "^2.2.0",
|
||||||
"mime-types": "^2.0.8",
|
"mime-types": "^2.0.8",
|
||||||
"onetime": "^5.1.0",
|
"onetime": "^5.1.0",
|
||||||
"p-limit": "^2.2.0",
|
"p-limit": "^2.2.0",
|
||||||
"pumpify": "^2.0.0",
|
"pumpify": "^2.0.0",
|
||||||
|
"readable-stream": "^3.4.0",
|
||||||
"snakeize": "^0.1.0",
|
"snakeize": "^0.1.0",
|
||||||
"stream-events": "^1.0.1",
|
"stream-events": "^1.0.1",
|
||||||
"through2": "^3.0.0",
|
"through2": "^3.0.0",
|
||||||
"xdg-basedir": "^4.0.0"
|
"xdg-basedir": "^4.0.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"readable-stream": {
|
||||||
|
"version": "3.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.4.0.tgz",
|
||||||
|
"integrity": "sha512-jItXPLmrSR8jmTRmRWJXCnGJsfy85mB3Wd/uINMXA65yrnFo0cPClFIUWzo2najVNSl+mx7/4W8ttlLWJe99pQ==",
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"inherits": "^2.0.3",
|
||||||
|
"string_decoder": "^1.1.1",
|
||||||
|
"util-deprecate": "^1.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"string_decoder": {
|
||||||
|
"version": "1.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
|
||||||
|
"integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"safe-buffer": "~5.2.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"@grpc/grpc-js": {
|
"@grpc/grpc-js": {
|
||||||
"version": "0.5.3",
|
"version": "0.5.4",
|
||||||
"resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-0.5.3.tgz",
|
"resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-0.5.4.tgz",
|
||||||
"integrity": "sha512-doDzxjdN0IJihQJvjDkZun9bZp/TW2EKO5E4fNvw8634kU1eNqPnFtAmiEiIYptqJ9StC+zRo1mwrazhqI0k5A==",
|
"integrity": "sha512-aY4fTCz7jq7oKFmfAeZVqGzMCR5I9NLdY9E2fJ70QtGXwlJnTaN6cnbRmCk23/aKPx9UHqOtk2lyjpN6LbAaxw==",
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"semver": "^6.2.0"
|
"semver": "^6.2.0"
|
||||||
@ -974,9 +1022,9 @@
|
|||||||
"optional": true
|
"optional": true
|
||||||
},
|
},
|
||||||
"date-and-time": {
|
"date-and-time": {
|
||||||
"version": "0.9.0",
|
"version": "0.10.0",
|
||||||
"resolved": "https://registry.npmjs.org/date-and-time/-/date-and-time-0.9.0.tgz",
|
"resolved": "https://registry.npmjs.org/date-and-time/-/date-and-time-0.10.0.tgz",
|
||||||
"integrity": "sha512-4JybB6PbR+EebpFx/KyR5Ybl+TcdXMLIJkyYsCx3P4M4CWGMuDyFF19yh6TyasMAIF5lrsgIxiSHBXh2FFc7Fg==",
|
"integrity": "sha512-IbIzxtvK80JZOVsWF6+NOjunTaoFVYxkAQoyzmflJyuRCJAJebehy48mPiCAedcGp4P7/UO3QYRWa0fe6INftg==",
|
||||||
"optional": true
|
"optional": true
|
||||||
},
|
},
|
||||||
"debug": {
|
"debug": {
|
||||||
@ -1146,9 +1194,15 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"end-of-stream": {
|
"end-of-stream": {
|
||||||
|
<<<<<<< HEAD
|
||||||
"version": "1.4.1",
|
"version": "1.4.1",
|
||||||
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.1.tgz",
|
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.1.tgz",
|
||||||
"integrity": "sha512-1MkrZNvWTKCaigbn+W15elq2BB/L22nqrSY5DKlo3X6+vclJm8Bb5djXJBmEX6fS3+zCh/F4VBK5Z2KxJt4s2Q==",
|
"integrity": "sha512-1MkrZNvWTKCaigbn+W15elq2BB/L22nqrSY5DKlo3X6+vclJm8Bb5djXJBmEX6fS3+zCh/F4VBK5Z2KxJt4s2Q==",
|
||||||
|
=======
|
||||||
|
"version": "1.4.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.3.tgz",
|
||||||
|
"integrity": "sha512-cbNhPFS6MlYlWTGncSiDYbdqKhwWFy7kNeb1YSOG6K65i/wPTkLVCJQj0hXA4j0m5Da+hBWnqopEnu1FFelisQ==",
|
||||||
|
>>>>>>> 7969d3b10bc35a9078834c5ee2ba8c8fd60d338f
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"once": "^1.4.0"
|
"once": "^1.4.0"
|
||||||
@ -1713,9 +1767,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"google-gax": {
|
"google-gax": {
|
||||||
"version": "1.5.2",
|
"version": "1.6.1",
|
||||||
"resolved": "https://registry.npmjs.org/google-gax/-/google-gax-1.5.2.tgz",
|
"resolved": "https://registry.npmjs.org/google-gax/-/google-gax-1.6.1.tgz",
|
||||||
"integrity": "sha512-NceyDzlw4mQz6qH3bDIuRtfDAZKehM96QpnPPJ3Hur7FA/gPzpzboUYwhfP6q5obSP4LuSSDhI/76Fu51/ljtg==",
|
"integrity": "sha512-5/6uaUA9qAqRKVe2sjvMgsnU/HbfQisQTM5EZ5DfNGOYVBoTsPBdOhR2ZqEWPyqHe7YkdzVHev3FH9W3YWcORw==",
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"@grpc/grpc-js": "^0.5.2",
|
"@grpc/grpc-js": "^0.5.2",
|
||||||
@ -2186,9 +2240,15 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"gtoken": {
|
"gtoken": {
|
||||||
|
<<<<<<< HEAD
|
||||||
"version": "4.0.0",
|
"version": "4.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/gtoken/-/gtoken-4.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/gtoken/-/gtoken-4.0.0.tgz",
|
||||||
"integrity": "sha512-XaRCfHJxhj06LmnWNBzVTAr85NfAErq0W1oabkdqwbq3uL/QTB1kyvGog361Uu2FMG/8e3115sIy/97Rnd4GjQ==",
|
"integrity": "sha512-XaRCfHJxhj06LmnWNBzVTAr85NfAErq0W1oabkdqwbq3uL/QTB1kyvGog361Uu2FMG/8e3115sIy/97Rnd4GjQ==",
|
||||||
|
=======
|
||||||
|
"version": "4.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/gtoken/-/gtoken-4.1.0.tgz",
|
||||||
|
"integrity": "sha512-wqyn2gf5buzEZN4QNmmiiW2i2JkEdZnL7Z/9p44RtZqgt4077m4khRgAYNuu8cBwHWCc6MsP6eDUn/KkF6jFIw==",
|
||||||
|
>>>>>>> 7969d3b10bc35a9078834c5ee2ba8c8fd60d338f
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"gaxios": "^2.0.0",
|
"gaxios": "^2.0.0",
|
||||||
|
|||||||
@ -13,9 +13,8 @@
|
|||||||
"node": "10"
|
"node": "10"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"express": "^4.17.1",
|
|
||||||
"firebase": "^6.6.2",
|
"firebase": "^6.6.2",
|
||||||
"firebase-admin": "^8.0.0",
|
"firebase-admin": "^8.6.0",
|
||||||
"firebase-functions": "^3.1.0"
|
"firebase-functions": "^3.1.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|||||||
7
functions/util/admin.js
Normal file
7
functions/util/admin.js
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
const admin = require('firebase-admin');
|
||||||
|
|
||||||
|
admin.initializeApp();
|
||||||
|
|
||||||
|
const db = admin.firestore();
|
||||||
|
|
||||||
|
module.exports = { admin, db };
|
||||||
9
functions/util/config.js
Normal file
9
functions/util/config.js
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
module.exports = {
|
||||||
|
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"
|
||||||
|
};
|
||||||
34
functions/util/fbAuth.js
Normal file
34
functions/util/fbAuth.js
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
const { admin, db } = require('./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
|
||||||
|
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;
|
||||||
|
} else {
|
||||||
|
console.error('No token found');
|
||||||
|
return res.status(403).json({ error: 'Unauthorized'});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Checking that the token is valid in firebase
|
||||||
|
admin.auth().verifyIdToken(idToken)
|
||||||
|
.then((decodedToken) => {
|
||||||
|
req.user = decodedToken;
|
||||||
|
return db.collection('users').where('userId', '==', req.user.uid)
|
||||||
|
.limit(1)
|
||||||
|
.get();
|
||||||
|
})
|
||||||
|
.then((data) => {
|
||||||
|
req.user.handle = data.docs[0].data().handle; // Save username
|
||||||
|
req.user.imageUrl = data.docs[0].data().imageUrl;
|
||||||
|
return next();
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error('Error while verifying token ', err);
|
||||||
|
return res.status(403).json(err);
|
||||||
|
});
|
||||||
|
};
|
||||||
36
functions/util/validator.js
Normal file
36
functions/util/validator.js
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
const isEmpty = (str) => {
|
||||||
|
if (str.trim() === '') return true;
|
||||||
|
else return false;
|
||||||
|
};
|
||||||
|
|
||||||
|
const isEmail = (str) => {
|
||||||
|
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,}))$/;
|
||||||
|
if (str.match(emailRegEx)) return true;
|
||||||
|
else return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
exports.validateUpdateProfileInfo = (data) => {
|
||||||
|
let errors = {};
|
||||||
|
let profileData = {};
|
||||||
|
|
||||||
|
// ?: Should users be able to change their handles and emails?
|
||||||
|
|
||||||
|
// Only adds the key to the DB if the values are not empty
|
||||||
|
if (!isEmpty(data.firstName)) profileData.firstName = data.firstName.trim();
|
||||||
|
if (!isEmpty(data.lastName)) profileData.lastName = data.lastName.trim();
|
||||||
|
if (!isEmpty(data.bio)) profileData.bio = data.bio.trim();
|
||||||
|
|
||||||
|
if (isEmpty(data.email)) {
|
||||||
|
errors.email = "Must not be empty.";
|
||||||
|
} else if (!isEmail(data.email)) {
|
||||||
|
errors.email = "Must be a valid email."
|
||||||
|
} else {
|
||||||
|
profileData.email = data.email;
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
errors,
|
||||||
|
valid: Object.keys(errors).length === 0 ? true : false,
|
||||||
|
profileData
|
||||||
|
}
|
||||||
|
};
|
||||||
@ -1,78 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<title>Welcome to Firebase Hosting</title>
|
|
||||||
|
|
||||||
<!-- update the version number as needed -->
|
|
||||||
<script defer src="/__/firebase/6.6.0/firebase-app.js"></script>
|
|
||||||
<!-- include only the Firebase features as you need -->
|
|
||||||
<script defer src="/__/firebase/6.6.0/firebase-auth.js"></script>
|
|
||||||
<script defer src="/__/firebase/6.6.0/firebase-database.js"></script>
|
|
||||||
<script defer src="/__/firebase/6.6.0/firebase-messaging.js"></script>
|
|
||||||
<script defer src="/__/firebase/6.6.0/firebase-storage.js"></script>
|
|
||||||
<!-- initialize the SDK after all desired features are loaded -->
|
|
||||||
<script defer src="/__/firebase/init.js"></script>
|
|
||||||
|
|
||||||
<style media="screen">
|
|
||||||
body { background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
|
|
||||||
#message { background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px; border-radius: 3px; }
|
|
||||||
#message h2 { color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
|
|
||||||
#message h1 { font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
|
|
||||||
#message p { line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
|
|
||||||
#message a { display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
|
|
||||||
#message, #message a { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
|
|
||||||
#load { color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
|
|
||||||
@media (max-width: 600px) {
|
|
||||||
body, #message { margin-top: 0; background: white; box-shadow: none; }
|
|
||||||
body { border-top: 16px solid #ffa100; }
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="message">
|
|
||||||
<h2>This is a test message!</h2>
|
|
||||||
<h2>Welcome</h2>
|
|
||||||
|
|
||||||
|
|
||||||
<h1>Firebase Hosting Setup Complete</h1>
|
|
||||||
<p>You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!</p>
|
|
||||||
<a target="_blank" href="https://firebase.google.com/docs/hosting/">Open Hosting Documentation</a>
|
|
||||||
<div id="like_button_container"></div>
|
|
||||||
</div>
|
|
||||||
<p id="load">Firebase SDK Loading…</p>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
|
|
||||||
// // The Firebase SDK is initialized and available here!
|
|
||||||
//
|
|
||||||
// firebase.auth().onAuthStateChanged(user => { });
|
|
||||||
// firebase.database().ref('/path/to/ref').on('value', snapshot => { });
|
|
||||||
// firebase.messaging().requestPermission().then(() => { });
|
|
||||||
// firebase.storage().ref('/path/to/ref').getDownloadURL().then(() => { });
|
|
||||||
//
|
|
||||||
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
|
|
||||||
|
|
||||||
try {
|
|
||||||
let app = firebase.app();
|
|
||||||
let features = ['auth', 'database', 'messaging', 'storage'].filter(feature => typeof app[feature] === 'function');
|
|
||||||
document.getElementById('load').innerHTML = `Firebase SDK loaded with ${features.join(', ')}`;
|
|
||||||
} catch (e) {
|
|
||||||
console.error(e);
|
|
||||||
document.getElementById('load').innerHTML = 'Error loading the Firebase SDK, check the console.';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Load React. -->
|
|
||||||
<!-- Note: when deploying, replace "development.js" with "production.min.js". -->
|
|
||||||
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
|
|
||||||
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
|
|
||||||
|
|
||||||
<!-- Load our React component. -->
|
|
||||||
<script src="like_button.js"></script>
|
|
||||||
<script src="loader.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,30 +0,0 @@
|
|||||||
'use strict';
|
|
||||||
|
|
||||||
const e = React.createElement;
|
|
||||||
|
|
||||||
class LikeButton extends React.Component {
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
this.state = {
|
|
||||||
liked: false
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
if (this.state.liked) {
|
|
||||||
return 'You liked this.';
|
|
||||||
}
|
|
||||||
|
|
||||||
return e(
|
|
||||||
'button', {
|
|
||||||
onClick: () => this.setState({
|
|
||||||
liked: true
|
|
||||||
})
|
|
||||||
},
|
|
||||||
'Like'
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const domContainer = document.querySelector('#like_button_container');
|
|
||||||
ReactDOM.render(e(LikeButton), domContainer);
|
|
||||||
14878
twistter-frontend/package-lock.json
generated
14878
twistter-frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -5,10 +5,16 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@material-ui/core": "^4.4.3",
|
"@material-ui/core": "^4.4.3",
|
||||||
"axios": "^0.19.0",
|
"axios": "^0.19.0",
|
||||||
|
"create-react-app": "^3.1.2",
|
||||||
|
"install": "^0.13.0",
|
||||||
|
"node-pre-gyp": "^0.13.0",
|
||||||
"react": "^16.9.0",
|
"react": "^16.9.0",
|
||||||
"react-dom": "^16.9.0",
|
"react-dom": "^16.9.0",
|
||||||
"react-router-dom": "^5.0.1",
|
"react-redux": "^7.1.1",
|
||||||
"react-scripts": "^3.1.2"
|
"react-router-dom": "^5.1.0",
|
||||||
|
"react-scripts": "0.9.5",
|
||||||
|
"redux": "^4.0.4",
|
||||||
|
"redux-thunk": "^2.3.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {},
|
"devDependencies": {},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|||||||
0
twistter-frontend/redux/actions/dataActions.js
Normal file
0
twistter-frontend/redux/actions/dataActions.js
Normal file
0
twistter-frontend/redux/actions/userActions.js
Normal file
0
twistter-frontend/redux/actions/userActions.js
Normal file
0
twistter-frontend/redux/reducers/dataReducer.js
Normal file
0
twistter-frontend/redux/reducers/dataReducer.js
Normal file
0
twistter-frontend/redux/reducers/uiReducer.js
Normal file
0
twistter-frontend/redux/reducers/uiReducer.js
Normal file
0
twistter-frontend/redux/reducers/userReducer.js
Normal file
0
twistter-frontend/redux/reducers/userReducer.js
Normal file
18
twistter-frontend/redux/store.js
Normal file
18
twistter-frontend/redux/store.js
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
import { createStore, combineReducers, applyMiddleware, compose } from 'redux';
|
||||||
|
import thunk from 'redux-thunk';
|
||||||
|
|
||||||
|
import userReducer from './reducers/userReducer';
|
||||||
|
import dataReducer from './reducers/dataReducer';
|
||||||
|
import uiReducer from './reducers/uiReducer';
|
||||||
|
|
||||||
|
const initialState = {};
|
||||||
|
|
||||||
|
const middleware = {thunk};
|
||||||
|
|
||||||
|
const reducers = combineReducers({
|
||||||
|
user: userReducer,
|
||||||
|
data: dataReducer,
|
||||||
|
UI: uiReducer
|
||||||
|
});
|
||||||
|
|
||||||
|
//const store = createStore(reducers, )
|
||||||
0
twistter-frontend/redux/types.js
Normal file
0
twistter-frontend/redux/types.js
Normal file
@ -37,4 +37,12 @@
|
|||||||
.authInput {
|
.authInput {
|
||||||
background-color: #eee;
|
background-color: #eee;
|
||||||
width:500px;
|
width:500px;
|
||||||
|
height:40px;
|
||||||
|
border: 0px;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
margin: 80px auto 0 auto;
|
||||||
|
max-width: 1200px;
|
||||||
}
|
}
|
||||||
@ -1,22 +1,32 @@
|
|||||||
|
/* eslint-disable */
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
|
|
||||||
import './App.css';
|
import './App.css';
|
||||||
|
|
||||||
import { BrowserRouter as Router } from 'react-router-dom';
|
import { BrowserRouter as Router } from 'react-router-dom';
|
||||||
import Route from 'react-router-dom/Route';
|
import Route from 'react-router-dom/Route';
|
||||||
|
|
||||||
|
|
||||||
import home from './Home.js';
|
import home from './Home.js';
|
||||||
import register from './Register.js';
|
import register from './Register.js';
|
||||||
import login from './Login.js';
|
import login from './Login.js';
|
||||||
|
import user from './pages/user';
|
||||||
|
import writeMicroblog from './Writing_Microblogs.js';
|
||||||
|
import userLine from './Userline.js';
|
||||||
|
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Router>
|
<Router>
|
||||||
|
|
||||||
|
|
||||||
<div className="app">
|
<div className="app">
|
||||||
<Route exact path="/" component={home}/>
|
<Route exact path="/" component={home}/>
|
||||||
<Route exact path="/register" component={register}/>
|
<Route exact path="/register" component={register}/>
|
||||||
<Route exact path="/login" component={login}/>
|
<Route exact path="/login" component={login}/>
|
||||||
|
<Route exact path="/user" component={user}/>
|
||||||
|
<Route exact path="/home" component={writeMicroblog}/>
|
||||||
|
<Route exact path="/userline" component={userLine}/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</Router>
|
</Router>
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import './App.css';
|
import './App.css';
|
||||||
|
|
||||||
import logo from './twistter-logo.png';
|
import logo from './images/twistter-logo.png';
|
||||||
|
|
||||||
|
|
||||||
class Home extends Component {
|
class Home extends Component {
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
|
/* eslint-disable */
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import './App.css';
|
import './App.css';
|
||||||
|
|
||||||
import logo from './twistter-logo.png';
|
import logo from './images/twistter-logo.png';
|
||||||
import TextField from '@material-ui/core/TextField';
|
import TextField from '@material-ui/core/TextField';
|
||||||
|
|
||||||
class Login extends Component {
|
class Login extends Component {
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import './App.css';
|
import './App.css';
|
||||||
|
|
||||||
import logo from './twistter-logo.png';
|
import logo from './images/twistter-logo.png';
|
||||||
import TextField from '@material-ui/core/TextField';
|
import TextField from '@material-ui/core/TextField';
|
||||||
|
|
||||||
class Register extends Component {
|
class Register extends Component {
|
||||||
|
|||||||
24
twistter-frontend/src/Userline.js
Normal file
24
twistter-frontend/src/Userline.js
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
import React, { Component } from "react";
|
||||||
|
import { BrowserRouter as Router } from 'react-router-dom';
|
||||||
|
import Route from 'react-router-dom/Route';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
|
class Userline extends Component {
|
||||||
|
|
||||||
|
constructor(props)
|
||||||
|
{
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<p>Hi</p>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Userline;
|
||||||
86
twistter-frontend/src/Writing_Microblogs.js
Normal file
86
twistter-frontend/src/Writing_Microblogs.js
Normal file
@ -0,0 +1,86 @@
|
|||||||
|
import React, { Component } from "react";
|
||||||
|
import { BrowserRouter as Router } from 'react-router-dom';
|
||||||
|
import Route from 'react-router-dom/Route';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
|
|
||||||
|
class Writing_Microblogs extends Component {
|
||||||
|
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
value: '',
|
||||||
|
title: '',
|
||||||
|
characterCount: 10
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
this.handleChange = this.handleChange.bind(this);
|
||||||
|
this.handleSubmit = this.handleSubmit.bind(this);
|
||||||
|
this.handleChangeforPost = this.handleChangeforPost.bind(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
handleChange(event) {
|
||||||
|
this.setState( {title: event.target.value });
|
||||||
|
}
|
||||||
|
|
||||||
|
handleSubmit(event) {
|
||||||
|
// alert('A title for the microblog was inputted: ' + this.state.title + '\nA microblog was posted: ' + this.state.value);
|
||||||
|
|
||||||
|
const response = axios.post(
|
||||||
|
'http://localhost:5001/twistter-e4649/us-central1/api/putPost',
|
||||||
|
{ body: this.state.value,
|
||||||
|
userHandle: "new user",
|
||||||
|
userImage: "bing-url",
|
||||||
|
microBlogTitle: this.state.title
|
||||||
|
|
||||||
|
},
|
||||||
|
{ headers: { 'Content-Type': 'application/json'} }
|
||||||
|
)
|
||||||
|
console.log(response.data);
|
||||||
|
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
|
||||||
|
handleChangeforPost(event) {
|
||||||
|
this.setState({value: event.target.value })
|
||||||
|
}
|
||||||
|
|
||||||
|
handleChangeforCharacterCount(event) {
|
||||||
|
const charCount = event.target.value.length
|
||||||
|
const charRemaining = 10 - charCount
|
||||||
|
this.setState({characterCount: charRemaining })
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<div style={{ width: "200px", height: "50px", marginTop: "180px", marginLeft: "30px" }}>
|
||||||
|
<form>
|
||||||
|
<input type="text" placeholder="Enter Microblog Title" value={this.state.title} onChange={this.handleChange} />
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{ width: "200px", marginLeft: "50px"}}>
|
||||||
|
<form onSubmit={this.handleSubmit}>
|
||||||
|
<textarea value={this.state.value} required maxLength="10" placeholder= "Write Microblog here..."
|
||||||
|
onChange = { (e) => { this.handleChangeforPost(e); this.handleChangeforCharacterCount(e) } } cols={40} rows={20} />
|
||||||
|
<div style={{ fontSize: "14px", marginRight: "-100px"}} >
|
||||||
|
<p2>Characters Left: {this.state.characterCount}</p2>
|
||||||
|
</div>
|
||||||
|
<div style={{ marginRight: "-100px" }}>
|
||||||
|
<button onClick>Share Post</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Writing_Microblogs;
|
||||||
31
twistter-frontend/src/components/layout/NavBar.js
Normal file
31
twistter-frontend/src/components/layout/NavBar.js
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
/* eslint-disable */
|
||||||
|
import React, { Component } from 'react';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
import AppBar from '@material-ui/core/AppBar';
|
||||||
|
import ToolBar from '@material-ui/core/Toolbar';
|
||||||
|
import Button from '@material-ui/core/Button';
|
||||||
|
|
||||||
|
export class Navbar extends Component {
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<AppBar>
|
||||||
|
<ToolBar>
|
||||||
|
<Button component={ Link } to='/user'>
|
||||||
|
User
|
||||||
|
</Button>
|
||||||
|
<Button component={ Link } to='/login'>
|
||||||
|
Login
|
||||||
|
</Button>
|
||||||
|
<Button component={ Link } to='/register'>
|
||||||
|
Register
|
||||||
|
</Button>
|
||||||
|
<Button component={ Link } to='/'>
|
||||||
|
Home
|
||||||
|
</Button>
|
||||||
|
</ToolBar>
|
||||||
|
</AppBar>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Navbar;
|
||||||
52
twistter-frontend/src/components/topic/ChipsArray.js
Normal file
52
twistter-frontend/src/components/topic/ChipsArray.js
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { makeStyles } from '@material-ui/core/styles';
|
||||||
|
import Chip from '@material-ui/core/Chip';
|
||||||
|
import Paper from '@material-ui/core/Paper';
|
||||||
|
|
||||||
|
const useStyles = makeStyles(theme => ({
|
||||||
|
root: {
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
flexWrap: 'wrap',
|
||||||
|
padding: theme.spacing(0.5),
|
||||||
|
},
|
||||||
|
chip: {
|
||||||
|
margin: theme.spacing(0.5),
|
||||||
|
},
|
||||||
|
}));
|
||||||
|
|
||||||
|
export default function ChipsArray() {
|
||||||
|
const classes = useStyles();
|
||||||
|
const [chipData, setChipData] = React.useState([
|
||||||
|
{ key: 0, label: 'Angular' },
|
||||||
|
{ key: 1, label: 'jQuery' },
|
||||||
|
{ key: 2, label: 'Polymer' },
|
||||||
|
{ key: 3, label: 'React' },
|
||||||
|
{ key: 4, label: 'Vue.js' },
|
||||||
|
]);
|
||||||
|
|
||||||
|
const handleDelete = chipToDelete => () => {
|
||||||
|
if (chipToDelete.label === 'React') {
|
||||||
|
alert('Why would you want to delete React?! :)');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
setChipData(chips => chips.filter(chip => chip.key !== chipToDelete.key));
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Paper className={classes.root}>
|
||||||
|
{chipData.map(data => {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Chip
|
||||||
|
key={data.key}
|
||||||
|
label={data.label}
|
||||||
|
onDelete={handleDelete(data)}
|
||||||
|
className={classes.chip}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Paper>
|
||||||
|
);
|
||||||
|
}
|
||||||
BIN
twistter-frontend/src/images/no-img.png
Normal file
BIN
twistter-frontend/src/images/no-img.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 60 KiB After Width: | Height: | Size: 60 KiB |
40
twistter-frontend/src/pages/user.js
Normal file
40
twistter-frontend/src/pages/user.js
Normal file
@ -0,0 +1,40 @@
|
|||||||
|
/* eslint-disable */
|
||||||
|
import React, { Component } from 'react';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import StaticProfile from '../components/profile/StaticProfile';
|
||||||
|
import Grid from '@material-ui/core/Grid';
|
||||||
|
|
||||||
|
import PostSkeleton from '../util/PostSkeleton';
|
||||||
|
|
||||||
|
import { connect } from 'react-redux';
|
||||||
|
|
||||||
|
|
||||||
|
class user extends Component {
|
||||||
|
render() {
|
||||||
|
const postMarkup = PostSkeleton;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<b>User page</b>
|
||||||
|
// <Grid container spacing={16}>
|
||||||
|
// <Grid item sm={8} xs={12}>
|
||||||
|
// <b>postMarkup</b>
|
||||||
|
// {postMarkup}
|
||||||
|
// </Grid>
|
||||||
|
// {/* <Grid item sm={4} xs={12}>
|
||||||
|
// <StaticProfile profile={this.state.profile} />
|
||||||
|
// </Grid> */}
|
||||||
|
// </Grid>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
user.propTypes = {
|
||||||
|
// getUserData: PropTypes.func.isRequired,
|
||||||
|
//data: PropTypes.object.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
const mapStateToProps = (state) => ({
|
||||||
|
data: state.data
|
||||||
|
});
|
||||||
|
|
||||||
|
export default connect(user);
|
||||||
77
twistter-frontend/src/util/PostSkeleton.js
Normal file
77
twistter-frontend/src/util/PostSkeleton.js
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
/* eslint-disable */
|
||||||
|
import React, { Fragment } from 'react';
|
||||||
|
import NoImg from '../images/no-img.png';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
// MUI
|
||||||
|
import Card from '@material-ui/core/Card';
|
||||||
|
import CardMedia from '@material-ui/core/CardMedia';
|
||||||
|
import CardContent from '@material-ui/core/CardContent';
|
||||||
|
|
||||||
|
import withStyles from '@material-ui/core/styles/withStyles';
|
||||||
|
|
||||||
|
const styles = (theme) => ({
|
||||||
|
...theme,
|
||||||
|
card: {
|
||||||
|
display: 'flex',
|
||||||
|
marginBottom: 20
|
||||||
|
},
|
||||||
|
cardContent: {
|
||||||
|
width: '100%',
|
||||||
|
flexDirection: 'column',
|
||||||
|
padding: 25
|
||||||
|
},
|
||||||
|
cover: {
|
||||||
|
minWidth: 200,
|
||||||
|
objectFit: 'cover'
|
||||||
|
},
|
||||||
|
handle: {
|
||||||
|
width: 60,
|
||||||
|
height: 18,
|
||||||
|
backgroundColor: theme.palette.primary.main,
|
||||||
|
marginBottom: 7
|
||||||
|
},
|
||||||
|
date: {
|
||||||
|
height: 14,
|
||||||
|
width: 100,
|
||||||
|
backgroundColor: 'rgba(0,0,0, 0.3)',
|
||||||
|
marginBottom: 10
|
||||||
|
},
|
||||||
|
fullLine: {
|
||||||
|
height: 15,
|
||||||
|
width: '90%',
|
||||||
|
backgroundColor: 'rgba(0,0,0, 0.6)',
|
||||||
|
marginBottom: 10
|
||||||
|
},
|
||||||
|
halfLine: {
|
||||||
|
height: 15,
|
||||||
|
width: '50%',
|
||||||
|
backgroundColor: 'rgba(0,0,0, 0.6)',
|
||||||
|
marginBottom: 10
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const PostSkeleton = (props) => {
|
||||||
|
const { classes } = props;
|
||||||
|
|
||||||
|
const content = Array.from({ length: 5 }).map((item, index) => (
|
||||||
|
<Card className={classes.card} key={index}>
|
||||||
|
<CardMedia className={classes.cover} image={NoImg} />
|
||||||
|
<CardContent className={classes.cardContent}>
|
||||||
|
<div className={classes.handle} />
|
||||||
|
<div className={classes.date} />
|
||||||
|
<div className={classes.fullLine} />
|
||||||
|
<div className={classes.fullLine} />
|
||||||
|
<div className={classes.halfLine} />
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
));
|
||||||
|
|
||||||
|
return <Fragment>{content}</Fragment>;
|
||||||
|
};
|
||||||
|
|
||||||
|
PostSkeleton.propTypes = {
|
||||||
|
classes: PropTypes.object.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
export default withStyles(styles)(PostSkeleton);
|
||||||
|
|
||||||
64
twistter-frontend/src/util/ProfileSkeleton.js
Normal file
64
twistter-frontend/src/util/ProfileSkeleton.js
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import withStyles from '@material-ui/core/styles/withStyles';
|
||||||
|
import NoImg from '../images/no-img.png';
|
||||||
|
// MUI
|
||||||
|
import Paper from '@material-ui/core/Paper';
|
||||||
|
// Icons
|
||||||
|
import LocationOn from '@material-ui/icons/LocationOn';
|
||||||
|
import LinkIcon from '@material-ui/icons/Link';
|
||||||
|
import CalendarToday from '@material-ui/icons/CalendarToday';
|
||||||
|
|
||||||
|
const styles = (theme) => ({
|
||||||
|
...theme,
|
||||||
|
handle: {
|
||||||
|
height: 20,
|
||||||
|
backgroundColor: theme.palette.primary.main,
|
||||||
|
width: 60,
|
||||||
|
margin: '0 auto 7px auto'
|
||||||
|
},
|
||||||
|
fullLine: {
|
||||||
|
height: 15,
|
||||||
|
backgroundColor: 'rgba(0,0,0,0.6)',
|
||||||
|
width: '100%',
|
||||||
|
marginBottom: 10
|
||||||
|
},
|
||||||
|
halfLine: {
|
||||||
|
height: 15,
|
||||||
|
backgroundColor: 'rgba(0,0,0,0.6)',
|
||||||
|
width: '50%',
|
||||||
|
marginBottom: 10
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const ProfileSkeleton = (props) => {
|
||||||
|
const { classes } = props;
|
||||||
|
return (
|
||||||
|
<Paper className={classes.paper}>
|
||||||
|
<div className={classes.profile}>
|
||||||
|
<div className="image-wrapper">
|
||||||
|
<img src={NoImg} alt="profile" className="profile-image" />
|
||||||
|
</div>
|
||||||
|
<hr />
|
||||||
|
<div className="profile-details">
|
||||||
|
<div className={classes.handle} />
|
||||||
|
<hr />
|
||||||
|
<div className={classes.fullLine} />
|
||||||
|
<div className={classes.fullLine} />
|
||||||
|
<hr />
|
||||||
|
<LocationOn color="primary" /> <span>Location</span>
|
||||||
|
<hr />
|
||||||
|
<LinkIcon color="primary" /> https://website.com
|
||||||
|
<hr />
|
||||||
|
<CalendarToday color="primary" /> Joined date
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Paper>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
ProfileSkeleton.propTypes = {
|
||||||
|
classes: PropTypes.object.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
export default withStyles(styles)(ProfileSkeleton);
|
||||||
Loading…
Reference in New Issue
Block a user