- {/* Header */}
-
-
);
}
-export default Home;
+export default Home;
\ No newline at end of file
diff --git a/frontend-next/src/app/login/page.js b/frontend-next/src/app/login/page.js
index 96f2a1a..a544c89 100644
--- a/frontend-next/src/app/login/page.js
+++ b/frontend-next/src/app/login/page.js
@@ -3,10 +3,32 @@ import { useForm, Form } from "react-hook-form";
import { useRouter } from "next/navigation";
import "../globals.css"
+// Firebase imports
+import {auth} from "../api/firebase-config";
+import { setPersistence, signInWithEmailAndPassword, browserSessionPersistence } from "firebase/auth";
+
function Login() {
var router = useRouter();
//var { register, handleSubmit } = useForm();
- var { register, control, setError, formState: { errors, isSubmitting, isSubmitted } } = useForm()
+ var { register, control, setError, handleSubmit, formState: { errors, isSubmitting, isSubmitted } } = useForm()
+
+ function authenticate(data) {
+ setPersistence(auth, browserSessionPersistence)
+ .then(() => {
+ signInWithEmailAndPassword(auth,data.email,data.password)
+ .then((userCredential) => {
+ if (userCredential.user) {
+ router.push("/app")
+ } else {
+ const formError = { type: "server", message: "Username or Password Incorrect" }
+ // set same error in both:
+ setError('password', formError)
+ setError('email', formError)
+ }
+ })
+ })
+ }
+
return (
-
- 
-
+
+
-
+
+ {isAuthenticated && (
+
- {/* Sidebar (Right Side of Page) */}
- {mainTab == "home" && (
-
+ {/* Left Side of Page */}
+
- {/* Main Page Section */}
-
+ {/* Header */}
+
+ {/* Main Page Section */}
+
-
+ {mainTab == "home" && !loadingLoc && (
+
+ )}
+ {mainTab == "home" && loadingLoc && (
+
+ )}
+ {mainTab == "chat" && }
+
- {mainTab == "chat" && isMyRoom == false && (
- {
- addToMyRooms();
- }}
- className="p-2 cursor-pointer bg-[#dee0e0] bg-cyan-500 text-white font-bold rounded-full mr-5"
- >
- Add to "My Rooms"
-
- )}
- {mainTab == "chat" && isMyRoom == true && (
- {
- removeFromMyRooms();
- }}
- className="p-2 cursor-pointer bg-[#dee0e0] bg-cyan-500 text-white font-bold rounded-full mr-5"
- >
- Remove from "My Rooms"
-
- )}
- {mainTab == "chat" && (
- {
- closeChatRoom(chatRoomObj);
- }}
- className="p-2 cursor-pointer bg-[#dee0e0] bg-cyan-500 text-white font-bold rounded-full mr-5"
- >
- Close Chat
-
- )}
-
- Sign Out
-
-
-
- {mainTab == "home" && !loadingLoc && (
-
)}
- {mainTab == "home" && loadingLoc && (
-
+ )}
+ {mainTab == "profile" && (
+
-
-
)}
- {mainTab == "chat" && (
-
-
-
- {tab == "nearby" && (
-
-
- {
- setTab("nearby");
- }}
- >
- Nearby
-
- {
- setTab("rooms");
- }}
- >
- My Rooms
-
- {
- setTab("create");
- }}
- >
- Create
-
-
-
- )}
- {tab == "rooms" && (
-
- {!nearby && !loadingNearby && (
-
-
- No Nearby Rooms
-
- Create One? -
- )}
- {loadingNearby && - Create One? -
Loading...
}
- {nearby}
-
-
- )}
- {tab == "create" && !loadingLoc &&
- {isRoomLoading &&
- Loading
}
- {!myRooms && !isRoomLoading && No User Saved Rooms
}
- {myRooms}
- Loading...
}
-
-
- )}
- {mainTab == "profile" && (
-
-
-
-
-
-
-
-
- {chatRoomObj.name}
-
-
- {chatRoomObj.description} -
- - {chatRoomObj.description} -
-
- Online Members
- {chatroomOnline}
-
-
- All Members
- {!chatroomUsersLoading && chatroomUsers}
-
-
- )}
- Profile
-
@@ -18,16 +40,7 @@ function Login() {
diff --git a/frontend-next/src/app/page.js b/frontend-next/src/app/page.js
index 57090bf..10a8bf5 100644
--- a/frontend-next/src/app/page.js
+++ b/frontend-next/src/app/page.js
@@ -1,25 +1,28 @@
"use client"
import { useState, useEffect } from 'react'
-import { app } from "./api/firebase-config";
-import { getDatabase, ref, get} from "firebase/database";
-
-var database = getDatabase(app)
+import { auth, database } from "./api/firebase-config";
+import { ref, get} from "firebase/database";
+import {onAuthStateChanged} from "firebase/auth"
function Home() {
- const [statusCode, setData] = useState(null)
- const [isLoading, setLoading] = useState(true)
const [isLoadingLoc, setLoadingLoc] = useState(true)
const [roomCount, setRoomCount] = useState(null)
- useEffect(() => {
- fetch('/api/user')
- .then((res) => res.status)
- .then((status) => {
- setData(status)
- setLoading(false)
- })
- }, [])
+ const [isAuthenticated, setAuth] = useState(false)
+ const [userID, setUserID] = useState(null)
+
+ // Authentication
+ useEffect(() => {
+ onAuthStateChanged(auth, (user) => {
+ if (user) {
+ setUserID(user.uid)
+ setAuth(true)
+ } else {
+ setAuth(false)
+ }
+ })
+ }, [])
useEffect(() => {
if('geolocation' in navigator) {
@@ -51,13 +54,13 @@ function Home() {
Chat with friends!
Login
{(errors.email && errors.password) &&Invalid Email or Password.
}
-
- {(statusCode == 203 || isLoading) &&
+ {(!isAuthenticated) &&
}
- {statusCode == 200 && }
+ {isAuthenticated && }
{(!isLoadingLoc && roomCount == 1) &&
Join others in {roomCount} room near you!
}
{(!isLoadingLoc && roomCount != 1 && roomCount != 0) && Join others in {roomCount} rooms near you!
}
{(isLoadingLoc || (roomCount == 0 && !isLoadingLoc)) && Start the conversation today!
}
diff --git a/frontend-next/src/app/register/page.js b/frontend-next/src/app/register/page.js
index 9ede784..a969cd7 100644
--- a/frontend-next/src/app/register/page.js
+++ b/frontend-next/src/app/register/page.js
@@ -4,21 +4,41 @@ import { useForm, Form } from "react-hook-form";
import "../globals.css"
import { useState } from "react";
+import { createUserWithEmailAndPassword, signInWithEmailAndPassword, setPersistence, browserSessionPersistence } from "firebase/auth";
+import {auth} from "../api/firebase-config";
+
+async function Signup(data) {
+ var userCredential = await createUserWithEmailAndPassword(auth,data.email,data.password);
+ if (userCredential.user) {
+ setPersistence(auth, browserSessionPersistence)
+ .then(() => {
+ signInWithEmailAndPassword(auth,data.email,data.password)
+ .then((res) => {
+ console.log(res)
+ return true
+ })
+ })
+
+ } else {
+ return false
+ }
+}
function Register() {
- var { register, control, setError, handleSubmit, formState: { errors } } = useForm()
var router = useRouter();
+ var { register, control, formState: { errors } } = useForm()
var emailRegex = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/
var [passwordMismatch, setPasswordMismatch] = useState(false);
-
const passwordMatch = (data) => {
return data.password === data.passwordCheck;
};
-
- const onSubmit = (data) => {
+
+ function onSubmit({data}) {
if (passwordMatch(data)) {
setPasswordMismatch(false);
- router.push("/success");
+ if (Signup(data)) {
+ router.push("/onboarding");
+ }
} else{
setPasswordMismatch(true);
@@ -36,11 +56,7 @@ function Register() {