diff --git a/src/App.jsx b/src/App.jsx index 00c21c349..a1a405c98 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -21,8 +21,8 @@ const SignupScreen = React.lazy(() => import("./pages/Signup")); const ForgotPassword = React.lazy(() => import("./pages/ForgotPassword")); const Friends = React.lazy(() => import("./pages/Friends")); const NotFound = React.lazy(() => import("./pages/NotFound")); -const Contributors = React.lazy( - () => import("./pages/FooterPages/ContributorPage"), +const Contributors = React.lazy(() => + import("./pages/FooterPages/ContributorPage"), ); const HelpCenter = React.lazy(() => import("./pages/FooterPages/HelpCenter")); // ------------------------------------- Components ------------------------------------------------ diff --git a/src/assets/sounds/index.js b/src/assets/sounds/index.js index ac41fbc89..db08c1724 100644 --- a/src/assets/sounds/index.js +++ b/src/assets/sounds/index.js @@ -4,4 +4,4 @@ import lightOffSound from "./lightOff.mp3"; import lightOnSound from "./lightOn.mp3"; import successSound from "./success.mp3"; -export {backBtnSound, errorSound, lightOffSound, lightOnSound, successSound}; +export { backBtnSound, errorSound, lightOffSound, lightOnSound, successSound }; diff --git a/src/components/SettingsComponents/index.js b/src/components/SettingsComponents/index.js index 84406e755..1c7354cf6 100644 --- a/src/components/SettingsComponents/index.js +++ b/src/components/SettingsComponents/index.js @@ -2,4 +2,4 @@ import DeleteAccount from "./DeleteAccount"; import SettingsSidebar from "./Sidebar"; import SoundSetting from "./Sounds"; -export {DeleteAccount, SettingsSidebar, SoundSetting}; +export { DeleteAccount, SettingsSidebar, SoundSetting }; diff --git a/src/components/postView/index.jsx b/src/components/postView/index.jsx index b81390199..7f182ee43 100644 --- a/src/components/postView/index.jsx +++ b/src/components/postView/index.jsx @@ -20,8 +20,8 @@ import firebase from "firebase/compat/app"; import useCreatedAt from "../../hooks/useCreatedAt.jsx"; import { useNavigate } from "react-router-dom"; -const ImageSlider = React.lazy( - () => import("../../reusableComponents/ImageSlider"), +const ImageSlider = React.lazy(() => + import("../../reusableComponents/ImageSlider"), ); const PostDetails = React.lazy(() => import("./PostDetails.jsx")); diff --git a/src/js/deleteImg.js b/src/js/deleteImg.js index c68cf6f70..4b89bee1a 100644 --- a/src/js/deleteImg.js +++ b/src/js/deleteImg.js @@ -1,4 +1,4 @@ -import {storage} from "../lib/firebase"; +import { storage } from "../lib/firebase"; export default async function deleteImg(imageUrl) { if (imageUrl && imageUrl !== "") { diff --git a/src/js/postFn.js b/src/js/postFn.js index f28166cc1..bd94f4eed 100644 --- a/src/js/postFn.js +++ b/src/js/postFn.js @@ -1,47 +1,47 @@ import firebase from "firebase/compat/app"; -import {db, storage} from "../lib/firebase"; +import { db, storage } from "../lib/firebase"; -import {playErrorSound, playSuccessSound} from "./sounds"; +import { playErrorSound, playSuccessSound } from "./sounds"; export const deletePost = async ( - uid, - postId, - imageUrl, - enqueueSnackbar, - setOpen, - ) => { + uid, + postId, + imageUrl, + enqueueSnackbar, + setOpen, +) => { try { await db - .runTransaction(async (transaction) => { - // Delete doc ref from user doc - const docRef = db.collection("users").doc(uid); - transaction.update(docRef, { - posts : firebase.firestore.FieldValue.arrayRemove(postId), - }); - - // Delete the post document - const postRef = db.collection("posts").doc(postId); - transaction.delete(postRef); - }) - .then(async () => { - if (imageUrl !== "") { - const url = JSON.parse(imageUrl); - const deleteImagePromises = url.map(({imageUrl}) => { - const imageRef = storage.refFromURL(imageUrl); - return imageRef.delete(); - }); - await Promise.all(deleteImagePromises); - } - }) - .then(() => { - playSuccessSound(); - enqueueSnackbar("Post deleted successfully!", {variant : "success"}); - setOpen(false); + .runTransaction(async (transaction) => { + // Delete doc ref from user doc + const docRef = db.collection("users").doc(uid); + transaction.update(docRef, { + posts: firebase.firestore.FieldValue.arrayRemove(postId), }); + + // Delete the post document + const postRef = db.collection("posts").doc(postId); + transaction.delete(postRef); + }) + .then(async () => { + if (imageUrl !== "") { + const url = JSON.parse(imageUrl); + const deleteImagePromises = url.map(({ imageUrl }) => { + const imageRef = storage.refFromURL(imageUrl); + return imageRef.delete(); + }); + await Promise.all(deleteImagePromises); + } + }) + .then(() => { + playSuccessSound(); + enqueueSnackbar("Post deleted successfully!", { variant: "success" }); + setOpen(false); + }); } catch (error) { playErrorSound(); - enqueueSnackbar(`Error deleting post: ${error}`, {variant : "error"}); + enqueueSnackbar(`Error deleting post: ${error}`, { variant: "error" }); } }; @@ -61,19 +61,20 @@ export const savePost = async (postId) => { export const deleteComment = async (postId, commentId, enqueueSnackbar) => { try { - await db.collection("posts") - .doc(postId) - .collection("comments") - .doc(commentId) - .delete() - .then(() => { - playSuccessSound(); - enqueueSnackbar("Comment deleted successfully!", { - variant : "success", - }); + await db + .collection("posts") + .doc(postId) + .collection("comments") + .doc(commentId) + .delete() + .then(() => { + playSuccessSound(); + enqueueSnackbar("Comment deleted successfully!", { + variant: "success", }); + }); } catch (error) { playErrorSound(); - enqueueSnackbar(`Error deleting comment: ${error}`, {variant : "error"}); + enqueueSnackbar(`Error deleting comment: ${error}`, { variant: "error" }); } }; diff --git a/src/js/signIn.js b/src/js/signIn.js index ae9769574..e3a5e29fe 100644 --- a/src/js/signIn.js +++ b/src/js/signIn.js @@ -1,51 +1,51 @@ -import {auth, db, facebookProvider, googleProvider} from "../lib/firebase"; +import { auth, db, facebookProvider, googleProvider } from "../lib/firebase"; -import {playErrorSound, playSuccessSound} from "./sounds"; +import { playErrorSound, playSuccessSound } from "./sounds"; const signInWithOAuth = (e, enqueueSnackbar, navigate, google = true) => { e.preventDefault(); const provider = google ? googleProvider : facebookProvider; - auth.signInWithPopup(provider) - .then(async (val) => { - const userRef = - db.collection("users").where("uid", "==", val?.user?.uid); + auth + .signInWithPopup(provider) + .then(async (val) => { + const userRef = db.collection("users").where("uid", "==", val?.user?.uid); - const docSnap = await userRef.get(); - if (docSnap.docs.length < 1) { - const usernameDoc = db.collection("users"); - await usernameDoc.doc(auth.currentUser.uid).set({ - uid : val.user.uid, - username : val.user.uid, - name : val.user.displayName, - photoURL : val.user.photoURL, - displayName : val.user.displayName, - Friends : [], - posts : [], - }); - } else if (!docSnap.docs[0].data().username) { - docSnap.docs[0].ref.update({ - username : doc.data().uid, - }); - } - playSuccessSound(); - enqueueSnackbar("Login successful!", { - variant : "success", + const docSnap = await userRef.get(); + if (docSnap.docs.length < 1) { + const usernameDoc = db.collection("users"); + await usernameDoc.doc(auth.currentUser.uid).set({ + uid: val.user.uid, + username: val.user.uid, + name: val.user.displayName, + photoURL: val.user.photoURL, + displayName: val.user.displayName, + Friends: [], + posts: [], }); - navigate("/"); - }) - .catch((error) => { - if (error.code === "auth/account-exists-with-different-credential") { - playErrorSound(); - enqueueSnackbar("Account exists with a different credential", { - variant : "error", - }); - } else { - playErrorSound(); - enqueueSnackbar(error.message, { - variant : "error", - }); - } + } else if (!docSnap.docs[0].data().username) { + docSnap.docs[0].ref.update({ + username: doc.data().uid, + }); + } + playSuccessSound(); + enqueueSnackbar("Login successful!", { + variant: "success", }); + navigate("/"); + }) + .catch((error) => { + if (error.code === "auth/account-exists-with-different-credential") { + playErrorSound(); + enqueueSnackbar("Account exists with a different credential", { + variant: "error", + }); + } else { + playErrorSound(); + enqueueSnackbar(error.message, { + variant: "error", + }); + } + }); }; export default signInWithOAuth; diff --git a/src/js/userData.js b/src/js/userData.js index d21f85124..bd50ae698 100644 --- a/src/js/userData.js +++ b/src/js/userData.js @@ -1,4 +1,4 @@ -import {auth, db} from "../lib/firebase"; +import { auth, db } from "../lib/firebase"; export default async function getUserSessionData(getRef) { const user = auth?.currentUser; diff --git a/src/lib/firebase.js b/src/lib/firebase.js index b16794b66..ea6a47f95 100644 --- a/src/lib/firebase.js +++ b/src/lib/firebase.js @@ -3,15 +3,15 @@ import "firebase/compat/firestore"; import "firebase/compat/storage"; import firebase from "firebase/compat/app"; -import {v4 as uuid} from "uuid"; +import { v4 as uuid } from "uuid"; const firebaseApp = firebase.initializeApp({ - apiKey : import.meta.env.VITE_DUMMYGRAM_APIKEY, - authDomain : import.meta.env.VITE_DUMMYGRAM_AUTHDOMAIN, - projectId : import.meta.env.VITE_DUMMYGRAM_PROJECTID, - storageBucket : import.meta.env.VITE_DUMMYGRAM_STORAGEBUCKET, - messagingSenderId : import.meta.env.VITE_DUMMYGRAM_MESSAGINGSENDERID, - appId : import.meta.env.VITE_DUMMYGRAM_APPID, + apiKey: import.meta.env.VITE_DUMMYGRAM_APIKEY, + authDomain: import.meta.env.VITE_DUMMYGRAM_AUTHDOMAIN, + projectId: import.meta.env.VITE_DUMMYGRAM_PROJECTID, + storageBucket: import.meta.env.VITE_DUMMYGRAM_STORAGEBUCKET, + messagingSenderId: import.meta.env.VITE_DUMMYGRAM_MESSAGINGSENDERID, + appId: import.meta.env.VITE_DUMMYGRAM_APPID, }); // Use these for db & auth @@ -30,16 +30,16 @@ const storage = firebase.storage(); function handleMultiUpload(files, options = {}) { const _options = Object.assign( - { - storageLocation : "images", - /** - * - * @param {number} _percentage - */ - onUploadProgress : (_percentage) => {}, - generateThumbnails : false, - }, - options, + { + storageLocation: "images", + /** + * + * @param {number} _percentage + */ + onUploadProgress: (_percentage) => {}, + generateThumbnails: false, + }, + options, ); let totalSize = 0; @@ -48,8 +48,9 @@ function handleMultiUpload(files, options = {}) { const uploadPromises = files.map((file) => { const fileName = uuid() + "." + file.name.split(".").pop(); return new Promise((resolve, reject) => { - const task = - storage.ref(`${_options.storageLocation}/${fileName}`).put(file); + const task = storage + .ref(`${_options.storageLocation}/${fileName}`) + .put(file); /** @type {null|number} */ let currUploadTotalSize = null; @@ -57,85 +58,93 @@ function handleMultiUpload(files, options = {}) { let lastUploadedSize = null; task.on( - "state_changed", - (snapshot) => { - if (currUploadTotalSize === null) { - totalSize += snapshot.totalBytes; - currUploadTotalSize = snapshot.totalBytes; - } - - totalUploaded -= lastUploadedSize ?? 0; - totalUploaded += snapshot.bytesTransferred; - - lastUploadedSize = snapshot.bytesTransferred; - - _options.onUploadProgress( - Math.round((totalUploaded / totalSize) * 100), - ); - }, - (error) => { - if (currUploadTotalSize !== null) { - totalSize -= currUploadTotalSize; - } - - if (lastUploadedSize !== null) { - totalUploaded -= lastUploadedSize; - } - - reject(error); - }, - () => { - storage.ref(_options.storageLocation) - .child(fileName) - .getDownloadURL() - .then((url) => { - if (_options.generateThumbnails) { - const thumbnailScale = 1 / 10; - - const image = new Image(); - image.src = URL.createObjectURL(file); - - image.addEventListener("load", () => { - const canvas = document.createElement("canvas"); - canvas.width = image.naturalWidth * thumbnailScale; - canvas.height = image.naturalHeight * thumbnailScale; - - canvas.getContext("2d").drawImage( - image, 0, 0, canvas.width, canvas.height); - - resolve({ - thumbnail : canvas.toDataURL(), - imageWidth : image.naturalWidth, - imageHeight : image.naturalHeight, - imageUrl : url, - }); - }); - - image.addEventListener("error", () => { - resolve({ - imageUrl : url, - thumbnail : null, - imageWidth : 0, - imageHeight : 0, - }); - }); - } else { - resolve(url); - } - }) - .catch((error) => { reject(error); }); - }, + "state_changed", + (snapshot) => { + if (currUploadTotalSize === null) { + totalSize += snapshot.totalBytes; + currUploadTotalSize = snapshot.totalBytes; + } + + totalUploaded -= lastUploadedSize ?? 0; + totalUploaded += snapshot.bytesTransferred; + + lastUploadedSize = snapshot.bytesTransferred; + + _options.onUploadProgress( + Math.round((totalUploaded / totalSize) * 100), + ); + }, + (error) => { + if (currUploadTotalSize !== null) { + totalSize -= currUploadTotalSize; + } + + if (lastUploadedSize !== null) { + totalUploaded -= lastUploadedSize; + } + + reject(error); + }, + () => { + storage + .ref(_options.storageLocation) + .child(fileName) + .getDownloadURL() + .then((url) => { + if (_options.generateThumbnails) { + const thumbnailScale = 1 / 10; + + const image = new Image(); + image.src = URL.createObjectURL(file); + + image.addEventListener("load", () => { + const canvas = document.createElement("canvas"); + canvas.width = image.naturalWidth * thumbnailScale; + canvas.height = image.naturalHeight * thumbnailScale; + + canvas + .getContext("2d") + .drawImage(image, 0, 0, canvas.width, canvas.height); + + resolve({ + thumbnail: canvas.toDataURL(), + imageWidth: image.naturalWidth, + imageHeight: image.naturalHeight, + imageUrl: url, + }); + }); + + image.addEventListener("error", () => { + resolve({ + imageUrl: url, + thumbnail: null, + imageWidth: 0, + imageHeight: 0, + }); + }); + } else { + resolve(url); + } + }) + .catch((error) => { + reject(error); + }); + }, ); }); }); return new Promise((resolve, reject) => { Promise.all(uploadPromises) - .then((uploads) => { resolve(uploads); }) - .catch((error) => { reject(error); }); + .then((uploads) => { + resolve(uploads); + }) + .catch((error) => { + reject(error); + }); }); } -export {db, auth, storage, handleMultiUpload}; +export { db, auth, storage, handleMultiUpload }; export const googleProvider = new firebase.auth.GoogleAuthProvider(); export const facebookProvider = new firebase.auth.FacebookAuthProvider(); diff --git a/src/pages/Home/index.jsx b/src/pages/Home/index.jsx index 8b59cdcb5..c76d68f11 100644 --- a/src/pages/Home/index.jsx +++ b/src/pages/Home/index.jsx @@ -5,8 +5,8 @@ import { db } from "../../lib/firebase"; const Post = React.lazy(() => import("../../components/Post")); const Suggestion = React.lazy(() => import("../../components/Suggestions")); -const GuestSignUpBtn = React.lazy( - () => import("../../components/Guest/GuestSignUpBtn"), +const GuestSignUpBtn = React.lazy(() => + import("../../components/Guest/GuestSignUpBtn"), ); const PAGESIZE = 10; diff --git a/src/pages/Profile/feed/index.jsx b/src/pages/Profile/feed/index.jsx index 28bb7981c..95101a230 100644 --- a/src/pages/Profile/feed/index.jsx +++ b/src/pages/Profile/feed/index.jsx @@ -100,8 +100,8 @@ function FeedPostDisplay({ post, id }) { isMobileScreen ? MAX_CAPTION_MOBILE : isTabScreen - ? MAX_CAPTION_TAB - : undefined + ? MAX_CAPTION_TAB + : undefined } /> ) : ( diff --git a/src/pages/Profile/index.jsx b/src/pages/Profile/index.jsx index cd69856e6..97d9cc949 100644 --- a/src/pages/Profile/index.jsx +++ b/src/pages/Profile/index.jsx @@ -574,8 +574,8 @@ function Profile() { user.isAnonymous ? navigate("/signup") : isFriendAlready - ? handleRemoveFriend() - : handleSendFriendRequest() + ? handleRemoveFriend() + : handleSendFriendRequest() } variant="contained" color="primary" @@ -588,8 +588,8 @@ function Profile() { {isFriendAlready ? "Remove Friend" : friendRequestSent - ? "Remove friend request" - : "Add Friend"} + ? "Remove friend request" + : "Add Friend"} )} diff --git a/src/reusableComponents/validation.js b/src/reusableComponents/validation.js index 9a5b2bc28..59bc91522 100644 --- a/src/reusableComponents/validation.js +++ b/src/reusableComponents/validation.js @@ -2,52 +2,56 @@ const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*[@$%#^&*])(?=.*[0-9]).{8,}$/; const emailRegex = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i; const validate = { - name : (value) => { - if (!value) - return {name : true, nameError : "Name field cannot be empty"}; + name: (value) => { + if (!value) return { name: true, nameError: "Name field cannot be empty" }; else { - return value.length < 6 ? { - name : true, - nameError : "Name must be atleast 6 characters long.", - } - : {name : false, nameError : false}; + return value.length < 6 + ? { + name: true, + nameError: "Name must be atleast 6 characters long.", + } + : { name: false, nameError: false }; } }, - email : (value) => { - return emailRegex.test(value) ? {email : false, emailError : false} : { - email : true, - emailError : "Please enter a valid email address", - }; + email: (value) => { + return emailRegex.test(value) + ? { email: false, emailError: false } + : { + email: true, + emailError: "Please enter a valid email address", + }; }, - password : (value) => { - return passwordRegex.test(value) ? {password : false, passwordError : false} : { - password : true, - passwordError : - "Minimum 8 characters, 1 uppercase, 1 lowercase, 1 symbol (@$%#^&*), 1 number (0-9).", - }; + password: (value) => { + return passwordRegex.test(value) + ? { password: false, passwordError: false } + : { + password: true, + passwordError: + "Minimum 8 characters, 1 uppercase, 1 lowercase, 1 symbol (@$%#^&*), 1 number (0-9).", + }; }, - confirmPassword : (value, password) => { + confirmPassword: (value, password) => { return passwordRegex.test(value) - ? value !== password - ? { - confirmPassword : true, - confirmPasswordError : "Password does not match", - } - : {confirmPassword : false, confirmPasswordError : false} - : { - confirmPassword : true, - confirmPasswordError : - "Minimum 8 characters, 1 uppercase, 1 lowercase, 1 symbol (@$%#^&*), 1 number (0-9).", - }; + ? value !== password + ? { + confirmPassword: true, + confirmPasswordError: "Password does not match", + } + : { confirmPassword: false, confirmPasswordError: false } + : { + confirmPassword: true, + confirmPasswordError: + "Minimum 8 characters, 1 uppercase, 1 lowercase, 1 symbol (@$%#^&*), 1 number (0-9).", + }; }, - initialValue : { - name : true, - email : true, - password : true, - confirmPassword : true, + initialValue: { + name: true, + email: true, + password: true, + confirmPassword: true, }, }; diff --git a/vite.config.js b/vite.config.js index d84607c09..1660e1143 100644 --- a/vite.config.js +++ b/vite.config.js @@ -1,8 +1,8 @@ import react from "@vitejs/plugin-react"; -import {defineConfig} from "vite"; +import { defineConfig } from "vite"; // https://vitejs.dev/config/ export default defineConfig({ - base : "/dummygram", - plugins : [ react() ], + base: "/dummygram", + plugins: [react()], });