adding data listening, user getching and using more of recoil

packages/web/pages/s/index.tsx

@@ -1,5 +1,5 @@
 import { useRouter } from "next/router";
-import React, { ReactElement } from "react";
+import React, { ReactElement, useEffect } from "react";
 import Conversations from "../../components/MainTabsOrPages/Conversations";
 import Done from "../../components/MainTabsOrPages/Done";
 import Drawer from "../../components/MainTabsOrPages/Drawer";
@@ -14,9 +14,18 @@ import SearchResults from "../../components/FullPageExperiences/SearchResults";
 import { QueryRoutes, Routes } from "@nirvana/common/helpers/routes";
 import ViewConvo from "../../components/MainTabsOrPages/ViewConvo";
 import MainRecoilDataHandler from "../../recoil/MainRecoilDataHandler";
+import { useAuth } from "../../contexts/authContext";
 
 export default function Me() {
   // TODO: if not authenticated, take user away
+  const { currUser } = useAuth();
+  useEffect(() => {
+    if (!currUser) {
+      console.log("not authenticated...routing from dashboard to teams home");
+      router.push("/teams/login");
+      return;
+    }
+  }, []);
 
   // figure out what content to render from here
   const router = useRouter();

packages/web/pages/teams/dashboard.tsx

@@ -29,10 +29,10 @@ import { KeyCode } from "../../globals/keycode";
 
 import { useRouter } from "next/router";
 import { useEffect } from "react";
-
+import { useRecoilState } from "recoil";
 import { useAuth } from "../../contexts/authContext";
 
-let testFriends = [
+const testFriends = [
   {
     name: "Liam",
     role: "engineer",
@@ -72,7 +72,8 @@ let testFriends = [
 ];
 
 export default function Dashboard() {
-  const { currUser, logOut } = useAuth();
+  const { currUser } = useAuth();
+
   const router = useRouter();
 
   useEffect(() => {

packages/web/pages/teams/login.tsx

@@ -1,14 +1,49 @@
+import { getAuth, GoogleAuthProvider, signInWithPopup } from "firebase/auth";
 import { useRouter } from "next/router";
 import { useEffect } from "react";
+import toast from "react-hot-toast";
 import { FaArrowLeft } from "react-icons/fa";
 import { FcGoogle } from "react-icons/fc";
+import { useRecoilState } from "recoil";
 import MainLogo from "../../components/Logo/MainLogo";
 import { useAuth } from "../../contexts/authContext";
 
+const googleProvider = new GoogleAuthProvider();
+const auth = getAuth();
+
 export default function Login() {
-  const { currUser, signInGoogle } = useAuth();
+  const { currUser } = useAuth();
+
   const router = useRouter();
 
+  const signInGoogle = () => {
+    return signInWithPopup(auth, googleProvider)
+      .then((res) => {
+        // This gives you a Google Access Token. You can use it to access the Google API.
+        const credential = GoogleAuthProvider.credentialFromResult(res);
+
+        const token = credential?.accessToken;
+        // The signed-in user info.
+        const user = res.user;
+
+        // todo : don't need this?
+        // setCurrUser(new UserData(user));
+
+        console.log(user);
+      })
+      .catch((error) => {
+        // Handle Errors here.
+        const errorCode = error.code;
+        const errorMessage = error.message;
+        // The email of the user's account used.
+        const email = error.email;
+        // The AuthCredential type that was used.
+        const credential = GoogleAuthProvider.credentialFromError(error);
+        console.log(error);
+        toast.error("something went wrong");
+      });
+  };
+
   useEffect(() => {
     // if auth, go to dashboard
     if (currUser) {

packages/web/pages/teams/profile.tsx

@@ -1,13 +1,13 @@
 import { Divider } from "antd";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-import { useAuth } from "../../contexts/authContext";
 import { User } from "../../models/user";
 import UserService from "../../services/userService";
-import Image from "next/image";
+import { useAuth } from "../../contexts/authContext";
 
 export default function Profile() {
-  const { currUser, logOut } = useAuth();
+  const { currUser } = useAuth();
+
   const [user, setUser] = useState<User | null>(null);
   const [loading, setLoading] = useState<boolean>(false);