Mise à jour de la version 2.1.0 vers la version 2.x.x

Documentation en cours de rédaction

Suppression du module cards

Le module cards qui affichait un portefeuille avec la carte étudiante de l'établissement et la carte étudiante européenne a été retiré au profit de 2 modules indépendants card et card-eu.

Frontend

Configuration

Si vous utilisiez le module cards auparavant, il est nécessaire de retirer ses instances dans les fichiers de configuration du client.

dev/user-frontend-ionic/angular.json

-	"cards": {
-      "projectType": "library",
-      "root": "projects/cards",
-      "sourceRoot": "projects/cards/src",
-      "prefix": "lib",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
-          "options": {
-            "project": "projects/cards/ng-package.json"
-          },
-          "configurations": {
-            "production": {
-              "tsConfig": "projects/cards/tsconfig.lib.prod.json"
-            },
-            "development": {
-              "tsConfig": "projects/cards/tsconfig.lib.json"
-            }
-          },
-          "defaultConfiguration": "production"
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "main": "projects/cards/src/test.ts",
-            "tsConfig": "projects/cards/tsconfig.spec.json",
-            "karmaConfig": "projects/cards/karma.conf.js"
-          }
-        },
-        "lint": {
-          "builder": "@angular-eslint/builder:lint",
-          "options": {
-            "lintFilePatterns": [
-              "projects/cards/**/*.ts",
-              "projects/cards/**/*.html"
-            ]
-          }
-        }
-      }
-    },

dev/user-frontend-ionic/src/environments/environment.ts

import { AppUpdateModule } from '@multi/app-update';
import { AuthModule } from '@multi/auth';
import { CalendarModule } from '@multi/calendar';
- import { CardsPageModule } from '@multi/cards';
import { ChatbotModule } from '@multi/chatbot';
import { ClockingModule } from '@multi/clocking';

dev/user-frontend-ionic/src/environments/environment.ts

    numberOfEventsLimit: 3,
    display: 'list',
}),
- CardsPageModule.forRoot({ knownErrors: ['NO_PHOTO', 'NO_ACTIVE_CARD', 'UNPAID_FEES'] }),
ChatbotModule,
ClockingModule,

Styles et thèmes

