Fix : problème d'ascenseur en bas de la page au niveau des templates

Sélection du template par défaut lors de la création d'une page en fonction du dossier Passage v0.6.2
2026-04-25 01:39:05 +02:00
parent d24d6459a0
commit 88278bd1dd
9 changed files with 132 additions and 25 deletions
--- a/web/src/app/services/lore.service.ts
+++ b/web/src/app/services/lore.service.ts
@@ -1,6 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable } from 'rxjs';
+import { shareReplay, tap } from 'rxjs/operators';
 import { Lore, LoreCreate, LoreNode, LoreNodeCreate } from './lore.model';

 /** Compte des entités qui seront supprimées en cascade avec un dossier. */
@@ -23,6 +24,11 @@ export interface LoreDeletionImpact {
 /**
 * Service HTTP pour la gestion des Lores.
 * Port de sortie vers le Backend Java (Architecture Hexagonale).
+ *
+ * Les lectures agrégées par la sidebar (getAllLores, getLoreById, getLoreNodes)
+ * sont mises en cache via `shareReplay(1)` pour éviter 5 fetchs redondants à
+ * chaque navigation interne. Toute mutation (create/update/delete) invalide
+ * l'ensemble du cache du service.
 */
@Injectable({
  providedIn: 'root'
@@ -31,26 +37,51 @@ export class LoreService {
  private apiUrl = '/api/lores';
  private nodesUrl = '/api/lore-nodes';

+  private allLoresCache: Observable<Lore[]> | null = null;
+  private loreByIdCache = new Map<string, Observable<Lore>>();
+  private nodesByLoreIdCache = new Map<string, Observable<LoreNode[]>>();
+
  constructor(private http: HttpClient) {}

+  /** Vide tous les caches de lecture — appelé après toute mutation. */
+  private invalidate(): void {
+    this.allLoresCache = null;
+    this.loreByIdCache.clear();
+    this.nodesByLoreIdCache.clear();
+  }
+
  getAllLores(): Observable<Lore[]> {
-    return this.http.get<Lore[]>(this.apiUrl);
+    if (!this.allLoresCache) {
+      this.allLoresCache = this.http.get<Lore[]>(this.apiUrl).pipe(
+        tap({ error: () => (this.allLoresCache = null) }),
+        shareReplay(1)
+      );
+    }
+    return this.allLoresCache;
  }

  getLoreById(id: string): Observable<Lore> {
-    return this.http.get<Lore>(`${this.apiUrl}/${id}`);
+    let obs = this.loreByIdCache.get(id);
+    if (!obs) {
+      obs = this.http.get<Lore>(`${this.apiUrl}/${id}`).pipe(
+        tap({ error: () => this.loreByIdCache.delete(id) }),
+        shareReplay(1)
+      );
+      this.loreByIdCache.set(id, obs);
+    }
+    return obs;
  }

  createLore(lore: LoreCreate): Observable<Lore> {
-    return this.http.post<Lore>(this.apiUrl, lore);
+    return this.http.post<Lore>(this.apiUrl, lore).pipe(tap(() => this.invalidate()));
  }

  updateLore(id: string, lore: LoreCreate): Observable<Lore> {
-    return this.http.put<Lore>(`${this.apiUrl}/${id}`, lore);
+    return this.http.put<Lore>(`${this.apiUrl}/${id}`, lore).pipe(tap(() => this.invalidate()));
  }

  deleteLore(id: string): Observable<void> {
-    return this.http.delete<void>(`${this.apiUrl}/${id}`);
+    return this.http.delete<void>(`${this.apiUrl}/${id}`).pipe(tap(() => this.invalidate()));
  }

  getLoreDeletionImpact(id: string): Observable<LoreDeletionImpact> {
@@ -58,7 +89,15 @@ export class LoreService {
  }

  getLoreNodes(loreId: string): Observable<LoreNode[]> {
-    return this.http.get<LoreNode[]>(`${this.nodesUrl}?loreId=${loreId}`);
+    let obs = this.nodesByLoreIdCache.get(loreId);
+    if (!obs) {
+      obs = this.http.get<LoreNode[]>(`${this.nodesUrl}?loreId=${loreId}`).pipe(
+        tap({ error: () => this.nodesByLoreIdCache.delete(loreId) }),
+        shareReplay(1)
+      );
+      this.nodesByLoreIdCache.set(loreId, obs);
+    }
+    return obs;
  }

  getLoreNodeById(id: string): Observable<LoreNode> {
@@ -66,16 +105,16 @@ export class LoreService {
  }

  createLoreNode(node: LoreNodeCreate): Observable<LoreNode> {
-    return this.http.post<LoreNode>(this.nodesUrl, node);
+    return this.http.post<LoreNode>(this.nodesUrl, node).pipe(tap(() => this.invalidate()));
  }

  /** PUT complet — envoie l'objet entier au backend (qui attend un LoreNodeDTO). */
  updateLoreNode(id: string, node: LoreNode): Observable<LoreNode> {
-    return this.http.put<LoreNode>(`${this.nodesUrl}/${id}`, node);
+    return this.http.put<LoreNode>(`${this.nodesUrl}/${id}`, node).pipe(tap(() => this.invalidate()));
  }

  deleteLoreNode(id: string): Observable<void> {
-    return this.http.delete<void>(`${this.nodesUrl}/${id}`);
+    return this.http.delete<void>(`${this.nodesUrl}/${id}`).pipe(tap(() => this.invalidate()));
  }

  getLoreNodeDeletionImpact(id: string): Observable<LoreNodeDeletionImpact> {
--- a/web/src/app/services/page.service.ts
+++ b/web/src/app/services/page.service.ts
@@ -1,23 +1,40 @@
 import { Injectable } from '@angular/core';
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { map, shareReplay, tap } from 'rxjs/operators';
 import { Page, PageCreate } from './page.model';

 /**
 * Service HTTP pour la gestion des Pages.
 * Port de sortie du Frontend vers le Backend Java (/api/pages).
+ *
+ * `getByLoreId` est cache via shareReplay(1) — toute mutation
+ * (create/update/delete) invalide l'ensemble du cache.
 */
@Injectable({ providedIn: 'root' })
 export class PageService {
  private apiUrl = '/api/pages';

+  private byLoreIdCache = new Map<string, Observable<Page[]>>();
+
  constructor(private http: HttpClient) {}

+  private invalidate(): void {
+    this.byLoreIdCache.clear();
+  }
+
  /** Toutes les pages d'un Lore (flat, pour répartir ensuite par nodeId). */
  getByLoreId(loreId: string): Observable<Page[]> {
-    const params = new HttpParams().set('loreId', loreId);
-    return this.http.get<Page[]>(this.apiUrl, { params });
+    let obs = this.byLoreIdCache.get(loreId);
+    if (!obs) {
+      const params = new HttpParams().set('loreId', loreId);
+      obs = this.http.get<Page[]>(this.apiUrl, { params }).pipe(
+        tap({ error: () => this.byLoreIdCache.delete(loreId) }),
+        shareReplay(1)
+      );
+      this.byLoreIdCache.set(loreId, obs);
+    }
+    return obs;
  }

  /** Toutes les pages d'un noeud donné. */
@@ -31,15 +48,15 @@ export class PageService {
  }

  create(payload: PageCreate): Observable<Page> {
-    return this.http.post<Page>(this.apiUrl, payload);
+    return this.http.post<Page>(this.apiUrl, payload).pipe(tap(() => this.invalidate()));
  }

  update(id: string, page: Page): Observable<Page> {
-    return this.http.put<Page>(`${this.apiUrl}/${id}`, page);
+    return this.http.put<Page>(`${this.apiUrl}/${id}`, page).pipe(tap(() => this.invalidate()));
  }

  delete(id: string): Observable<void> {
-    return this.http.delete<void>(`${this.apiUrl}/${id}`);
+    return this.http.delete<void>(`${this.apiUrl}/${id}`).pipe(tap(() => this.invalidate()));
  }

  search(q: string): Observable<Page[]> {
--- a/web/src/app/services/template.service.ts
+++ b/web/src/app/services/template.service.ts
@@ -1,22 +1,40 @@
 import { Injectable } from '@angular/core';
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable } from 'rxjs';
+import { shareReplay, tap } from 'rxjs/operators';
 import { Template, TemplateCreate } from './template.model';

 /**
 * Service HTTP pour la gestion des Templates.
 * Port de sortie du Frontend vers le Backend Java (/api/templates).
+ *
+ * `getByLoreId` est cache via shareReplay(1) — toute mutation
+ * (create/update/delete) invalide l'ensemble du cache.
 */
@Injectable({ providedIn: 'root' })
 export class TemplateService {
  private apiUrl = '/api/templates';

+  private byLoreIdCache = new Map<string, Observable<Template[]>>();
+
  constructor(private http: HttpClient) {}

+  private invalidate(): void {
+    this.byLoreIdCache.clear();
+  }
+
  /** Tous les templates d'un Lore (alimente le panneau sidebar). */
  getByLoreId(loreId: string): Observable<Template[]> {
-    const params = new HttpParams().set('loreId', loreId);
-    return this.http.get<Template[]>(this.apiUrl, { params });
+    let obs = this.byLoreIdCache.get(loreId);
+    if (!obs) {
+      const params = new HttpParams().set('loreId', loreId);
+      obs = this.http.get<Template[]>(this.apiUrl, { params }).pipe(
+        tap({ error: () => this.byLoreIdCache.delete(loreId) }),
+        shareReplay(1)
+      );
+      this.byLoreIdCache.set(loreId, obs);
+    }
+    return obs;
  }

  getById(id: string): Observable<Template> {
@@ -24,15 +42,15 @@ export class TemplateService {
  }

  create(payload: TemplateCreate): Observable<Template> {
-    return this.http.post<Template>(this.apiUrl, payload);
+    return this.http.post<Template>(this.apiUrl, payload).pipe(tap(() => this.invalidate()));
  }

  update(id: string, template: Template): Observable<Template> {
-    return this.http.put<Template>(`${this.apiUrl}/${id}`, template);
+    return this.http.put<Template>(`${this.apiUrl}/${id}`, template).pipe(tap(() => this.invalidate()));
  }

  delete(id: string): Observable<void> {
-    return this.http.delete<void>(`${this.apiUrl}/${id}`);
+    return this.http.delete<void>(`${this.apiUrl}/${id}`).pipe(tap(() => this.invalidate()));
  }

  search(q: string): Observable<Template[]> {