fix addTeams

src/api/services/team.js

 import { HTTP } from "@/api/http-common";
 
+const getTeamMemberBody = (users) => {
+  return users.map((user) => ({
+    userId: user.id,
+    isTeamLead: user.TeamMember?.isTeamLead,
+  }));
+};
+
 export default {
   async getMyTeam() {
     return await HTTP.get("/teams/my-teams");
@@ -33,11 +40,7 @@ export default {
     });
   },
   async updateTeamMembers(team) {
-    const membersBody = team.members.map((m) => ({
-      userId: m.id,
-      isTeamLead: m.TeamMember.isTeamLead,
-    }));
-
+    const membersBody = getTeamMemberBody(team.members);
     return HTTP.put(`/teams/${team.id}/members`, membersBody);
   },
 
@@ -55,6 +58,7 @@ export default {
     });
   },
   async addMembers(members, teamId) {
-    await HTTP.post(`/teams/${teamId}/members`, members);
+    const membersBody = getTeamMemberBody(members);
+    await HTTP.post(`/teams/${teamId}/members`, membersBody);
   },
 };

src/components/AddTeam.vue

@@ -132,24 +132,27 @@ export default {
       this.init();
     },
     add() {
-      this.$emit("add", this.toAdd);
+      this.$emit("add", this.toAdd, this.leads);
       this.init();
     },
     edit() {
       // merge members and leads
       const members = new Map();
-      console.log("MEMBER",members)
-      this.toAdd.members.forEach((member) => {
-        member.TeamMember = { isTeamLead: false };
-        members.set(member.id, member);
-      });
-      this.leads.forEach((lead) => {
-        lead.TeamMember = { isTeamLead: true };
-        members.set(lead.id, lead);
-      });
+      if (this.toAdd.members) {
+        this.toAdd.members.forEach((member) => {
+          member.TeamMember = { isTeamLead: false };
+          members.set(member.id, member);
+        });
+      }
+      if (this.leads) {
+        this.leads.forEach((lead) => {
+          lead.TeamMember = { isTeamLead: true };
+          members.set(lead.id, lead);
+        });
+      }
       this.toAdd.members = [...members.values()];
 
-      this.$emit("edit", this.toAdd, this.leads);
+      this.$emit("edit", this.toAdd);
       this.init();
     },
   },

src/components/UserSelect.vue

