Final Fixes

This commit is contained in:
2024-03-27 18:24:55 +00:00
parent a2ae2b2bea
commit ced20c16c5
2 changed files with 38 additions and 27 deletions
+12 -10
View File
@@ -6,7 +6,7 @@ import { ref, onValue, set, remove, get } from "firebase/database";
import { useBeforeunload } from "react-beforeunload";
import {Marker} from "pigeon-maps";
import {onAuthStateChanged} from "firebase/auth"
import { useSearchParams } from 'next/navigation'
// Refactored Component Imports
// Data Structure Imports
@@ -47,15 +47,17 @@ function Home() {
const [user, setUser] = useState(null)
const [usingSearchParams, setUsingSearchParams] = useState(true)
const searchParams = useSearchParams()
var roomSwitch = null
if (searchParams.has("room") && usingSearchParams && user) {
roomSwitch = searchParams.get("room")
setUsingSearchParams(false)
get(ref(database, `rooms/${searchParams.get("room")}`)).then((snapshot) => {
selectChatRoom(snapshot.val())
});
}
useEffect(() => {
const searchParams = new URLSearchParams(document.location.search);
var roomSwitch = null
if (searchParams.has("room") && usingSearchParams && user) {
roomSwitch = searchParams.get("room")
setUsingSearchParams(false)
get(ref(database, `rooms/${searchParams.get("room")}`)).then((snapshot) => {
selectChatRoom(snapshot.val())
});
}
}, [user])
// Authentication
useEffect(() => {
+26 -17
View File
@@ -4,7 +4,6 @@ import { useState, useEffect } from "react";
import { auth, database, storage } from "../../../../firebase-config";
import { ref, onValue, get, update } from "firebase/database";
import { ref as sRef, getDownloadURL } from "firebase/storage";
import {Marker} from "pigeon-maps";
import {onAuthStateChanged} from "firebase/auth"
import { useForm, Form } from "react-hook-form";
@@ -28,7 +27,7 @@ function Home({ params }) {
const [isOwner, setOwn] = useState(false)
const [isEditing, setEdit] = useState(false)
var { register, control, setError, handleSubmit, formState: { errors, isSubmitting, isSubmitted } } = useForm()
var { register, control} = useForm()
// Authentication
useEffect(() => {
@@ -79,11 +78,10 @@ function Home({ params }) {
},[]);
function save({data}) {
if (data.pfp) {
if (data.pfp[0]) {
// image stuff
uploadBytes(sRef(storage, `users/${user.uid}/pfp`), data.pfp[0]).then(() => {
getDownloadURL(sRef(storage, `users/${user.uid}/pfp`)).then((url) => {
console.log(url)
data.pfp = url
for (var key in data) {
if (data[key] == "") {
@@ -95,6 +93,15 @@ function Home({ params }) {
update(ref(database, `users/${user.uid}`), data)
})
})
} else {
for (var key in data) {
if (data[key] == "") {
data[key] = profileData[key]
}
}
data.pfp = profileData.pfp
setEdit(false)
update(ref(database, `users/${user.uid}`), data)
}
}
@@ -131,34 +138,36 @@ function Home({ params }) {
<div>
<Form onSubmit={save} encType={'application/json'} control={control}>
<div className="grid grid-cols-2">
<div className="col-span-1">
<div>
<img src={profileData.pfp} width="150px" className="relative mx-auto rounded-2xl overflow-hidden"/>
Current Profile Picture
</div>
<div className="col-span-1">
<input type="file" {...register("pfp")} className="w-[300px] relative left-[-30px] top-[50px]"/>
<div className="flex content-center">
<input type="file" {...register("pfp")} className="w-[80%]" accept=".jpg,.png,.jpeg"/>
</div>
<div className="col-span-1 pt-5">
</div>
<div className="grid grid-cols-2 pl-2 w-[90%]">
<div className="pt-5">
<div className="font-bold">First Name</div>
<input className="border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("firstName")} placeholder={profileData.firstName}/>
<input className="w-[80%] border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("firstName")} placeholder={profileData.firstName}/>
</div>
<div className="col-span-1 pt-5">
<div className="pt-5">
<div className="font-bold">Last Name</div>
<input className="border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("lastName")} placeholder={profileData.lastName}/>
<input className="w-[80%] border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("lastName")} placeholder={profileData.lastName}/>
</div>
<div className="col-span-1 pt-5">
<div className="pt-5">
<div className="font-bold">Username</div>
<input className="border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("username")} placeholder={profileData.username}/>
<input className="w-[80%] border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("username")} placeholder={profileData.username}/>
</div>
<div className="col-span-1 pt-5">
<div className="pt-5">
<div className="font-bold">Interests (Comma Seperated)</div>
<input className="border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("interests")} placeholder={profileData.interests}/>
<input className="w-[80%] border-2 border-gray-300 p-2 rounded-lg" type="text" {...register("interests")} placeholder={profileData.interests}/>
</div>
<div className="col-span-2 pt-5">
<div className="pt-5 col-span-2">
<div className="font-bold">Bio</div>
<textarea className="w-[92%] border-2 border-gray-300 p-2 rounded-lg" {...register("bio")} type="text" placeholder={profileData.bio}/>
</div>
<div className="col-span-2 justify-items-center pt-5">
<div className="justify-items-center pt-5 col-span-2">
<button type="submit" className="p-2 cursor-pointer bg-[#dee0e0] bg-cyan-500 text-white font-bold rounded-full text-center"> Save Changes </button>
</div>
</div>