[TECH] Montée de version d'Ember pour Pix Certif de la 3.18 à 3.21 (P…

…IX-1302)

certif/app/adapters/application.js

@@ -1,4 +1,5 @@
 import JSONAPIAdapter from '@ember-data/adapter/json-api';
+// eslint-disable-next-line ember/no-mixins
 import DataAdapterMixin from 'ember-simple-auth/mixins/data-adapter-mixin';
 import { inject as service } from '@ember/service';
 import ENV from 'pix-certif/config/environment';

certif/app/app.js

@@ -1,7 +1,7 @@
 import Application from '@ember/application';
 import Resolver from 'ember-resolver';
 import loadInitializers from 'ember-load-initializers';
-import config from './config/environment';
+import config from 'pix-certif/config/environment';
 
 export default class App extends Application {
   modulePrefix = config.modulePrefix;

certif/app/components/certification-candidate-in-staging-item.hbs

@@ -95,7 +95,7 @@
           </button>
       {{/if}}
         <button data-test-id='panel-candidate__action__cancel' class="button button--square button--lightgrey certification-candidates-row-actions__close" type="button" {{on "click" (fn @onClickCancel @candidateData)}}>
-          {{fa-icon "times" class="fa-fw certification-candidates-add-button__icon"}}
+          <FaIcon @icon='times' class='fa-fw certification-candidates-add-button__icon' />
         </button>
     </div>
   </td>

certif/app/components/login-form.hbs

@@ -47,9 +47,9 @@
           />
           <button type="button" aria-label="rendre le mot de passe lisible" class="login-form__icon" {{action 'togglePasswordVisibility'}} >
             {{#if this.isPasswordVisible}}
-              <div tabindex="-1" onmousedown={{this.togglePasswordVisibility}}>{{fa-icon 'eye' class="fa-fw login-form-icon__eye"}}</div>
+              <div tabindex="-1" onmousedown={{this.togglePasswordVisibility}}><FaIcon @icon='eye' class="fa-fw login-form-icon__eye" /></div>
             {{else}}
-              <div tabindex="-1" onmousedown={{this.togglePasswordVisibility}}>{{fa-icon 'eye-slash' class="fa-fw login-form-icon__eye"}}</div>
+              <div tabindex="-1" onmousedown={{this.togglePasswordVisibility}}><FaIcon @icon='eye-slash' class="fa-fw login-form-icon__eye" /></div>
             {{/if}}
           </button>
         </div>

certif/app/components/no-session-panel.hbs

@@ -6,7 +6,7 @@
     <div class="no-session-panel__link-to-create">
       <LinkTo @route="authenticated.sessions.new" class="button button--link button--with-icon">
         Créer une session
-        {{fa-icon 'plus'}}
+        <FaIcon @icon='plus' />
       </LinkTo>
     </div>
   </div>

certif/app/components/session-finalization-formbuilder-link-step.hbs

@@ -4,7 +4,7 @@
   </div>
   <div class="session-finalization-formbuilder-link-step__link">
     <a href={{this.formBuilderLinkUrl}} target="_blank" rel="noopener noreferrer" >
-      {{fa-icon 'arrow-right'}} Formulaire 123formbuilder
+      <FaIcon @icon='arrow-right' /> Formulaire 123formbuilder
     </a>
   </div>
 </div>

certif/app/controllers/authenticated/sessions/list.js

@@ -1,15 +1,15 @@
 import Controller from '@ember/controller';
 import { action } from '@ember/object';
-import { notEmpty } from '@ember/object/computed';
-import { sort } from '@ember/object/computed';
+import { notEmpty, sort } from '@ember/object/computed';
 
 const SORTING_ORDER = ['date:desc', 'time:desc'];
 
 export default class SessionsListController extends Controller {
   sortingOrder = SORTING_ORDER;
 
   @notEmpty('model') hasSession;
-  @sort('model', 'sortingOrder') sortedSessions;
+
+  @sort('model.[]', 'sortingOrder') sortedSessions;
 
   @action
   goToDetails(session) {

certif/app/models/certification-candidate.js

@@ -1,5 +1,4 @@
-import DS from 'ember-data';
-const { Model, attr } = DS;
+import Model, { attr } from '@ember-data/model';
 
 export default class CertificationCandidate extends Model {
   @attr('string') firstName;

certif/app/models/certification-center-membership.js

@@ -1,6 +1,4 @@
-import DS from 'ember-data';
-
-const { Model, belongsTo } = DS;
+import Model, { belongsTo } from '@ember-data/model';
 
 export default class CertificationCenterMembership extends Model {
   @belongsTo('user') user;

certif/app/models/certification-center.js

@@ -1,8 +1,6 @@
-import DS from 'ember-data';
+import Model, { attr, hasMany } from '@ember-data/model';
 import { equal } from '@ember/object/computed';
 
-const { Model, attr, hasMany } = DS;
-
 export default class CertificationCenter extends Model {
   @attr('string') name;
   @attr('string') type;

certif/app/models/certification-report.js

@@ -1,6 +1,4 @@
-import DS from 'ember-data';
-
-const { Model, attr } = DS;
+import Model, { attr } from '@ember-data/model';
 
 export default class CertificationReport extends Model {
   @attr('number') certificationCourseId;

certif/app/models/session.js

@@ -1,10 +1,8 @@
-import DS from 'ember-data';
+import Model, { attr, belongsTo, hasMany } from '@ember-data/model';
 import { computed } from '@ember/object';
 import { inject as service } from '@ember/service';
 import ENV from 'pix-certif/config/environment';
 
-const { Model, attr, belongsTo, hasMany } = DS;
-
 export const CREATED = 'created';
 export const FINALIZED = 'finalized';
 export const IN_PROCESS = 'in_process';
@@ -43,9 +41,9 @@ export default class Session extends Model {
     return this.certificationCandidates.isAny('isLinked');
   }
 
-  @computed('id')
+  @computed('id', 'session.data.authenticated.access_token')
   get urlToDownload() {
-    return `${ENV.APP.API_HOST}/api/sessions/${this.id}/attendance-sheet?accessToken=${this.get('session.data.authenticated.access_token')}`;
+    return `${ENV.APP.API_HOST}/api/sessions/${this.id}/attendance-sheet?accessToken=${this.session.data.authenticated.access_token}`;
   }
 
   @computed('id')

certif/app/models/user.js

@@ -1,6 +1,4 @@
-import DS from 'ember-data';
-
-const { Model, attr, hasMany } = DS;
+import Model, { attr, hasMany } from '@ember-data/model';
 
 export default class User extends Model {
   @attr('string') firstName;

certif/app/router.js

@@ -1,5 +1,5 @@
 import EmberRouter from '@ember/routing/router';
-import config from './config/environment';
+import config from 'pix-certif/config/environment';
 
 const Router = EmberRouter.extend({
   location: config.locationType,

certif/app/routes/application.js

@@ -1,5 +1,6 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
+// eslint-disable-next-line ember/no-mixins
 import ApplicationRouteMixin from 'ember-simple-auth/mixins/application-route-mixin';
 
 export default class ApplicationRoute extends Route.extend(ApplicationRouteMixin) {

certif/app/routes/authenticated.js

@@ -1,4 +1,5 @@
 import Route from '@ember/routing/route';
+// eslint-disable-next-line ember/no-mixins
 import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';
 import { inject as service } from '@ember/service';
 

certif/app/routes/login.js

@@ -1,4 +1,5 @@
 import Route from '@ember/routing/route';
+// eslint-disable-next-line ember/no-mixins
 import UnauthenticatedRouteMixin from 'ember-simple-auth/mixins/unauthenticated-route-mixin';
 
 export default class LoginRoute extends Route.extend(UnauthenticatedRouteMixin) {

certif/app/routes/logout.js

@@ -6,7 +6,7 @@ export default class LogoutRoute extends Route {
 
   beforeModel() {
     super.beforeModel(...arguments);
-    if (this.get('session.isAuthenticated')) {
+    if (this.session.isAuthenticated) {
       this.session.invalidate();
     }
   }

certif/app/routes/terms-of-service.js

@@ -1,4 +1,5 @@
 import Route from '@ember/routing/route';
+// eslint-disable-next-line ember/no-mixins
 import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';
 import { inject as service } from '@ember/service';
 

certif/app/templates/authenticated/sessions/details/certification-candidates.hbs

@@ -2,13 +2,13 @@
   <div class="content-text context-text--small">
     <div class="panel-actions__header">
       <div class="panel-actions__header-icon">
-        {{fa-icon "info"}}
+        <FaIcon @icon="info" />
       </div>
       <div class="panel-actions__header-title">Ajouter des candidats</div>
     </div>
     <div class="panel-actions__action-row">
       <div class="panel-actions__action-icon">
-        {{fa-icon "file-download"}}
+        <FaIcon @icon="file-download" />
       </div>
       <div class="panel-actions__description">
         <div class="panel-actions__title">Télécharger le PV de session</div>
@@ -20,14 +20,14 @@
         <a data-test-id="attendance_sheet_download_button"
            class="button button--link button--with-icon"
            href="{{this.currentSession.urlToDownload}}" target="_blank" rel="noopener noreferrer" download>
-            Télécharger (.ods){{fa-icon 'file-download'}}
+            Télécharger (.ods)<FaIcon @icon='file-download' />
         </a>
       </div>
     </div>
     <div class="panel-actions__action-row">
       {{#if this.importAllowed}}
         <div class="panel-actions__action-icon">
-          {{fa-icon "cloud-upload-alt"}}
+          <FaIcon @icon="cloud-upload-alt" />
         </div>
         <div class="panel-actions__description">
           <div class="panel-actions__title">Importer le PV de session</div>
@@ -45,13 +45,13 @@
                 class="button button--with-icon"
                 role="button"
                 tabindex="0">
-            Importer (.ods){{fa-icon 'cloud-upload-alt'}}
+            Importer (.ods)<FaIcon @icon='cloud-upload-alt' />
           </span>
           </FileUpload>
         </div>
       {{else}}
         <div class="panel-actions__action-icon">
-          {{fa-icon 'exclamation-circle' class="panel-actions__warning-icon"}}
+          <FaIcon @icon='exclamation-circle' class="panel-actions__warning-icon" />
         </div>
         <div class="panel-actions__description">
           <strong class="panel-actions__warning">
@@ -76,7 +76,7 @@
           Ajouter un candidat
       </div>
       <button type="button" class="button button--square button--lightgrey">
-        {{fa-icon "plus" class="fa-fw certification-candidates-add-button__icon"}}
+        <FaIcon @icon="plus" class="fa-fw certification-candidates-add-button__icon" />
       </button>
     </div>
   </div>
@@ -156,7 +156,7 @@
                           data-test-id="panel-candidate__actions__delete__{{candidate.id}}"
                           type="button"
                           class="button button--square button--lightgrey button--lightgrey--disabled certification-candidates-actions__delete__button--disabled" >
-                        {{fa-icon "trash-alt" class="fa-fw"}}
+                        <FaIcon @icon="trash-alt" class="fa-fw" />
                       </button>
                       <div class="certification-candidates-actions__delete__tooltip">
                         Ce candidat a déjà rejoint la session. Vous ne pouvez pas le supprimer.
@@ -167,7 +167,7 @@
                           type="button"
                           class="button button--square button--lightgrey certification-candidates-actions__delete__button"
                           {{on 'click' (fn this.deleteCertificationCandidate candidate)}} >
-                        {{fa-icon "trash-alt" class="fa-fw"}}
+                        <FaIcon @icon='trash-alt' class='fa-fw' />
                       </button>
                     {{/if}}
                   </div>

certif/app/templates/authenticated/sessions/details/parameters.hbs

@@ -28,8 +28,8 @@
         {{#if (is-clipboard-supported)}}
             <div class="tooltip">
                 <span class="tooltip__text tooltip-text session-details-content__tooltip-text">{{this.tooltipText}}</span>
-                <CopyButton @clipboardText={{this.session.accessCode}} @success={{this.clipboardSuccess}} @mouseLeave={{this.clipboardOut}} @classNames="icon-button session-details-content__clipboard-button">
-                  {{fa-icon 'copy' prefix='far'}}
+                <CopyButton @clipboardText={{this.session.accessCode}} @success={{this.clipboardSuccess}} {{on 'mouseLeave' this.clipboardOut}} @classNames="icon-button session-details-content__clipboard-button">
+                  <FaIcon @icon='copy' prefix='far' />
                 </CopyButton>
             </div>
         {{/if}}

certif/app/templates/authenticated/sessions/list.hbs

@@ -8,7 +8,7 @@
       <div class="session-list__header">
           <LinkTo @route="authenticated.sessions.new" class="button button--link button--with-icon">
             Créer une session
-            {{fa-icon 'plus'}}
+            <FaIcon @icon='plus'/>
           </LinkTo>
       </div>
 

certif/config/ember-cli-update.json

@@ -0,0 +1,20 @@
+{
+  "schemaVersion": "1.0.0",
+  "packages": [
+    {
+      "name": "ember-cli",
+      "version": "3.21.2",
+      "blueprints": [
+        {
+          "name": "app",
+          "outputRepo": "https://github.com/ember-cli/ember-new-output",
+          "codemodsSource": "ember-app-codemods-manifest@1",
+          "isBaseBlueprint": true,
+          "options": [
+            "--no-welcome"
+          ]
+        }
+      ]
+    }
+  ]
+}

certif/mirage/config.js

@@ -103,7 +103,7 @@ export default function() {
   });
 
   this.get('/users/me', (schema, request) => {
-    const userToken = request.requestHeaders.authorization.replace('Bearer ', '');
+    const userToken = request.requestHeaders['Authorization'].replace('Bearer ', '');
     const userId = JSON.parse(atob(userToken.split('.')[1])).user_id;
 
     return schema.users.find(userId);