import { ArrowRightIcon } from "@heroicons/react/outline"; import { ArrowLeftIcon } from "@heroicons/react/solid"; import classnames from "classnames"; import Link from "next/link"; import { TeamPageProps } from "pages/team/[slug]"; import React from "react"; import { WEBAPP_URL } from "@calcom/lib/constants"; import Button from "@calcom/ui/Button"; import { useLocale } from "@lib/hooks/useLocale"; import Avatar from "@components/ui/Avatar"; type TeamType = TeamPageProps["team"]; type MembersType = TeamType["members"]; type MemberType = MembersType[number]; const Team = ({ team }: TeamPageProps) => { const { t } = useLocale(); const Member = ({ member }: { member: MemberType }) => { const classes = classnames( "group", "relative", "flex flex-col", "space-y-4", "p-4", "min-w-full sm:min-w-64 sm:max-w-64", "bg-white dark:bg-neutral-800 dark:border-neutral-700 dark:bg-opacity-8", "border border-neutral-200", "hover:cursor-pointer", "hover:border-brand dark:border-neutral-700 dark:hover:border-neutral-600", "rounded-sm", "hover:shadow-md" ); return (

{member.name}

{member.bio || t("user_from_team", { user: member.name, team: team.name })}

); }; const Members = ({ members }: { members: MembersType }) => { if (!members || members.length === 0) { return null; } return (
{members.map((member) => { return member.username !== null && ; })}
); }; return (
{team.eventTypes.length > 0 && ( )}
); }; export default Team;