[BUMP] Update dependency @1024pix/pix-ui to v47 (orga) (PIX-14842)

 #10329

Author: pix-service-auto-merge

orga/app/components/campaign/activity/participants-list.gjs

@@ -147,7 +147,7 @@ export default class ParticipantsList extends Component {
                       <PixIconButton
                         @ariaLabel={{t "pages.campaign-activity.table.delete-button-label"}}
                         @withBackground={{true}}
-                        @icon="trash-can"
+                        @iconName="delete"
                         @triggerAction={{fn this.openModal participation}}
                         @size="small"
                         class="campaign-activity-table-actions__button campaign-activity-table-actions__button--delete"

orga/app/components/campaign/cards/participants-count.gjs

@@ -4,7 +4,7 @@ import { t } from 'ember-intl';
 <template>
   <PixIndicatorCard
     @title={{t "cards.participants-count.title"}}
-    @icon="users"
+    @iconName="users"
     @color="blue"
     @info={{t "cards.participants-count.information"}}
     @loadingMessage={{t "cards.participants-count.loader"}}

orga/app/components/campaign/cards/result-average.gjs

@@ -4,7 +4,7 @@ import { t } from 'ember-intl';
 <template>
   <PixIndicatorCard
     @title={{t "cards.participants-average-results.title"}}
-    @icon="crown"
+    @iconName="awards"
     @color="blue"
     @info={{t "cards.participants-average-results.information"}}
     @isLoading={{@isLoading}}

orga/app/components/campaign/cards/shared-count.gjs

@@ -4,12 +4,11 @@ import { t } from 'ember-intl';
 <template>
   <PixIndicatorCard
     @title={{if @isTypeAssessment (t "cards.submitted-count.title") (t "cards.submitted-count.title-profiles")}}
-    @icon="inbox-in"
+    @iconName="inboxIn"
     @color="green"
     @info={{t "cards.submitted-count.information"}}
     @loadingMessage={{t "cards.submitted-count.loader"}}
     @isLoading={{@isLoading}}
-    @iconPrefix="fapix"
     ...attributes
   >
     <:default>{{@value}}</:default>

orga/app/components/campaign/cards/stage-average.gjs

@@ -24,7 +24,7 @@ export default class StageAverage extends Component {
   <template>
     <PixIndicatorCard
       @title={{t "cards.participants-average-stages.title"}}
-      @icon="crown"
+      @iconName="awards"
       @color="blue"
       @info={{t "cards.participants-average-stages.information"}}
       @isLoading={{@isLoading}}

orga/app/components/campaign/filter/campaign-filters.gjs

@@ -52,14 +52,10 @@ export default class CampaignFilters extends Component {
         />
       {{/unless}}
 
-      <PixToggle
-        @onLabel={{t "pages.campaigns-list.action.campaign.ongoing"}}
-        @offLabel={{t "pages.campaigns-list.action.campaign.archived"}}
-        @toggled={{this.isToggleSwitched}}
-        @onChange={{this.onToggle}}
-        @screenReaderOnly={{true}}
-      >
+      <PixToggle @toggled={{this.isToggleSwitched}} @onChange={{this.onToggle}} @screenReaderOnly={{true}}>
         <:label>{{t "pages.campaigns-list.action.campaign.label"}}</:label>
+        <:on>{{t "pages.campaigns-list.action.campaign.ongoing"}}</:on>
+        <:off>{{t "pages.campaigns-list.action.campaign.archived"}}</:off>
       </PixToggle>
     </PixFilterBanner>
   </template>

orga/app/components/dropdown/icon-trigger.hbs

@@ -1,6 +1,6 @@
 <div id="icon-trigger" class="dropdown" ...attributes>
   <PixIconButton
-    @icon={{@icon}}
+    @iconName={{@icon}}
     aria-label="{{@ariaLabel}}"
     class="{{@dropdownButtonClass}}"
     @triggerAction={{this.toggle}}

orga/app/components/language-switcher.hbs

@@ -1,7 +1,7 @@
 <PixSelect
   @id="language-switcher"
   @screenReaderOnly={{true}}
-  @icon="earth-europe"
+  @iconName="globe"
   @value={{this.selectedLanguage}}
   @options={{this.availableLanguages}}
   @onChange={{this.onChange}}

orga/app/components/organization-learner/activity.hbs

@@ -5,8 +5,7 @@
       <PixIndicatorCard
         @title={{t "pages.organization-learner.activity.cards.title.assessment"}}
         @color="purple"
-        @icon="tachometer"
-        @iconPrefix="fapix"
+        @iconName="speed"
       >
         <:default>{{this.assessmentStatistics.total}}</:default>
         <:sub>
@@ -23,8 +22,7 @@
       <PixIndicatorCard
         @title={{t "pages.organization-learner.activity.cards.title.profiles-collection"}}
         @color="blue"
-        @icon="person-export"
-        @iconPrefix="fapix"
+        @iconName="profileShare"
       >
         <:default>{{this.profileCollectionsStatistics.total}}</:default>
         <:sub>

orga/app/components/places/statistics.gjs

@@ -3,11 +3,11 @@ import { t } from 'ember-intl';
 
 <template>
   <section class="statistics">
-    <PixIndicatorCard @title={{t "cards.available-seats-count.title"}} @color="success" @icon="users">
+    <PixIndicatorCard @title={{t "cards.available-seats-count.title"}} @color="success" @iconName="users">
       {{@model.available}}
       <span class="statistics__total">{{t "cards.available-seats-count.value" total=@model.total}}</span>
     </PixIndicatorCard>
-    <PixIndicatorCard @title={{t "cards.occupied-seats-count.title"}} @color="warning" @icon="users">
+    <PixIndicatorCard @title={{t "cards.occupied-seats-count.title"}} @color="warning" @iconName="users">
       <:default>
         {{@model.occupied}}
 

orga/app/components/sco-organization-participant/table-row.hbs

@@ -52,7 +52,7 @@
   <td class="organization-participant-list-page__actions hide-on-mobile">
     {{#if @student.isAssociated}}
       <Dropdown::IconTrigger
-        @icon="ellipsis-vertical"
+        @icon="moreVert"
         @dropdownButtonClass="organization-participant-list-page__dropdown-button"
         @dropdownContentClass="organization-participant-list-page__dropdown-content"
         @ariaLabel={{t "pages.sco-organization-participants.actions.show-actions"}}

orga/app/components/sup-organization-participant/table-row.hbs

@@ -47,7 +47,7 @@
   <td class="organization-participant-list-page__actions hide-on-mobile">
     {{#if @isAdminInOrganization}}
       <Dropdown::IconTrigger
-        @icon="ellipsis-vertical"
+        @icon="moreVert"
         @dropdownButtonClass="organization-participant-list-page__dropdown-button"
         @dropdownContentClass="organization-participant-list-page__dropdown-content"
         @ariaLabel={{t "pages.sup-organization-participants.actions.show-actions"}}

orga/app/components/table/header-sort.hbs

@@ -3,7 +3,7 @@
     {{yield}}
     {{#unless @isDisabled}}
       <PixIconButton
-        @icon={{this.icon}}
+        @iconName={{this.icon}}
         @triggerAction={{this.toggleSort}}
         @withBackground={{false}}
         @size="small"

orga/app/components/table/header-sort.js

@@ -14,7 +14,7 @@ export default class HeaderSort extends Component {
     if (!this.args.order) {
       return 'sort';
     }
-    return this.args.order === 'asc' ? 'sort-up' : 'sort-down';
+    return this.args.order === 'asc' ? 'arrowTop' : 'arrowBottom';
   }
 
   get ariaLabel() {

orga/app/components/table/pagination-control.hbs

@@ -26,7 +26,7 @@
       {{/if}}
     </p>
     <PixIconButton
-      @icon="arrow-left"
+      @iconName="arrowLeft"
       aria-label={{t "common.pagination.action.previous"}}
       @triggerAction={{this.goToPreviousPage}}
       @withBackground={{false}}
@@ -40,7 +40,7 @@
       {{t "common.pagination.page-number" current=this.currentPage total=this.pageCount}}
     </p>
     <PixIconButton
-      @icon="arrow-right"
+      @iconName="arrowRight"
       aria-label={{t "common.pagination.action.next"}}
       @triggerAction={{this.goToNextPage}}
       @withBackground={{false}}

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

@@ -9,7 +9,7 @@
         <:triggerElement>
           <PixIconButton
             @ariaLabel={{t "pages.team-invitations.resend-invitation"}}
-            @icon="redo"
+            @iconName="refresh"
             @triggerAction={{fn this.resendInvitation @invitation}}
             @withBackground={{true}}
             disabled={{this.isResending}}
@@ -29,7 +29,7 @@
         <:triggerElement>
           <PixIconButton
             @ariaLabel={{t "pages.team-invitations.cancel-invitation"}}
-            @icon="trash-can"
+            @iconName="delete"
             @triggerAction={{fn @cancelInvitation @invitation}}
             @withBackground={{true}}
           />

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

@@ -8,7 +8,7 @@
       <td class="zone-edit-role hide-on-mobile">
         {{#if this.isNotCurrentUserMembership}}
           <Dropdown::IconTrigger
-            @icon="ellipsis-vertical"
+            @icon="moreVert"
             @dropdownButtonClass="zone-edit-role__dropdown-button"
             @dropdownContentClass="zone-edit-role__dropdown-content"
             @ariaLabel={{t "pages.team-members.actions.manage"}}
@@ -23,7 +23,7 @@
         {{else}}
           {{#if @isMultipleAdminsAvailable}}
             <Dropdown::IconTrigger
-              @icon="ellipsis-vertical"
+              @icon="moreVert"
               @dropdownButtonClass="zone-edit-role__dropdown-button"
               @dropdownContentClass="zone-edit-role__dropdown-content"
               @ariaLabel={{t "pages.team-members.actions.manage"}}
@@ -65,7 +65,7 @@
           {{t "pages.team-members.actions.save"}}
         </PixButton>
         <PixIconButton
-          @icon="xmark"
+          @iconName="close"
           id="cancel-update-organization-role"
           aria-label="{{t 'common.actions.cancel'}}"
           @triggerAction={{this.cancelUpdateRoleOfMember}}

orga/app/components/tube/list.hbs

@@ -23,10 +23,11 @@
     {{/if}}
   </div>
   {{#each this.sortedAreas as |area|}}
-    <PixCollapsible @title="{{area.code}} · {{area.title}}" class="{{area.color}}">
-      {{#each area.sortedCompetences as |competence|}}
-        <h2>{{competence.index}} {{competence.name}}</h2>
-        <div class="panel">
+    <PixCollapsible class="{{area.color}}">
+      <:title>{{area.code}} · {{area.title}}</:title>
+      <:default>
+        {{#each area.sortedCompetences as |competence|}}
+          <h2>{{competence.index}} {{competence.name}}</h2>
           <table class="table content-text content-text--small preselect-tube-table">
             <caption>{{t "pages.preselect-target-profile.table.caption"}}</caption>
             <thead>
@@ -72,8 +73,8 @@
               {{/each}}
             </tbody>
           </table>
-        </div>
-      {{/each}}
+        {{/each}}
+      </:default>
     </PixCollapsible>
 
   {{/each}}

orga/app/components/ui/chevron.hbs

@@ -1,6 +1,6 @@
 <PixIconButton
   aria-label={{@ariaLabel}}
-  @icon="{{if @isOpen 'chevron-up' 'chevron-down'}}"
+  @iconName="{{if @isOpen 'chevronTop' 'chevronBottom'}}"
   aria-expanded="{{@isOpen}}"
   @triggerAction={{@onClick}}
   @withBackground={{false}}

orga/app/components/ui/previous-page-button.hbs

@@ -1,6 +1,6 @@
 <div class="previous-page-button">
   <PixIconButton
-    @icon="arrow-left"
+    @iconName="arrowLeft"
     aria-label={{@backButtonAriaLabel}}
     class="previous-page-button__return-button hide-on-mobile"
     @triggerAction={{this.goToPage}}

orga/package-lock.json

@@ -54,7 +54,7 @@
     "@1024pix/ember-cli-notifications": "^8.0.2",
     "@1024pix/ember-testing-library": "^3.0.6",
     "@1024pix/eslint-config": "^1.3.8",
-    "@1024pix/pix-ui": "^46.15.2",
+    "@1024pix/pix-ui": "^47.2.0",
     "@1024pix/stylelint-config": "^5.1.20",
     "@babel/eslint-parser": "^7.19.1",
     "@babel/plugin-proposal-decorators": "^7.20.13",

orga/package.json

@@ -100,7 +100,7 @@ module('Acceptance | Campaign Activity', function (hooks) {
       // when
       const screen = await visit('/campagnes/1');
 
-      await click(screen.getByLabelText('Supprimer la participation'));
+      await click(screen.getByRole('button', { name: /Supprimer la participation/ }));
 
       await screen.findByRole('dialog');
 
@@ -121,7 +121,7 @@ module('Acceptance | Campaign Activity', function (hooks) {
       );
 
       const screen = await visit('/campagnes/1');
-      await click(screen.getByLabelText('Supprimer la participation'));
+      await click(screen.getByRole('button', { name: /Supprimer la participation/ }));
 
       await screen.findByRole('dialog');
 

orga/tests/acceptance/campaign-activity-test.js

@@ -1,6 +1,7 @@
 import { render } from '@1024pix/ember-testing-library';
 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 setupIntlRenderingTest from '../../../../helpers/setup-intl-rendering';
@@ -58,7 +59,7 @@ module('Integration | Component | Campaign::Analysis::TubeRecommendationRow', fu
     );
 
     // when
-    await click('[data-icon="chevron-down"]');
+    await click(screen.getByLabelText(t('pages.campaign-review.table.analysis.column.tutorial.aria-label')));
 
     // then
     assert.dom('tr[aria-hidden="false"]').containsText('1 tuto recommandé par la communauté Pix');
@@ -93,10 +94,12 @@ module('Integration | Component | Campaign::Analysis::TubeRecommendationRow', fu
     // given
     this.tubeRecommendation.tutorials = [tutorial1, tutorial2];
 
-    await render(hbs`<Campaign::Analysis::TubeRecommendationRow @tubeRecommendation={{this.tubeRecommendation}} />`);
+    const screen = await render(
+      hbs`<Campaign::Analysis::TubeRecommendationRow @tubeRecommendation={{this.tubeRecommendation}} />`,
+    );
 
     // when
-    await click('[data-icon="chevron-down"]');
+    await click(screen.getByLabelText(t('pages.campaign-review.table.analysis.column.tutorial.aria-label')));
 
     // then
     assert.dom('[aria-hidden="false"]').containsText('2 tutos recommandés par la communauté Pix');
@@ -106,11 +109,13 @@ module('Integration | Component | Campaign::Analysis::TubeRecommendationRow', fu
     // given
     this.tubeRecommendation.tutorials = [tutorial1, tutorial2];
 
-    await render(hbs`<Campaign::Analysis::TubeRecommendationRow @tubeRecommendation={{this.tubeRecommendation}} />`);
-    await click('[data-icon="chevron-down"]');
+    const screen = await render(
+      hbs`<Campaign::Analysis::TubeRecommendationRow @tubeRecommendation={{this.tubeRecommendation}} />`,
+    );
+    await click(screen.getByLabelText(t('pages.campaign-review.table.analysis.column.tutorial.aria-label')));
 
     // when
-    await click('[data-icon="chevron-up"]');
+    await click(screen.getByLabelText(t('pages.campaign-review.table.analysis.column.tutorial.aria-label')));
 
     // then
     assert.dom('[aria-hidden="false"]').doesNotExist();

orga/tests/integration/components/campaign/analysis/tube-recommendation-row-test.js

@@ -25,11 +25,15 @@ module('Integration | Component | Tables | header-sort', function (hooks) {
 
   module('When header sort is enabled', function () {
     test('should display sort-icon', async function (assert) {
+      // given
+      this.set('defaultLabel', 'mon-label');
       // when
-      await render(hbs`<Table::HeaderSort @isDisabled={{false}}>Header</Table::HeaderSort>`);
+      const screen = await render(
+        hbs`<Table::HeaderSort @isDisabled={{false}} @ariaLabelDefaultSort={{this.defaultLabel}}>Header</Table::HeaderSort>`,
+      );
 
       // then
-      assert.dom('[data-icon="sort"]').exists();
+      assert.ok(screen.getByLabelText('mon-label'));
     });
 
     test('it call onSort with "asc" when no order is given', async function (assert) {