[BUGFIX] Corriger la mise à jour trop tôt du rôle d'un membre sur Pix Orga (PIX-11534)

orga/app/components/team/members-list-item.hbs

@@ -48,7 +48,7 @@
           @placeholder="{{t 'pages.team-members.actions.select-role.label'}}"
           @onChange={{this.setRoleSelection}}
           @options={{this.organizationRoles}}
-          @value={{@membership.organizationRole}}
+          @value={{this.roleSelection}}
         >
           <:label>{{t "pages.team-members.actions.select-role.label"}}</:label>
         </PixSelect>

orga/app/components/team/members-list-item.js

@@ -16,6 +16,7 @@ export default class MembersListItem extends Component {
   @tracked isEditionMode = false;
   @tracked isRemoveMembershipModalDisplayed = false;
   @tracked isLeaveOrganizationModalDisplayed = false;
+  @tracked roleSelection = null;
 
   adminOption = {
     value: 'ADMIN',
@@ -37,6 +38,7 @@ export default class MembersListItem extends Component {
   constructor() {
     super(...arguments);
     this.organizationRoles = [this.adminOption, this.memberOption];
+    this.roleSelection = this.args.membership.organizationRole;
   }
 
   get displayRole() {
@@ -53,7 +55,7 @@ export default class MembersListItem extends Component {
 
   @action
   setRoleSelection(value) {
-    this.args.membership.organizationRole = value;
+    this.roleSelection = value;
   }
 
   @action
@@ -64,7 +66,7 @@ export default class MembersListItem extends Component {
   @action
   async updateRoleOfMember(membership) {
     this.isEditionMode = false;
-
+    membership.organizationRole = this.roleSelection;
     membership.organization = this.currentUser.organization;
 
     try {

orga/tests/integration/components/team/members-list-test.js

@@ -1,45 +1,69 @@
-import { render } from '@1024pix/ember-testing-library';
+import { clickByName, render } from '@1024pix/ember-testing-library';
 import Service from '@ember/service';
+import { click } from '@ember/test-helpers';
 import { hbs } from 'ember-cli-htmlbars';
 import { t } from 'ember-intl/test-support';
 import { module, test } from 'qunit';
+import sinon from 'sinon';
 
 import setupIntlRenderingTest from '../../../helpers/setup-intl-rendering';
 
 module('Integration | Component | Team::MembersList', function (hooks) {
+  let members;
+
   setupIntlRenderingTest(hooks);
 
-  test('it should list the team members', async function (assert) {
-    //given
+  hooks.beforeEach(function () {
+    const store = this.owner.lookup('service:store');
     class CurrentUserMemberStub extends Service {
-      isAdminInOrganization = false;
-      organization = {
+      isAdminInOrganization = true;
+      organization = store.createRecord('organization', {
         credit: 10000,
         name: 'Super Orga',
+      });
+      prescriber = {
+        id: '111',
+        firstName: 'Gigi',
+        lastName: 'La Terreur',
       };
     }
     this.owner.register('service:current-user', CurrentUserMemberStub);
 
-    const members = [
-      {
+    const [adminUser, memberUser] = [
+      store.createRecord('user', {
+        id: '111',
+        firstName: 'Gigi',
+        lastName: 'La Terreur',
+      }),
+      store.createRecord('user', {
+        id: '121',
+        firstName: 'Jojo',
+        lastName: 'La Panique',
+      }),
+    ];
+
+    members = [
+      store.createRecord('membership', {
         id: '1',
+        displayRole: t('pages.team-members.actions.select-role.options.admin'),
         organizationRole: 'ADMIN',
-        user: {
-          id: '111',
-          firstName: 'Gigi',
-          lastName: 'La Terreur',
-        },
-      },
-      {
+        user: adminUser,
+        save: sinon.stub(),
+        rollbackAttributes: sinon.stub(),
+      }),
+      store.createRecord('membership', {
         id: '2',
+        displayRole: t('pages.team-members.actions.select-role.options.member'),
         organizationRole: 'MEMBER',
-        user: {
-          id: '121',
-          firstName: 'Jojo',
-          lastName: 'La Panique',
-        },
-      },
+        save: sinon.stub(),
+        rollbackAttributes: sinon.stub(),
+        user: memberUser,
+      }),
     ];
+  });
+
+  test('it lists the team members', async function (assert) {
+    //given
     members.meta = { rowCount: 2 };
     this.set('members', members);
 
@@ -51,7 +75,7 @@ module('Integration | Component | Team::MembersList', function (hooks) {
     assert.ok(screen.getByText('Jojo'));
   });
 
-  test('it should display a message when there are no members', async function (assert) {
+  test('it displays a message when there are no members', async function (assert) {
     //given
     this.set('members', []);
 
@@ -61,4 +85,30 @@ module('Integration | Component | Team::MembersList', function (hooks) {
     // then
     assert.ok(screen.getByText(t('pages.team-members.table.empty')));
   });
+
+  module('when updating a team member role to "ADMIN"', function () {
+    test('it does not display dropdown icon on the admin member before confirming update', async function (assert) {
+      // given
+      members.meta = { rowCount: 2 };
+      this.set('members', members);
+
+      // when
+      const screen = await render(hbs`<Team::MembersList @members={{this.members}} />`);
+
+      await clickByName(t('pages.team-members.actions.manage'));
+      await clickByName(t('pages.team-members.actions.edit-organization-membership-role'));
+      await clickByName(t('pages.team-members.actions.select-role.label'));
+      await click(
+        await screen.findByRole('option', {
+          name: t('pages.team-members.actions.select-role.options.admin'),
+        }),
+      );
+
+      // then
+      assert.notOk(screen.queryByText(t('pages.team-members.actions.manage')));
+
+      await clickByName(t('pages.team-members.actions.save'));
+      assert.strictEqual(screen.queryAllByRole('button', { name: t('pages.team-members.actions.manage') }).length, 2);
+    });
+  });
 });