#2757 : rest.js

Chaque composant React qui communique avec le backend ProjectForge passe par ce module. Il fournit une fine couche d'abstraction autour de l'API fetch avec construction d'URL tenant compte de l'environnement, authentification par cookie de session (credentials: 'include'), débouncing adaptatif pour les connexions lentes, et gestion des requêtes/réponses JSON. C'est le point de contact unique entre la SPA React et la couche REST Spring Boot — il n'existe aucun autre client HTTP dans le frontend.

Le module construit les URL REST via un pipeline en trois étapes, chacune gérant une préoccupation :

Étape 1 — baseURL : Résout l'origine du serveur. En développement (import.meta.env.DEV), pointe vers http://localhost:8080 — le serveur de développement Spring Boot. En production, retourne une chaîne vide, rendant toutes les URL relatives à l'origine de la page (pas de CORS nécessaire). La garde MODE !== 'test' empêche l'URL du serveur de test de fuiter dans les tests Jest.

Étape 2 — getServiceURL / baseRestURL : Ajoute le préfixe REST. Si l'URL du service commence par / (absolue depuis la racine), utilise baseURL directement. Sinon, utilise baseRestURL qui ajoute /rs — le préfixe standard des endpoints REST de ProjectForge. Cela permet à la fois getServiceURL('/some/path') (absolu) et getServiceURL('user/list') (relatif à /rs).

Étape 3 — evalServiceURL / createQueryParams : Ajoute les paramètres de requête. Filtre les valeurs undefined, encode chaque valeur, et utilise correctement ? vs & selon que l'URL contient déjà une chaîne de requête.

La constante debouncedWaitTime s'adapte en fonction de l'indication client Save-Data (MDN). Lorsque l'utilisateur a activé le mode d'économie de données (courant sur mobile), le temps d'attente passe de 250 ms à 1000 ms — réduisant la fréquence des requêtes sur les connexions facturées. Ceci est utilisé par les composants d'auto-complétion (recherche d'adresse, recherche d'utilisateur, recherche de tâche) pour limiter les appels API pendant la saisie.

La conception est défensive : navigator && navigator.connection && navigator.connection.saveData — trois gardes avant d'accéder à la propriété, car navigator.connection n'est pas disponible dans tous les navigateurs (Firefox, Safari).

Les trois fonctions de fetch utilisent le même modèle de gestion d'erreur : .catch((error) => alert('Erreur interne : ' + error)). La directive /* eslint-disable no-alert */ en haut du fichier reconnaît que alert() est normalement interdit par ESLint mais est intentionnellement utilisé ici comme notification utilisateur de dernier recours.

C'est un compromis délibéré : un système de notification d'erreur approprié (piloté par Redux, compatible i18n) serait une meilleure UX, mais rest.js est au bas du graphe de dépendances — il ne peut pas importer de composants Redux ou React. Utiliser alert() signifie que le gestionnaire d'erreurs a zéro dépendance et fonctionne dans n'importe quel contexte (même en dehors du cycle de vie de React). La directive /* eslint-disable no-alert */ a été ajoutée dans le commit ac30e55f7 pour supprimer l'avertissement de linting concernant ce choix intentionnel.

Tous les appels fetch utilisent credentials: 'include' — cela ordonne au navigateur d'envoyer les cookies de session HTTP-only avec chaque requête. C'est le mécanisme d'authentification standard pour les SPA servies depuis la même origine que l'API. Le cookie de session est défini par le backend Spring Boot lors de la connexion et est automatiquement inclus par le navigateur. Il n'y a pas de gestion de token, pas d'en-tête Authorization, et pas de logique de session côté client — le navigateur gère tout de manière transparente via le flag credentials.

Ce module est importé par pratiquement tous les composants React qui récupèrent des données. Exemples d'utilisation typique :

// Dans un composant React :
import { fetchJsonGet, fetchJsonPost } from '../utilities/rest';

// Charger une liste
fetchJsonGet('user/list', { search: 'kai' }, (data) => setUsers(data));

// Sauvegarder une entité
fetchJsonPost('user/save', { id: 1, username: 'kai' }, (data) => console.log('sauvegardé', data));

// GET simple pour un téléchargement de fichier
fetchGet('export/excel', { id: 123 }, () => setDownloading(false));

Le module est importé dans l'ensemble du frontend React — carnet d'adresses, calendrier, feuilles de temps, gestion des utilisateurs, sondages, scripts, et toutes les IUs des plugins. Au moment de la rédaction, environ 40+ composants React importent depuis ce fichier. Tout changement dans la logique de construction d'URL (par exemple, changer le préfixe REST de /rs vers autre chose) affecterait chaque appel API de l'application.