@@ -154,7 +154,6 @@ export default {
     async query(val) {
       try {
         const newItems = await UserService.search({ q: val });
-        console.log(newItems);
         if (this.model) {
           if (Array.isArray(this.model)) {
             this.items = uniq([...newItems.users, ...this.model]);

src/views/Team.vue

@@ -99,12 +99,12 @@
                 <v-card-text>
                   <UserSelect
                     ref="userSelect"
-                    v-model="memberToAdd"
+                    v-model="membersToAdd"
                     multiple
                     :rules="[
                       inputRules.required,
                       inputRules.duplicates(
-                        memberToAdd,
+                        membersToAdd,
                         team.members,
                         'User is already a member of this team'
                       ),
@@ -123,7 +123,7 @@
                     Cancel
                   </v-btn>
                   <v-btn
-                    :disabled="state.isAddingDuplicate || !memberToAdd"
+                    :disabled="state.isAddingDuplicate || !membersToAdd"
                     color="primary"
                     :loading="state.isAddingBusy"
                     text
@@ -210,12 +210,17 @@
         </v-snackbar>
         <v-snackbar
           top
-          v-if="memberToAdd"
+          v-if="membersToAdd"
           v-model="snackbars.add"
           :timeout="5000"
         >
           <div class="text-center">
-            {{ memberToAdd.name }} added to {{ team.name }}
+            <div v-if="membersToAdd.length === 1">
+              {{ membersToAdd[0].name }} added to {{ team.name }}
+            </div>
+            <div v-else>
+              {{ membersToAdd.length }} members added to {{ team.name }}
+            </div>
           </div>
         </v-snackbar>
       </v-skeleton-loader>
@@ -269,7 +274,7 @@ export default {
     ],
     selectedMembers: [],
     deletingMembers: [],
-    memberToAdd: null,
+    membersToAdd: null,
     inputRules,
   }),
   async mounted() {
@@ -293,7 +298,6 @@ export default {
             this.team = await TeamService.getMyTeam();
           }
         } else {
-          console.log("THIS CANNOT BE ME");
           await this.getTeams();
         }
       } catch (error) {
@@ -308,7 +312,6 @@ export default {
       }
       try {
         this.team = await TeamService.getTeam(this.$route.params.teamId);
-        console.log("TEAM", this.team);
       } catch (error) {
         console.error("!teams error!", error);
       } finally {
@@ -334,20 +337,18 @@ export default {
       }
     },
     cancelAddMember() {
-      this.memberToAdd = null;
+      this.membersToAdd = null;
       this.state.isAdding = false;
       this.state.isAddingDuplicate = false;
       this.$refs.userSelect && this.$refs.userSelect.clear();
     },
     async addMember() {
       this.state.isAddingBusy = true;
-      const members = this.memberToAdd.map((member) => ({
-        userId: member.id,
-        isTeamLead: false,
-      }));
       try {
-        await TeamService.addMembers(members, this.$route.params.teamId);
-        this.memberToAdd = members;
+        await TeamService.addMembers(
+          this.membersToAdd,
+          this.$route.params.teamId
+        );
         this.snackbars.add = true;
       } catch (e) {
         console.error("unable to add user", e);
@@ -362,16 +363,6 @@ export default {
       this.snackbars.delete = false;
       this.state.isDeleting = true;
       this.deletingMembers = this.selectedMembers;
-      for (let i = 0; i < this.deletingMembers.length; i++) {
-        const tempMember = this.team.members.filter(
-          (member) => member.id === this.deletingMembers[i].id
-        );
-        this.deletingMembers[i] = {
-          ...this.deletingMembers[i],
-          isTeamLead: tempMember[0].TeamMember.isTeamLead,
-        };
-      }
-
       this.deletingMembers.forEach((m) => Vue.set(m, "isDeleting", true));
       try {
         await TeamService.deleteMembers(
@@ -393,12 +384,11 @@ export default {
       // keep the delete snackbar open
       this.snackbars.deleteTimeout = -1;
       this.state.isUndoingDelete = true;
-      console.log("Deleted", this.deletingMembers);
-      const members = this.deletingMembers.map(function (member) {
-        return { userId: member.id, isTeamLead: member.TeamMember.isTeamLead };
-      });
       try {
-        await TeamService.addMembers(members, this.$route.params.teamId);
+        await TeamService.addMembers(
+          this.deletingMembers,
+          this.$route.params.teamId
+        );
       } catch (e) {
         //TODO: error message to the user???
         console.error("error restoring member:", e);

src/views/super-admin/Teams.vue

@@ -309,7 +309,6 @@ export default {
       try {
         const response = await TeamService.getTeams(this.params);
         this.teams = response.teams;
-        console.log(this.teams);
         this.total = response.meta.total;
       } catch (error) {
         console.error("!teams error!", error);
@@ -318,11 +317,16 @@ export default {
         this.fetchingData = false;
       }
     },
-    async addTeam(toAdd) {
+    async addTeam(toAdd, leads) {
       this.state.isAddingBusy = true;
       try {
-        await TeamService.addTeam(toAdd);
-        this.teamToAdd = toAdd;
+        const team = await TeamService.addTeam(toAdd);
+        leads = leads.map((member) => ({
+          ...member,
+          TeamMember: { isTeamLead: true },
+        }));
+        await TeamService.addMembers(leads, team.id);
+        this.teamToAdd = { ...toAdd, leads: leads };
         this.snackbars.add = true;
       } catch (e) {
         console.error("unable to add", e);

tests/unit/components/AddTeam.spec.js

@@ -29,7 +29,7 @@ describe("AddTeam", () => {
     wrapper.vm.$emit = jest.fn();
     wrapper.vm.edit();
     expect(wrapper.vm.$emit).toHaveBeenCalledWith("edit", {
-      memberCount: { count: 0 },
+      members: [],
     });
   });
   it("should trigger cancel", async () => {
@@ -68,8 +68,6 @@ describe("AddTeam", () => {
 
     wrapper.vm.$emit = jest.fn();
     wrapper.vm.add();
-    expect(wrapper.vm.$emit).toHaveBeenCalledWith("add", {
-      memberCount: { count: 0 },
-    });
+    expect(wrapper.vm.$emit).toHaveBeenCalledWith("add", {});
   });
 });

tests/unit/components/EditableInput.spec.js

@@ -118,15 +118,13 @@ describe("components/EditableInput", () => {
           },
         },
       },
-      props: {
-        value: "mockValue",
-      },
       localVue,
       vuetify,
     });
 
     wrapper.vm.$emit = jest.fn();
     await wrapper.setProps({ value: "newMockValue" });
+    await wrapper.setData({ model: "MockValue" });
     wrapper.vm.updateValue();
     expect(wrapper.vm.$emit).toHaveBeenCalled();
   });

tests/unit/components/UserSelect.spec.js

@@ -3,7 +3,7 @@ import Vuetify from "vuetify";
 import UserSelect from "@/components/UserSelect";
 import UserService from "@/api/services/user";
 
-describe("LaunchboardAdmin", () => {
+describe("UserSelect", () => {
   // vuetify has to be mocked for the v-autocomplete to not crash
   let vuetify;
   beforeEach(() => {
@@ -119,7 +119,7 @@ describe("LaunchboardAdmin", () => {
       vuetify,
     });
 
-    UserService.search = jest.fn().mockResolvedValue(["a"]);
+    UserService.search = jest.fn().mockResolvedValue({ users: ["a"] });
 
     // multiple model
     wrapper.vm.model = ["b", "c"];

tests/unit/views/Team.spec.js

@@ -252,7 +252,7 @@ describe("Team", () => {
 
       wrapper.vm.$refs = { userSelect };
 
-      wrapper.vm.memberToAdd = mockMember;
+      wrapper.vm.memberToAdd = [mockMember];
       await wrapper.vm.addMember();
       expect(TeamService.addMember).toHaveBeenCalledTimes(1);
       expect(TeamService.addMember).toHaveBeenCalledWith(mockMember, 42, false);
@@ -265,11 +265,11 @@ describe("Team", () => {
       console.error = jest.fn(); // mock console.error when expecting error messages
       const userSelect = { clear: jest.fn() };
       TeamService.getTeam = jest.fn().mockResolvedValue({ name: "mock" });
-      TeamService.addMember = jest.fn().mockResolvedValue({ name: "mock" });
+      TeamService.addMembers = jest.fn().mockResolvedValue({ name: "mock" });
       const wrapper = shallowMount(Team, { mocks: { $route } });
       wrapper.vm.$refs = { userSelect };
       TeamService.addMember = jest.fn().mockRejectedValue("mock error");
-      await wrapper.vm.addMember(mockMember);
+      await wrapper.vm.addMember([mockMember]);
       expect(wrapper.vm.state.isAdding).toEqual(false);
       expect(wrapper.vm.state.isAddingBusy).toEqual(false);
       expect(userSelect.clear).toHaveBeenCalledTimes(1);
@@ -283,6 +283,7 @@ describe("Team", () => {
 
       TeamService.deleteMembers = jest.fn().mockResolvedValue();
       const toDelete = {
+        id: 46,
         name: "mock member to delete",
         TeamMember: { isTeamLead: true },
       };
@@ -296,10 +297,7 @@ describe("Team", () => {
       expect(wrapper.vm.snackbars.delete).toEqual(true);
       expect(wrapper.vm.state.isDeleting).toEqual(false);
       expect(TeamService.deleteMembers).toHaveBeenCalledTimes(1);
-      expect(TeamService.deleteMembers).toHaveBeenCalledWith(
-        [{ isDeleting: false, isTeamLead: true, ...toDelete }],
-        42
-      );
+      expect(TeamService.deleteMembers).toHaveBeenCalledWith([46], 42);
       expect(wrapper.vm.selectedMembers).toEqual([]);
     });
     it("should handle error on delete team member", async () => {
@@ -315,11 +313,12 @@ describe("Team", () => {
   });
 
   describe("undo delete team member", () => {
-    const deletingMembers = [{ name: "mock to delete" }];
+    const deletingMembers = [
+      { id: 46, name: "mock to delete", TeamMember: { isTeamLead: true } },
+    ];
     it("should undo delete team member", async () => {
       TeamService.getTeam = jest.fn().mockResolvedValue({ name: "mock" });
       const wrapper = shallowMount(Team, { mocks: { $route } });
-      // await flushPromises();
 
       TeamService.addMembers = jest.fn().mockResolvedValue();
 
@@ -330,7 +329,10 @@ describe("Team", () => {
       await flushPromises();
 
       expect(TeamService.addMembers).toHaveBeenCalledTimes(1);
-      expect(TeamService.addMembers).toHaveBeenCalledWith(deletingMembers, 42);
+      expect(TeamService.addMembers).toHaveBeenCalledWith(
+        [{ userId: 46, isTeamLead: true }],
+        42
+      );
       expect(wrapper.vm.state.isUndoingDelete).toEqual(false);
       expect(wrapper.vm.deletingMembers).toEqual([]);
     });