Vous pouvez supprimer le dossier des styles associé au module cards : dev/user-frontend-ionic/src/theme/app-theme/styles/cards/*

Traduction

Vous pouvez supprimer le dossier des fichiers de traduction associé au module cards : dev/user-frontend-ionic/src/theme/app-theme/i18n/modules/cards/*

Autres

Si vous affichez la fonctionnalité des cartes dans votre tour guidé, pensez à modifier l'identifiant de cette fonctionnalité

dev/user-frontend-ionic/src/theme/app-theme/guided-tour/src/lib/config/logged-guided-tour.config.ts

{
    id: 'logged-step-80',
    attachTo: {
-       element: '[data-menu-id="cards"]',
+       element: '[data-menu-id="card"]',
        on: 'top'
    },
buttons: [

Ainsi que les fichiers de traduction du tour guidé

dev/user-frontend-ionic/src/theme/app-theme/i18n/modules/guided-tour/fr.json

    "MESSAGE": "Vous pouvez également filtrer les services grâce à une recherche."
},
"STEP_80" : {
-    "MESSAGE": "Vous trouverez ici une version dématérialisée de vos cartes d'étudiant ou de personnel."
+    "MESSAGE": "Vous trouverez ici une version dématérialisée de votre carte d'étudiant ou de personnel."
},
"STEP_90" : {
    "MESSAGE": "Le chatbot se chargera de répondre à vos questions concernant votre compte informatique, votre connexion ou votre emploi du temps."

dev/user-frontend-ionic/src/theme/app-theme/i18n/modules/guided-tour/en.json

    "MESSAGE": "You can also filter services through a search."
},
"STEP_80" : {
-    "MESSAGE": "Here you will find a dematerialized version of your student or staff cards"
+    "MESSAGE": "Here you will find a dematerialized version of your student or staff card"
},
"STEP_90" : {
    "MESSAGE": "The chatbot will take care of answering your questions about your computer account, your connection or your schedule."

Backend

dev/user-backend-nest/main

Supprimer les informations de connexion au microservice cards dans le fichier .env du microservice main

dev/user-backend-nest/main/.env

AUTH_SERVICE_NATS_SERVERS=nats://localhost:4222
AUTH_SERVICE_JWT_SECRET=

- CARDS_SERVICE_NATS_SERVERS=nats://localhost:4222

dev/user-backend-nest/cards

Vous pouvez supprimer tout ce qui concerne l'ancien microservice cards (dossiers et fichiers qu'il contient)

Nouveau module card-eu (carte étudiante européenne)

Frontend

Configuration

Pour ajouter le module card-eu permettant l'affichage de la carte étudiante européenne, il est nécessaire de l'ajouter au niveau des fichiers de configuration du client.

dev/user-frontend-ionic/angular.json

+ "card-eu": {
+    "projectType": "library",
+    "root": "projects/card-eu",
+    "sourceRoot": "projects/card-eu/src",
+    "prefix": "lib",
+    "architect": {
+        "build": {
+            "builder": "@angular-devkit/build-angular:ng-packagr",
+             "options": {
+                 "project": "projects/card-eu/ng-package.json"
+              },
+              "configurations": {
+                  "production": {
+                      "tsConfig": "projects/card-eu/tsconfig.lib.prod.json"
+                  },
+                  "development": {
+                      "tsConfig": "projects/card-eu/tsconfig.lib.json"
+                  }
+              },
+              "defaultConfiguration": "production"
+          },
+          "test": {
+              "builder": "@angular-devkit/build-angular:karma",
+              "options": {
+                  "main": "projects/card-eu/src/test.ts",
+                  "tsConfig": "projects/card-eu/tsconfig.spec.json",
+                  "karmaConfig": "projects/card-eu/karma.conf.js"
+              }
+          },
+          "lint": {
+              "builder": "@angular-eslint/builder:lint",
+              "options": {
+                  "lintFilePatterns": [
+                      "projects/card-eu/**/*.ts",
+                      "projects/card-eu/**/*.html"
+                  ]
+              }
+          }
+      }
+  },

dev/user-frontend-ionic/src/environments/environment.ts

import { AppUpdateModule } from '@multi/app-update';
import { AuthModule } from '@multi/auth';
import { CalendarModule } from '@multi/calendar';
+ import { CardEuPageModule } from '@multi/card-eu';
import { ChatbotModule } from '@multi/chatbot';
import { ClockingModule } from '@multi/clocking';

dev/user-frontend-ionic/src/environments/environment.ts

    numberOfEventsLimit: 3,
    display: 'list',
}),
+ CardEuPageModule.forRoot({
+     knownErrors: ['NO_PHOTO', 'NO_ACTIVE_CARD', 'ESCN_MISSING'],
+     display: 'extended',
+ }),
ChatbotModule,
ClockingModule,

Ce nouveau module permet l'affichage de la carte étudiante européenne selon 2 formats

Affichage light (connecteur non nécessaire)	Affichage extended (connecteur nécessaire)

Pour utiliser l'affichage light, il suffit de passer l'option 'light' à l'attribut display dans le fichier environment.ts

Pour que l'affichage light fonctionne, il est impératif que votre connecteur / provider qui fournit les informations de l'utilisateur qui se connecte renvoie l'identifiant européen de l'étudiant (escn)
cf. https://www.esup-portail.org/wiki/x/C4D4Tw

Pour utiliser l'affichage extended, il suffit de passer l'option 'extended' à l'attribut display dans le fichier environment.ts

