import { GetServerSideProps } from "next"; import Head from "next/head"; import Shell from "../../components/Shell"; import SettingsShell from "../../components/Settings"; import { useEffect, useState } from "react"; import type { Session } from "next-auth"; import { getSession, useSession } from "next-auth/client"; import { UsersIcon } from "@heroicons/react/outline"; import TeamList from "../../components/team/TeamList"; import TeamListItem from "../../components/team/TeamListItem"; export default function Teams() { const [, loading] = useSession(); const [teams, setTeams] = useState([]); const [invites, setInvites] = useState([]); const [showCreateTeamModal, setShowCreateTeamModal] = useState(false); const handleErrors = async (resp) => { if (!resp.ok) { const err = await resp.json(); throw new Error(err.message); } return resp.json(); }; const loadData = () => { fetch("/api/user/membership") .then(handleErrors) .then((data) => { setTeams(data.membership.filter((m) => m.role !== "INVITEE")); setInvites(data.membership.filter((m) => m.role === "INVITEE")); }) .catch(console.log); }; useEffect(() => { loadData(); }, []); if (loading) { return

Loading...

; } const createTeam = (e) => { e.preventDefault(); return fetch("/api/teams", { method: "POST", body: JSON.stringify({ name: e.target.elements["name"].value }), headers: { "Content-Type": "application/json", }, }).then(() => { loadData(); setShowCreateTeamModal(false); }); }; return ( Teams | Calendso

Your teams

View, edit and create teams to organise relationships between users

{!(invites.length || teams.length) && (

Create a team to get started

Create your first team and invite other users to work together with you.

)}
{!!(invites.length || teams.length) && (
)}
{!!teams.length && } {!!invites.length && (

Open Invitations

    {invites.map((team) => ( ))}
)}
{/*{teamsLoaded &&

Transform account

{membership.length !== 0 && "You cannot convert this account into a team until you leave all teams that you’re a member of."} {membership.length === 0 && "A user account can be turned into a team, as a team ...."}

}*/}
{showCreateTeamModal && (

Create a new team to collaborate with users.

)} ); } // Export the `session` prop to use sessions with Server Side Rendering export const getServerSideProps: GetServerSideProps<{ session: Session | null }> = async (context) => { const session = await getSession(context); if (!session) { return { redirect: { permanent: false, destination: "/auth/login" } }; } return { props: { session }, }; };