talksik/nirvana
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

organizing with a nice context provider and now have access to the data clean

Browse Source
This commit is contained in:
Arjun Patel
2022-01-14 14:44:09 -08:00
parent a0c36ec924
commit 5e73b75d73
5 changed files with 409 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/teams/[teamid].tsx
+29 -93
View File
@@ -1,99 +1,35 @@
import { GetServerSidePropsContext, GetServerSidePropsResult } from 'next'
import { useRouter } from 'next/router'
import { useEffect, useState } from 'react'
import BackgroundLayout from '../../components/Layouts/BackgroundLayout'
import { useAuth } from '../../contexts/authContext'
import { Team } from '../../models/team'
import { TeamMemberStatus } from '../../models/teamMember'
import TeamService from '../../services/teamService'
import { GetServerSidePropsContext, GetServerSidePropsResult } from "next";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";
import BackgroundLayout from "../../components/Layouts/BackgroundLayout";
import Loading from "../../components/Loading";
import { useAuth } from "../../contexts/authContext";
import {
TeamDashboardContextProvider,
useTeamDashboardContext,
} from "../../contexts/teamDashboardContext";
import { Team } from "../../models/team";
import { TeamMemberStatus } from "../../models/teamMember";
import TeamService from "../../services/teamService";
const teamService = new TeamService()
function TeamDashboard() {
const { currUser } = useAuth();
const router = useRouter();
const teamDashboardContext = useTeamDashboardContext();
export default function TeamDashboard() {
const { currUser } = useAuth()
const router = useRouter()
const { teamid } = router.query
console.log(teamDashboardContext);
const [loading, setLoading] = useState<Boolean>(true)
const [team, setTeam] = useState<Team>(null)
useEffect(() => {
(async function() {
try {
// if not authenticated, take user to the login
if (!currUser) {
console.log('not authenticated...routing from dashboard to teams home')
router.push('/teams/login')
return
}
if (typeof teamid !== "string") {
console.log('not a proper query with teamid')
router.push('/teams')
return
}
// check if the team is a valid team and that user is in it
const returnedTeam = await teamService.getTeam(teamid)
if (!returnedTeam) {
console.log('team doesnt exist')
router.push('/teams')
return
}
const returnedTeamMember = await teamService.getTeamMemberByUserId(teamid, currUser.uid)
console.log(returnedTeam)
console.log(returnedTeamMember)
// if you are not a member of this team, then get out of here
// but have to check through email invite and userid
if (returnedTeamMember && returnedTeamMember.status == TeamMemberStatus.deleted) {
console.log('user was deleted from team')
router.push('/teams')
return
}
// if there is no team member through user id,
// give him last chance and see if he was invited
if (!returnedTeamMember) {
const invitedTeamMember = await teamService.getTeamMemberByEmailInvite(teamid, currUser.email)
if (!invitedTeamMember) {
console.log('not invited to team either')
router.push('/teams')
return
}
// if I am new to the team but I was invited, and this is my first time, then activate me into the team
// and proceed with showing the dashboard stuff
invitedTeamMember.status = TeamMemberStatus.activated
invitedTeamMember.userId = currUser.uid
await teamService.updateTeamMember(invitedTeamMember)
}
} catch(error) {
console.log(error)
router.push('/teams/login')
}
setLoading(false)
})();
}, [])
if (loading) {
return (
<div>loading</div>
)
}
return <div>{JSON.stringify(teamDashboardContext)}</div>;
}
export default function TeamDashboardWrapper() {
return (
<BackgroundLayout>
the team is {teamid}
</BackgroundLayout>
)
<TeamDashboardContextProvider>
<BackgroundLayout>
<TeamDashboard />
</BackgroundLayout>
</TeamDashboardContextProvider>
);
}
export async function getServerSideProps(context: GetServerSidePropsContext) {
@@ -105,5 +41,5 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
return {
props: {},
}
}
};
}
pages/teams/index.tsx
+91 -63
View File
@@ -1,72 +1,80 @@
import { useAuth } from "../../contexts/authContext"
import { useRouter } from "next/router"
import { useEffect, useState } from "react"
import UserService from '../../services/userService'
import { User } from "../../models/user"
import { GetServerSidePropsContext } from "next"
import nookies from 'nookies'
import firebaseAdmin from 'firebase-admin'
import unfetch from 'isomorphic-unfetch'
import {
FaPeopleCarry,
FaArrowRight,
FaBullhorn
} from "react-icons/fa";
import BackgroundLayout from "../../components/Layouts/BackgroundLayout"
import TeamService from "../../services/teamService"
import { useAuth } from "../../contexts/authContext";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";
import UserService from "../../services/userService";
import { User } from "../../models/user";
import { GetServerSidePropsContext } from "next";
import nookies from "nookies";
import firebaseAdmin from "firebase-admin";
import unfetch from "isomorphic-unfetch";
import { FaPeopleCarry, FaArrowRight, FaBullhorn } from "react-icons/fa";
import BackgroundLayout from "../../components/Layouts/BackgroundLayout";
import TeamService from "../../services/teamService";
/**
* figure out where to take the user based on everything
*/
const userService: UserService = new UserService()
const teamService: TeamService = new TeamService()
const userService: UserService = new UserService();
const teamService: TeamService = new TeamService();
function RouteHandler() {
const { currUser } = useAuth()
const router = useRouter()
const [loading, setLoading] = useState<Boolean>(true)
const [user, setUser] = useState<User | null>(null)
const { currUser } = useAuth();
const router = useRouter();
const [loading, setLoading] = useState<Boolean>(true);
const [user, setUser] = useState<User | null>(null);
useEffect(() => {
(async function() {
(async function () {
try {
// if not authenticated, take user to the login
if (!currUser) {
console.log('not authenticated...routing from dashboard to teams home')
router.push('/teams/login')
console.log(
"not authenticated...routing from dashboard to teams home"
);
router.push("/teams/login");
}
// get user
const returnedUser: User | null = await userService.getUser(currUser.uid)
console.log(returnedUser)
// get user
const returnedUser: User | null = await userService.getUser(
currUser.uid
);
console.log(returnedUser);
// if user has no profile, then go to create profile
if (!returnedUser || !returnedUser.firstName || !returnedUser.lastName || !returnedUser.nickName) {
console.log('no profile for the user, routing him/her there')
router.push('/teams/profile')
}
setUser(returnedUser)
// check if user is in a team go to the team dashboard
const returnedTeamMembers = await teamService.getTeamMembersByUserId(currUser.uid)
if (returnedTeamMembers.length > 0) {
console.log('in a team! going to the team dashboard of the first one!')
router.push('/teams/' + returnedTeamMembers[0].teamId)
return
if (
!returnedUser ||
!returnedUser.firstName ||
!returnedUser.lastName ||
!returnedUser.nickName
) {
console.log("no profile for the user, routing him/her there");
router.push("/teams/profile");
}
setUser(returnedUser);
} catch(error) {
console.log(error)
router.push('/teams/login')
// check if user is in a team go to the team dashboard
const returnedTeamMembers = await teamService.getTeamMembersByUserId(
currUser.uid
);
if (returnedTeamMembers.length > 0) {
console.log(
"in a team! going to the team dashboard of the first one!"
);
router.push("/teams/" + returnedTeamMembers[0].teamId);
return;
}
} catch (error) {
console.log(error);
router.push("/teams/login");
}
})();
setLoading(false)
}, [currUser])
setLoading(false);
}, [currUser]);
if (loading || !user) {
return <div></div>
return <div></div>;
}
// not in a team yet, and have not created a team yet
@@ -76,25 +84,36 @@ function RouteHandler() {
<div className="flex flex-row items-center justify-between">
<span className="flex flex-col justify-start">
<div className="text-lg">👋Hey, {user.firstName}</div>
<span className="text-gray-300 text-md">Let&apos;s get you started.</span>
<span className="text-gray-300 text-md">
Let&apos;s get you started.
</span>
</span>
<button onClick={() => router.push('/teams/profile')}>
<img src={user ? user.avatarUrl : currUser.photoURL} alt="asdf" className="rounded-full w-12" />
<button onClick={() => router.push("/teams/profile")}>
<img
src={user ? user.avatarUrl : currUser.photoURL}
alt="asdf"
className="rounded-full w-12"
/>
</button>
</div>
{/* create team hover thing */}
<button onClick={() => router.push('/teams/create')} className="group flex flex-row py-5 px-3 items-center border border-dashed rounded hover:shadow-lg transition duration-400">
<button
onClick={() => router.push("/teams/create")}
className="group flex flex-row py-5 px-3 items-center border border-dashed rounded hover:shadow-lg transition duration-400"
>
<FaPeopleCarry className="text-5xl text-teal-500" />
<span className="flex flex-col items-start ml-2 mr-10">
<span className="text-gray-500">Create a Team</span>
<span className="text-gray-300 text-sm text-left">Add members, and get started immediately.</span>
<span className="text-gray-300 text-sm text-left">
Add members, and get started immediately.
</span>
</span>
<span className='ml-auto bg-gray-500 bg-opacity-25 p-2 rounded group-hover:bg-opacity-40 group-hover:bg-teal-500'>
<FaArrowRight className='text-sm text-white' />
<span className="ml-auto bg-gray-500 bg-opacity-25 p-2 rounded group-hover:bg-opacity-40 group-hover:bg-teal-500">
<FaArrowRight className="text-sm text-white" />
</span>
</button>
@@ -104,14 +123,23 @@ function RouteHandler() {
<span className="flex flex-col items-start ml-2 mr-10">
<span className="text-gray-500">Remind Your Manager</span>
<span className="text-gray-300 text-sm text-left">Your account email is {user.emailAddress}</span>
<span className="text-gray-300 text-sm text-left">
Your account email is {user.emailAddress}
</span>
</span>
</button>
<span className="text-gray-300 ml-auto text-md mt-10">or learn more about <button onClick={() => router.push('/teams/landing')} className="underline font-satisfy text-xl text-teal-500 decoration-teal-500">nirvana</button></span>
<span className="text-gray-300 ml-auto text-md mt-10">
or learn more about{" "}
<button
onClick={() => router.push("/teams/landing")}
className="underline font-satisfy text-xl text-teal-500 decoration-teal-500"
>
nirvana
</button>
</span>
</div>
)
);
}
export async function getServerSideProps(context: GetServerSidePropsContext) {
@@ -143,14 +171,14 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
// console.log(e)
// }
// }
// // Pass data to the page via props
// return { props: {
// return { props: {
// user
// }
// }
return { props: { }}
return { props: {} };
}
export default RouteHandler
export default RouteHandler;