Pour que l'affichage extended fonctionne, vous devez fournir un connecteur qui renverra les informations supplémentaires qui ne sont pas retournées par l'API des cartes européenne (par exemple la photo de l'utilisateur)
cf. https://www.esup-portail.org/wiki/x/PYC3YQ

Styles et thèmes

Les assets de la carte européenne (logos, ...) ont été déplacés dans le dossier user-frontend-ionic/src/theme/app-theme/assets/cards/card-eu/ (initialement dans user-frontend-ionic/src/theme/app-theme/assets/cards/)

Copiez le dossier des styles associé au module card-eu :

$ cp -Ra /dev/user-frontend-ionic/src/theme/app-theme-dist/styles/card-eu /dev/user-frontend-ionic/src/theme/app-theme/styles/card-eu

Traduction

Ajoutez le dossier des fichiers de traduction associé au module card-eu : dev/user-frontend-ionic/src/theme/app-theme/i18n/modules/card-eu/*

Backend

dev/user-backend-nest/main

Ajouter les informations de connexion au microservice card-eu dans le fichier .env du microservice main

dev/user-backend-nest/main/.env

AUTH_SERVICE_NATS_SERVERS=nats://localhost:4222
AUTH_SERVICE_JWT_SECRET=

+ CARD_EU_SERVICE_NATS_SERVERS=nats://localhost:4222

dev/user-backend-nest/microservices/card-eu

Si vous souhaitez utiliser la fonctionnalité des cartes étudiantes européennes, il est nécessaire de configurer le microservice correspondant.

dev/user-backend-nest/microservices/card-eu/.env

+ CARD_EU_SERVICE_HOST=localhost
+ CARD_EU_SERVICE_PORT=3020
+ CARD_EU_SERVICE_NATS_SERVERS=nats://localhost:4222

+ # Infos de connexion au connecteur fournissant les informations pour l'affichage de la carte dématérialisée
+ CARD_EU_SERVICE_PROVIDER_API_URL=http://localhost:3099/mocking/card-eu/{username}/extended
+ CARD_EU_SERVICE_PROVIDER_API_BEARER_TOKEN=

+ CARD_EU_SERVICE_PROVIDER_API_LIGHT_URL=https://router.europeanstudentcard.eu/esc-rest/api/v2/cards/{escn}
+ CARD_EU_SERVICE_PROVIDER_API_LIGHT_BEARER_TOKEN=

CARD_EU_SERVICE_PROVIDER_API_URL et CARD_EU_SERVICE_PROVIDER_API_BEARER_TOKEN ne sont nécessaires que si vous souhaitez utiliser l'affichage étendu de la carte
CARD_EU_SERVICE_PROVIDER_API_LIGHT_URL et CARD_EU_SERVICE_PROVIDER_API_LIGHT_BEARER_TOKEN ne sont nécessaires que si vous souhaitez utiliser l'affichage light de la carte

Pour plus d'informations, se reporter à la configuration de la fonctionnalité card-eu côté client

Nouveau module card (carte d'établissement dématérialisée)

Frontend

Configuration

Pour ajouter le module card permettant l'affichage de la carte de l'établissement dématérialisée, il est nécessaire de l'ajouter au niveau des fichiers de configuration du client.

dev/user-frontend-ionic/angular.json

+ "card": {
+    "projectType": "library",
+    "root": "projects/card",
+    "sourceRoot": "projects/card/src",
+    "prefix": "lib",
+    "architect": {
+        "build": {
+            "builder": "@angular-devkit/build-angular:ng-packagr",
+             "options": {
+                 "project": "projects/card/ng-package.json"
+              },
+              "configurations": {
+                  "production": {
+                      "tsConfig": "projects/card/tsconfig.lib.prod.json"
+                  },
+                  "development": {
+                      "tsConfig": "projects/card/tsconfig.lib.json"
+                  }
+              },
+              "defaultConfiguration": "production"
+          },
+          "test": {
+              "builder": "@angular-devkit/build-angular:karma",
+              "options": {
+                  "main": "projects/card/src/test.ts",
+                  "tsConfig": "projects/card/tsconfig.spec.json",
+                  "karmaConfig": "projects/card/karma.conf.js"
+              }
+          },
+          "lint": {
+              "builder": "@angular-eslint/builder:lint",
+              "options": {
+                  "lintFilePatterns": [
+                      "projects/card/**/*.ts",
+                      "projects/card/**/*.html"
+                  ]
+              }
+          }
+      }
+  },

dev/user-frontend-ionic/src/environments/environment.ts

import { AppUpdateModule } from '@multi/app-update';
import { AuthModule } from '@multi/auth';
import { CalendarModule } from '@multi/calendar';
+ import { CardPageModule } from '@multi/card';
import { CardEuPageModule } from '@multi/card-eu';
import { ChatbotModule } from '@multi/chatbot';
import { ClockingModule } from '@multi/clocking';

