112 lines
3.3 KiB
TypeScript
112 lines
3.3 KiB
TypeScript
import { GetServerSidePropsContext, GetServerSidePropsResult } from "next";
|
|
import { useRouter } from "next/router";
|
|
import { useEffect, useState } from "react";
|
|
import Header from "../../components/Dashboard/Header";
|
|
import TeamVoiceLine from "../../components/Dashboard/TeamVoiceLine";
|
|
import BackgroundLayout from "../../components/Layouts/BackgroundLayout";
|
|
import Loading from "../../components/Loading";
|
|
import AudioContextProvider from "../../contexts/audioContext";
|
|
import { useAuth } from "../../contexts/authContext";
|
|
import {
|
|
TeamDashboardContextProvider,
|
|
useTeamDashboardContext,
|
|
} from "../../contexts/teamDashboardContext";
|
|
import { Team } from "../../models/team";
|
|
import { TeamMemberStatus } from "../../models/teamMember";
|
|
import { UserStatus } from "../../models/user";
|
|
import TeamService from "../../services/teamService";
|
|
import UserService from "../../services/userService";
|
|
|
|
// User has switched back to the tab
|
|
const onFocus = () => {
|
|
console.log("Tab is in focus");
|
|
};
|
|
|
|
// User has switched away from the tab (AKA tab is hidden)
|
|
const onBlur = () => {
|
|
console.log("Tab is blurred");
|
|
};
|
|
|
|
const alertUserAboutClosing = (ev) => {
|
|
// change user status to offline
|
|
|
|
ev.preventDefault();
|
|
return (ev.returnValue = "are you sure?");
|
|
};
|
|
|
|
const userService = new UserService();
|
|
|
|
function TeamDashboard() {
|
|
const { currUser } = useAuth();
|
|
const router = useRouter();
|
|
const teamDashboardContext = useTeamDashboardContext();
|
|
|
|
// user goes offline
|
|
const handleTabClosing = () => {
|
|
// change status of user
|
|
userService.updateUserStatus(currUser.uid, UserStatus.offline);
|
|
};
|
|
|
|
// shows browser alert to warn user of exiting
|
|
const alertUserAboutClosing = (event: any) => {
|
|
event.preventDefault();
|
|
event.returnValue = "";
|
|
};
|
|
|
|
useEffect(() => {
|
|
window.addEventListener("focus", onFocus);
|
|
window.addEventListener("blur", onBlur);
|
|
// Calls onFocus when the window first loads
|
|
onFocus();
|
|
|
|
// set user to online until he closes tab/window
|
|
userService.updateUserStatus(currUser.uid, UserStatus.online);
|
|
|
|
window.addEventListener("beforeunload", alertUserAboutClosing);
|
|
window.addEventListener("unload", handleTabClosing);
|
|
return () => {
|
|
// Specify how to clean up after this effect:
|
|
window.removeEventListener("focus", onFocus);
|
|
window.removeEventListener("blur", onBlur);
|
|
window.removeEventListener("beforeunload", alertUserAboutClosing);
|
|
window.removeEventListener("unload", handleTabClosing);
|
|
};
|
|
}, []);
|
|
|
|
console.log(teamDashboardContext);
|
|
|
|
return (
|
|
<div className="container mx-auto max-w-screen-xl py-10 px-10 flex flex-col space-y-5">
|
|
<Header />
|
|
|
|
<div className="flex flex-row items-baseline space-x-5 space-y-5 flex-wrap">
|
|
<TeamVoiceLine />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default function TeamDashboardWrapper() {
|
|
return (
|
|
<TeamDashboardContextProvider>
|
|
<AudioContextProvider>
|
|
<BackgroundLayout>
|
|
<TeamDashboard />
|
|
</BackgroundLayout>
|
|
</AudioContextProvider>
|
|
</TeamDashboardContextProvider>
|
|
);
|
|
}
|
|
|
|
export async function getServerSideProps(context: GetServerSidePropsContext) {
|
|
// basic check if this team exists
|
|
|
|
// todo check if authenticated
|
|
|
|
// todo check if this user is in this team
|
|
|
|
return {
|
|
props: {},
|
|
};
|
|
}
|