cal.pub0.org/components/team/TeamList.tsx

50 lines
1.4 KiB
TypeScript
Raw Normal View History

import { useState } from "react";
import TeamListItem from "./TeamListItem";
import EditTeamModal from "./EditTeamModal";
import MemberInvitationModal from "./MemberInvitationModal";
export default function TeamList(props) {
const [showMemberInvitationModal, setShowMemberInvitationModal] = useState(false);
const [showEditTeamModal, setShowEditTeamModal] = useState(false);
const [team, setTeam] = useState(null);
const selectAction = (action: string, team: any) => {
setTeam(team);
switch (action) {
case "edit":
setShowEditTeamModal(true);
break;
case "invite":
setShowMemberInvitationModal(true);
break;
}
};
return (
<div>
<ul className="bg-white border px-2 mb-2 rounded divide-y divide-gray-200">
{props.teams.map((team: any) => (
<TeamListItem
onChange={props.onChange}
key={team.id}
team={team}
onActionSelect={(action: string) => selectAction(action, team)}></TeamListItem>
))}
</ul>
{showEditTeamModal && (
<EditTeamModal
team={team}
onExit={() => {
props.onChange();
setShowEditTeamModal(false);
}}></EditTeamModal>
)}
{showMemberInvitationModal && (
<MemberInvitationModal
team={team}
onExit={() => setShowMemberInvitationModal(false)}></MemberInvitationModal>
)}
</div>
);
2021-07-30 23:05:38 +00:00
}