diff --git a/backend/src/users/views.ts b/backend/src/users/views.ts
index 22fc9daa..63a26ab1 100644
--- a/backend/src/users/views.ts
+++ b/backend/src/users/views.ts
@@ -84,6 +84,32 @@ userRouter.post(
}
);
+userRouter.post(
+ "/google",
+ NoAuth as RequestHandler,
+ async (req: Request, res: Response) => {
+ // #swagger.tags = ['Users']
+ socketNotify("/users");
+ const { ...rest } = req.body;
+ try {
+ await firebase.auth().setCustomUserClaims(rest.id, {
+ admin: false,
+ supervisor: false,
+ volunteer: true,
+ });
+ const user = await userController.createUser(
+ rest,
+ rest.profile,
+ rest.preferences,
+ rest.permissions
+ );
+ return res.status(200).send({ success: true, user: user });
+ } catch (e: any) {
+ return res.status(500).send({ success: false, error: e.message });
+ }
+ }
+);
+
userRouter.delete("/:userid", useAuth, async (req: Request, res: Response) => {
// #swagger.tags = ['Users']
await admin.auth().deleteUser(req.params.userid);
diff --git a/frontend/src/components/organisms/LoginForm.tsx b/frontend/src/components/organisms/LoginForm.tsx
index d7883870..775fd879 100644
--- a/frontend/src/components/organisms/LoginForm.tsx
+++ b/frontend/src/components/organisms/LoginForm.tsx
@@ -11,6 +11,10 @@ import {
useSignInWithGoogle,
} from "react-firebase-hooks/auth";
import Snackbar from "../atoms/Snackbar";
+import { GoogleAuthProvider, User, signInWithPopup } from "firebase/auth";
+import { api } from "@/utils/api";
+import { useMutation } from "@tanstack/react-query";
+import Loading from "../molecules/Loading";
export type FormValues = {
email: string;
@@ -108,9 +112,75 @@ const LoginForm = () => {
}
}, [signInErrors]);
+ /** Tanstack query mutation to create a new user */
+ const { mutateAsync: createLocalUserFromGoogle, isPending: googleLoading } =
+ useMutation({
+ mutationFn: async (data: {
+ userid: string;
+ firstName: string;
+ lastName: string;
+ email: string;
+ phoneNumber: string;
+ }) => {
+ const { userid, firstName, lastName, email } = data;
+ const emailLowerCase = email.toLowerCase();
+ const post = {
+ id: userid,
+ email: emailLowerCase,
+ profile: {
+ firstName,
+ lastName,
+ },
+ };
+ const { response } = await api.post("/users/google", post, false);
+ if (!response.ok) {
+ const errorData = await response.json();
+ throw new Error(errorData.error);
+ }
+
+ return response;
+ },
+ retry: false,
+ });
+
/** Sign in with Google */
- const [signInWithGoogle, googleUser, googleLoading, googleError] =
- useSignInWithGoogle(auth);
+ const handleGoogleLogin = async () => {
+ try {
+ const provider = new GoogleAuthProvider();
+ const result = await signInWithPopup(auth, provider);
+ const user = result.user;
+
+ if (user) {
+ const email = user?.email as string;
+ const userid = user?.uid as string;
+ const phoneNumber = user?.phoneNumber as string;
+ const [firstName, lastName] = user?.displayName
+ ? user?.displayName?.split(" ")
+ : ["", ""];
+
+ // Check if user exists in local database
+ const { response, data } = await api.get(`/users/${userid}`);
+ console.log(data);
+ if (!data["data"]) {
+ const backendUser = await createLocalUserFromGoogle({
+ userid,
+ firstName,
+ lastName,
+ email,
+ phoneNumber,
+ });
+ console.log(backendUser);
+ }
+ }
+ } catch (e) {
+ setNotifOpen(true);
+ setErrorMessage(
+ "Your account could not be created. Please try again later."
+ );
+ }
+ };
+
+ if (googleLoading) return ;
return (
<>
@@ -175,11 +245,9 @@ const LoginForm = () => {
}
- // onClick={() => handleGoogleLogin()}
+ onClick={handleGoogleLogin}
type="submit"
>
Continue with Google