[FEATURE] Utiliser PixTable dans les tableaux d'équipe et de finalisation sur Pix Certif (PIX-16788).

certif/app/components/members-list.hbs

@@ -1,34 +1,11 @@
 <div role="tabpanel">
-  <div class="panel">
-    <div class="table content-text--small">
-      <table>
-        <thead>
-          <tr>
-            <Table::Header>{{t "common.labels.candidate.lastname"}}</Table::Header>
-            <Table::Header>{{t "common.labels.candidate.firstname"}}</Table::Header>
-            <Table::Header>{{t "common.labels.candidate.role"}}</Table::Header>
-            {{#if this.shouldDisplayManagingColumn}}
-              <Table::Header>{{t "pages.team.table-headers.actions"}}</Table::Header>
-            {{/if}}
-            {{#if this.shouldDisplayRefererColumn}}
-              <Table::Header>{{t "pages.team.referer"}}</Table::Header>
-            {{/if}}
-          </tr>
-        </thead>
-        <tbody>
-          {{#each @members as |member|}}
-            <MembersListItem
-              @member={{member}}
-              @shouldDisplayRefererColumn={{this.shouldDisplayRefererColumn}}
-              @isMultipleAdminsAvailable={{this.isMultipleAdminsAvailable}}
-              @onLeaveCertificationCenterButtonClicked={{this.openLeaveCertificationCenterModal}}
-              @onRemoveMemberButtonClicked={{this.openRemoveMemberModal}}
-            />
-          {{/each}}
-        </tbody>
-      </table>
-    </div>
-  </div>
+  <MembersTable
+    @members={{@members}}
+    @hasCleaHabilitation={{@hasCleaHabilitation}}
+    @onLeaveCertificationCenterButtonClicked={{this.openLeaveCertificationCenterModal}}
+    @onRemoveMemberButtonClicked={{this.openRemoveMemberModal}}
+    @onChangeMemberRoleButtonClicked={{this.openChangeMemberRoleModal}}
+  />
 </div>
 
 <Team::Modal::LeaveCertificationCenter
@@ -37,10 +14,18 @@
   @onClose={{this.closeLeaveCertificationCenterModal}}
   @onSubmit={{this.leaveCertificationCenter}}
 />
+
 <Team::Modal::RemoveMemberModal
   @firstName={{this.removingMember.firstName}}
   @lastName={{this.removingMember.lastName}}
   @isOpen={{this.isRemoveMemberModalOpen}}
   @onSubmit={{this.removeMember}}
   @onClose={{this.closeRemoveMemberModal}}
+/>
+
+<Team::Modal::ChangeMemberRoleModal
+  @member={{this.member}}
+  @isOpen={{this.isChangeMemberRoleModalOpen}}
+  @onSubmit={{this.changeMemberRole}}
+  @onClose={{this.closeChangeMemberRoleModal}}
 />

certif/app/components/members-list.js

@@ -11,20 +11,9 @@ export default class MembersList extends Component {
 
   @tracked isLeaveCertificationCenterModalOpen = false;
   @tracked isRemoveMemberModalOpen = false;
+  @tracked isChangeMemberRoleModalOpen = false;
   @tracked removingMember;
-
-  get shouldDisplayRefererColumn() {
-    return this.args.hasCleaHabilitation;
-  }
-
-  get shouldDisplayManagingColumn() {
-    return this.currentUser.isAdminOfCurrentCertificationCenter;
-  }
-
-  get isMultipleAdminsAvailable() {
-    const adminMembers = this.args.members?.filter((member) => member.isAdmin);
-    return adminMembers.length > 1;
-  }
+  @tracked member;
 
   @action
   openLeaveCertificationCenterModal() {
@@ -37,6 +26,12 @@ export default class MembersList extends Component {
     this.isRemoveMemberModalOpen = true;
   }
 
+  @action
+  openChangeMemberRoleModal(member) {
+    this.member = member;
+    this.isChangeMemberRoleModalOpen = true;
+  }
+
   @action
   closeLeaveCertificationCenterModal() {
     this.isLeaveCertificationCenterModalOpen = false;
@@ -48,6 +43,11 @@ export default class MembersList extends Component {
     this.removingMember = undefined;
   }
 
+  @action
+  closeChangeMemberRoleModal() {
+    this.isChangeMemberRoleModalOpen = false;
+  }
+
   @action
   async leaveCertificationCenter() {
     try {
@@ -86,4 +86,22 @@ export default class MembersList extends Component {
       this.closeRemoveMemberModal();
     }
   }
+
+  @action
+  async changeMemberRole(role) {
+    try {
+      this.member.role = role;
+      await this.member.save();
+      this.pixToast.sendSuccessNotification({
+        message: this.intl.t('pages.team.members.notifications.change-member-role.success'),
+      });
+      this.isChangeMemberRoleModalOpen = false;
+    } catch (_) {
+      this.member.rollbackAttributes();
+      this.pixToast.sendErrorNotification({
+        message: this.intl.t('pages.team.members.notifications.change-member-role.error'),
+      });
+      this.isChangeMemberRoleModalOpen = false;
+    }
+  }
 }