From 9f12ccf5c1c18eee0b92ffc71ebcf1d08c2d683b Mon Sep 17 00:00:00 2001
From: Alex van Andel <me@alexvanandel.com>
Date: Sat, 5 Jun 2021 23:41:05 +0000
Subject: [PATCH] Teams are now refreshed properly when TeamListItems change

---
 components/team/TeamList.tsx     | 7 +++++--
 components/team/TeamListItem.tsx | 1 +
 pages/settings/teams.tsx         | 4 ++--
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/components/team/TeamList.tsx b/components/team/TeamList.tsx
index b0dc52ba..7f04d322 100644
--- a/components/team/TeamList.tsx
+++ b/components/team/TeamList.tsx
@@ -24,12 +24,15 @@ export default function TeamList(props) {
   return (<div>
     <ul className="border px-2 mb-2 rounded divide-y divide-gray-200">
       {props.teams.map(
-        (team: any) => <TeamListItem key={team.id} team={team} onActionSelect={
+        (team: any) => <TeamListItem onChange={props.onChange} key={team.id} team={team} onActionSelect={
           (action: string) => selectAction(action, team)
         }></TeamListItem>
       )}
     </ul>
-    {showEditTeamModal && <EditTeamModal team={team} onExit={() => setShowEditTeamModal(false)}></EditTeamModal>}
+    {showEditTeamModal && <EditTeamModal team={team} onExit={() => {
+      props.onChange();
+      setShowEditTeamModal(false);
+    }}></EditTeamModal>}
     {showMemberInvitationModal &&
       <MemberInvitationModal
         team={team}
diff --git a/components/team/TeamListItem.tsx b/components/team/TeamListItem.tsx
index c2308ea3..221f4ff1 100644
--- a/components/team/TeamListItem.tsx
+++ b/components/team/TeamListItem.tsx
@@ -18,6 +18,7 @@ export default function TeamListItem(props) {
   }).then( () => {
     // success
     setTeam(null);
+    props.onChange();
   });
 
   return (team && <li className="mb-2 mt-2 divide-y">
diff --git a/pages/settings/teams.tsx b/pages/settings/teams.tsx
index 840c1bec..e5b1e5d3 100644
--- a/pages/settings/teams.tsx
+++ b/pages/settings/teams.tsx
@@ -72,14 +72,14 @@ export default function Teams(props) {
             </div>
             <div>
               {!!teams.length &&
-                <TeamList teams={teams}>
+                <TeamList teams={teams} onChange={loadTeams}>
                 </TeamList>
               }
 
               {!!invites.length && <div>
                 <h2 className="text-lg leading-6 font-medium text-gray-900">Open Invitations</h2>
                 <ul className="border px-2 rounded mt-2 mb-2 divide-y divide-gray-200">
-                  {invites.map( (team) => <TeamListItem key={team.id} team={team}></TeamListItem>)}
+                  {invites.map( (team) => <TeamListItem onChange={loadTeams} key={team.id} team={team}></TeamListItem>)}
                 </ul>
               </div>}
             </div>