dev/user-frontend-ionic/src/environments/environment.ts

    numberOfEventsLimit: 3,
    display: 'list',
}),
+ CardPageModule.forRoot({ knownErrors: ['NO_PHOTO', 'NO_ACTIVE_CARD', 'UNPAID_FEES'] }),
CardEuPageModule.forRoot({
    knownErrors: ['NO_PHOTO', 'NO_ACTIVE_CARD', 'ESCN_MISSING'],
    display: 'extended',
}),
ChatbotModule,
ClockingModule,

Styles et thèmes

Les assets de la carte de l'établissement (logos, ...) ont été déplacés dans le dossier user-frontend-ionic/src/theme/app-theme/assets/cards/card/ (initialement dans user-frontend-ionic/src/theme/app-theme/assets/cards/)

Copiez le dossier des styles associé au module card :

$ cp -Ra /dev/user-frontend-ionic/src/theme/app-theme-dist/styles/card /dev/user-frontend-ionic/src/theme/app-theme/styles/card

Traduction

Ajoutez le dossier des fichiers de traduction associé au module card : dev/user-frontend-ionic/src/theme/app-theme/i18n/modules/card/*

Backend

dev/user-backend-nest/main

Ajouter les informations de connexion au microservice card dans le fichier .env du microservice main

dev/user-backend-nest/main/.env

AUTH_SERVICE_NATS_SERVERS=nats://localhost:4222
AUTH_SERVICE_JWT_SECRET=

CARD_EU_SERVICE_NATS_SERVERS=nats://localhost:4222
+ CARD_SERVICE_NATS_SERVERS=nats://localhost:4222

dev/user-backend-nest/microservices/card

Si vous souhaitez utiliser la fonctionnalité de la carte établissement dématérialisée, il est nécessaire de configurer le microservice correspondant.

dev/user-backend-nest/microservices/card/.env

+ CARD_SERVICE_HOST=localhost
+ CARD_SERVICE_PORT=3007
+ CARD_SERVICE_NATS_SERVERS=nats://localhost:4222

+ # Infos de connexion au connecteur fournissant les informations pour l'affichage de la carte dématérialisée
+ CARD_SERVICE_PROVIDER_API_URL=http://localhost:3099/mocking/card/{username}
+ CARD_SERVICE_PROVIDER_API_BEARER_TOKEN=

Plan : remplacement du fichier statique des POIs par l'utilisation du CMS

Frontend

Le module Map a été revu pour afficher de nouveaux éléments, il est donc nécessaire d'installer les nouvelles dépendances et de rebuild le module map.

$ cd dev/user-frontend-ionic && npm ci
$ npm run module:build-all

dev/user-frontend-ionic/src/environment.ts

+ MapModule.forRoot({
+   mapType: "osm",
+   accessToken: "",
+   minZoom: 1,
+   maxZoom: 19,
+   maxBounds: false,
+   highAccuracy: false,
+   maxDisplayedFloatingButton: 5
+ }),

defaultMapLocation.longitude : Longitude de la position par défaut sur la carte.
defaultMapLocation.latitude : Latitude de la position par défaut sur la carte.
mapType : ("mapbox" | "osm") : Le fond de carte qui sera utilisé, par défaut il s'agit d'Open Street Map.
accessToken : En cas d'utilisation de Mapbox il faut un token d'accès, lié à un compte Mapbox.
minZoom : Zoom minimum autorisé.
maxZoom : Zoom maximum autorisé.
maxBounds : Lorsque cette option est définie sur true, la carte restreint la vue aux limites géographiques données, faisant rebondir l'utilisateur lorsqu'il essaie de se déplacer en dehors de la vue.
highAccuracy : Indique que l'application souhaite recevoir les meilleurs résultats possibles. Définie sur true et si l'appareil est capable de fournir une position plus précise, il le fera. Notez que cela peut entraîner des temps de réponse plus lents ou une consommation électrique accrue.
maxDisplayedFloatingButton : Nombre maximum de campus affichés à l'écran sous forme de bouton flottant avant de passer sur l'affichage d'une liste

Backend

dev/user-backend-nest/microservices/map

Les POIs sont à présent chargés depuis le CMS, et non plus depuis le fichier statique map-data.json. En plus des POIs et de leur catégorie respective, les icônes sont gérées par le back, et la notion de campus a été ajoutée.

Vous pouvez supprimer le fichier map-data.json

De nouvelles variables sont à ajouter dans l'environnement du microservice :

dev/user-backend-nest/microservices/map/.env

+ # Infos de connexion au connecteur fournissant les données
+ MAP_SERVICE_CMS_CONNECTOR_API_URL=
+ MAP_SERVICE_CMS_CONNECTOR_API_BEARER_TOKEN=

Si vous souhaitez ajouter une 2e source de données, vous pouvez ajouter et compléter les variables suivantes. Dans cet exemple, la seconde source est le mock.

dev/user-backend-nest/microservices/map/.env

+ # Provider additionel
+ MAP_SERVICE_ADDITIONAL_PROVIDER_API_URL=http://localhost:3099/mocking/map
+ MAP_SERVICE_ADDITIONAL_PROVIDER_API_BEARER_TOKEN=

Connecteur CMS

Une nouvelle variable a été ajoutée à la config du connecteur pour ces nouvelles collections. Ajoutez dans votre .env :

dev/connectors/multi-cms-connector/.env

+ # Map points - 1 jour par défaut
+ CACHE_TTL_MAP_POINTS=86400000

CMS

Directus

Documentation de l'API Directus : https://directus.io/docs/api/schema

Sauvegardez vos collections par sécurité.

Identifiez les différences dans le schéma par rapport à la nouvelle version :

curl --location 'localhost:8055/schema/diff?force=true' \
--header 'Authorization: Bearer <votre jeton directus>' \
--form 'file=@"~/multi/env/local/docker/directus/directus/snapshot/snapshot.yaml"'

Retirez les collections et les fields qui ne concernent pas campus ; map_categories ; map_categories_translations ; map_icons ; map_points ; map_points_translations.

Appliquez les changements :

curl --location 'localhost:8055/schema/apply' \
--header 'Content-Type: application/json' \
--header 'Authorization: Bearer <votre jeton directus>' \
--data '{
    "hash": "...",
    "diff": { ... }
}'

Redémarrez Directus.
Complétez les nouvelles collections.

WordPress

Mettez à jour l'extension WordPress Multi Wordpress Config (désactiver puis réactiver le plugin est nécessaire pour faire apparaitre les nouvelles collections)
Dans Polylang (Langues > Réglages > Types de publication personnalisés et taxonomies), activer la traduction pour Points sur la carte (map_points) et Catégories de points (map_categories)
Ajout des nouveaux hooks : un seul hook par action, sur la route /cache/clear/map-points, mais en sélectionnant dans la config de WP Webhooks les 4 pods : Campus ; Catégorie de point ; Icône carte ; Point sur la carte.
Une nouvelle entrée est apparue dans le menu latéral : Cartes. Vous pouvez configurer les campus, les catégories de points, les icônes, et enfin créer les points.

Arborescence des pages

Pages Accueil Guides de mise à jour Mise à jour de la version 2.1.0 vers la version 2.x.x

Suppression du module cards

Frontend

Configuration

Styles et thèmes

Traduction

Autres

Backend

dev/user-backend-nest/main

dev/user-backend-nest/cards

Nouveau module card-eu (carte étudiante européenne)

Frontend

Configuration

Styles et thèmes

Traduction

Backend

dev/user-backend-nest/main

dev/user-backend-nest/microservices/card-eu

Nouveau module card (carte d'établissement dématérialisée)

Frontend

Configuration

Styles et thèmes

Traduction

Backend

dev/user-backend-nest/main

dev/user-backend-nest/microservices/card

Plan : remplacement du fichier statique des POIs par l'utilisation du CMS

Frontend

Backend

dev/user-backend-nest/microservices/map

Connecteur CMS

CMS

Directus

WordPress

Pages
Accueil
Guides de mise à jour

Mise à jour de la version 2.1.0 vers la version 2.x.x